@grafloria/element 0.3.18 → 0.3.20

package/src/libs/engine/src/interaction/SemanticMembershipService.js

@@ -0,0 +1,168 @@
+"use strict";
+// SemanticMembershipService — Wave-5 Card 7: rule-driven semantic membership.
+//
+// A group can declare a SERIALIZABLE predicate over node data (MembershipRule —
+// a declarative matcher object, never eval'd code). This service keeps that
+// group's membership in sync with the data REACTIVELY (subscribes to the model's
+// node change/add/remove events — never polls). Auto-membership coexists with
+// manual membership: nodes added by a rule are tagged, and only tagged members
+// are auto-removed when they stop matching; manual members are never touched.
+//
+// Capacity/WIP limits (GroupModel.capacity) are enforced through the same
+// GroupModel.canAddMember seam GroupMembershipService uses, so a full lane both
+// reports a warning state (GroupModel.getWipState) and rejects auto-adds/drops.
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SemanticMembershipService = void 0;
+exports.matchesRule = matchesRule;
+/** Node metadata key holding the group ids a node was AUTO-added to. */
+const AUTO_MEMBER_KEY = '__autoMemberOf';
+/** Evaluate a declarative rule against a node's `data`. Pure + serializable. */
+function matchesRule(rule, node) {
+    if ('all' in rule) {
+        return rule.all.every((r) => matchesRule(r, node));
+    }
+    if ('any' in rule) {
+        return rule.any.some((r) => matchesRule(r, node));
+    }
+    if ('not' in rule) {
+        return !matchesRule(rule.not, node);
+    }
+    return matchesLeaf(rule, node);
+}
+function matchesLeaf(leaf, node) {
+    const v = node.getData(leaf.field);
+    const operand = leaf.value;
+    switch (leaf.op) {
+        case 'exists':
+            return v !== undefined && v !== null;
+        case 'eq':
+            return v === operand;
+        case 'ne':
+            return v !== operand;
+        case 'in':
+            return Array.isArray(operand) && operand.includes(v);
+        case 'nin':
+            return Array.isArray(operand) && !operand.includes(v);
+        case 'gt':
+            return typeof v === 'number' && typeof operand === 'number' && v > operand;
+        case 'gte':
+            return typeof v === 'number' && typeof operand === 'number' && v >= operand;
+        case 'lt':
+            return typeof v === 'number' && typeof operand === 'number' && v < operand;
+        case 'lte':
+            return typeof v === 'number' && typeof operand === 'number' && v <= operand;
+        case 'matches':
+            try {
+                return new RegExp(String(operand)).test(String(v !== null && v !== void 0 ? v : ''));
+            }
+            catch (_a) {
+                return false;
+            }
+        default:
+            return false;
+    }
+}
+class SemanticMembershipService {
+    constructor(diagram) {
+        this.diagram = diagram;
+        this.managed = new Set();
+        this.diagramDisposers = [];
+        this.evaluating = false;
+    }
+    /**
+     * Start managing `group`'s auto-membership from its serialized
+     * `membershipRule`. Runs an initial sweep and then keeps in sync reactively.
+     * No-op if the group has no rule. Returns a disposer that stops managing it.
+     */
+    register(group) {
+        if (!group.membershipRule) {
+            return () => undefined;
+        }
+        this.managed.add(group.id);
+        this.ensureSubscribed();
+        this.evaluateGroup(group);
+        return () => this.managed.delete(group.id);
+    }
+    /** Stop managing every group and detach all model listeners. */
+    dispose() {
+        this.managed.clear();
+        for (const off of this.diagramDisposers.splice(0))
+            off();
+    }
+    /** Re-evaluate a single node against every managed rule-group. */
+    evaluateNode(node) {
+        if (this.evaluating)
+            return;
+        this.evaluating = true;
+        try {
+            for (const groupId of this.managed) {
+                const group = this.diagram.getGroup(groupId);
+                if (group === null || group === void 0 ? void 0 : group.membershipRule) {
+                    this.applyMembership(group, node, matchesRule(group.membershipRule, node));
+                }
+            }
+        }
+        finally {
+            this.evaluating = false;
+        }
+    }
+    /** Re-evaluate every node against one group's rule. */
+    evaluateGroup(group) {
+        if (!group.membershipRule)
+            return;
+        const wasEvaluating = this.evaluating;
+        this.evaluating = true;
+        try {
+            for (const node of this.diagram.getNodes()) {
+                this.applyMembership(group, node, matchesRule(group.membershipRule, node));
+            }
+        }
+        finally {
+            this.evaluating = wasEvaluating;
+        }
+    }
+    applyMembership(group, node, matches) {
+        const isMember = group.members.has(node.id);
+        const isAuto = this.autoGroups(node).includes(group.id);
+        if (matches && !isMember) {
+            // Honor capacity/validation — a full lane simply won't auto-absorb.
+            if (group.canAddMember(node.id, this.diagram)) {
+                group.addMember(node.id, this.diagram);
+                this.tagAuto(node, group.id, true);
+            }
+            return;
+        }
+        if (!matches && isMember && isAuto) {
+            // Only auto-added members are auto-removed; manual membership is sacred.
+            group.removeMember(node.id, this.diagram);
+            this.tagAuto(node, group.id, false);
+        }
+    }
+    autoGroups(node) {
+        const raw = node.getMetadata(AUTO_MEMBER_KEY);
+        return Array.isArray(raw) ? raw : [];
+    }
+    tagAuto(node, groupId, on) {
+        const current = this.autoGroups(node);
+        const next = on
+            ? current.includes(groupId)
+                ? current
+                : [...current, groupId]
+            : current.filter((id) => id !== groupId);
+        if (next.length === current.length && on)
+            return;
+        node.setMetadata(AUTO_MEMBER_KEY, next);
+    }
+    ensureSubscribed() {
+        if (this.diagramDisposers.length > 0)
+            return;
+        const onNode = (node) => {
+            if (node && !this.diagram.isProxyNode(node))
+                this.evaluateNode(node);
+        };
+        this.diagramDisposers.push(this.diagram.on('node:added', onNode));
+        this.diagramDisposers.push(this.diagram.on('node:changed', onNode));
+    }
+}
+exports.SemanticMembershipService = SemanticMembershipService;
+//# sourceMappingURL=SemanticMembershipService.js.map

package/src/libs/engine/src/interaction/SwimlaneService.d.ts

@@ -0,0 +1,62 @@
+import type { DiagramModel } from '../models/DiagramModel';
+import { GroupModel, type GroupRect } from '../models/GroupModel';
+export type LaneOrientation = 'horizontal' | 'vertical';
+export interface LaneSpec {
+    /** Optional explicit id (else generated). */
+    id?: string;
+    name: string;
+    /** Relative cross-axis size (default 1). */
+    weight?: number;
+    /** Absolute cross-axis size (pins the band, overrides weight). */
+    fixedSize?: number;
+}
+export interface CreatePoolOptions {
+    id?: string;
+    name: string;
+    orientation: LaneOrientation;
+    /** Pool frame in world coords. */
+    bounds: GroupRect;
+    lanes: LaneSpec[];
+    /** Title-band thickness along the main-axis start (left for horizontal). */
+    headerSize?: number;
+    /** Reserve a header band inside each lane (Card 3 headerHeight). Default 0. */
+    laneHeaderSize?: number;
+}
+export interface Pool {
+    pool: GroupModel;
+    lanes: GroupModel[];
+}
+export declare class SwimlaneService {
+    private readonly diagram;
+    constructor(diagram: DiagramModel);
+    /** Create a pool group with N lane bands and tile them. */
+    createPool(options: CreatePoolOptions): Pool;
+    /** Add a lane to a pool (optionally at an index) and re-tile. */
+    addLane(pool: GroupModel, spec: LaneSpec, atIndex?: number): GroupModel;
+    /** Remove a lane from a pool and re-tile the survivors. */
+    removeLane(pool: GroupModel, laneId: string): void;
+    /**
+     * Resize a lane along the cross axis by pinning its band (fixedSize) and
+     * re-laying out the pool so siblings absorb the remaining space.
+     */
+    resizeLane(pool: GroupModel, laneId: string, crossSize: number): void;
+    /** Resize the whole pool and re-tile its lanes to the new frame. */
+    resizePool(pool: GroupModel, bounds: GroupRect): void;
+    /** Lanes of a pool in band order. */
+    getLanes(pool: GroupModel): GroupModel[];
+    /** Is this group a pool? */
+    isPool(group: GroupModel): boolean;
+    /** Is this group a lane? */
+    isLane(group: GroupModel): boolean;
+    /**
+     * Re-tile a pool's lanes into bands. fixedSize lanes take their pixel size;
+     * the rest split the remaining cross-axis space by weight. Each lane frame is
+     * set (drop-in hit-testing + drag constraints follow automatically).
+     */
+    reflow(pool: GroupModel): void;
+    private buildLane;
+    private firstLaneHeader;
+    private assertPool;
+    /** Mark a group changed so the diff-capture serializes laneConfig edits. */
+    private touch;
+}

package/src/libs/engine/src/interaction/SwimlaneService.js

@@ -0,0 +1,180 @@
+"use strict";
+// SwimlaneService — Wave-5 Card 6: first-class swimlanes & pools.
+//
+// A POOL is an ordinary GroupModel that tiles its child LANE groups into bands
+// along one axis; each LANE is an ordinary group. Keeping them ordinary groups
+// means drop-to-assign, membership, nesting and drag-constraints all REUSE the
+// existing machinery (GroupMembershipService hit-tests the innermost group — a
+// lane — and re-parents the node into it; lanes set constrainChildren=true so
+// Card 3 clamping pins members to the band).
+//
+// The data model is generic (bands + orientation), not BPMN-specific: a "pool"
+// is just a banded container and a "lane" a band. BPMN pools/lanes, Kanban
+// columns and matrix rows are all the same shape.
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SwimlaneService = void 0;
+const GroupModel_1 = require("../models/GroupModel");
+class SwimlaneService {
+    constructor(diagram) {
+        this.diagram = diagram;
+    }
+    /** Create a pool group with N lane bands and tile them. */
+    createPool(options) {
+        var _a, _b;
+        const pool = new GroupModel_1.GroupModel({ id: options.id, name: options.name });
+        pool.laneConfig = {
+            role: 'pool',
+            orientation: options.orientation,
+            laneOrder: [],
+            headerSize: (_a = options.headerSize) !== null && _a !== void 0 ? _a : 0,
+        };
+        pool.setFrame(options.bounds);
+        this.diagram.addGroup(pool);
+        const lanes = [];
+        for (const spec of options.lanes) {
+            const lane = this.buildLane(pool, spec, (_b = options.laneHeaderSize) !== null && _b !== void 0 ? _b : 0);
+            lanes.push(lane);
+        }
+        pool.laneConfig.laneOrder = lanes.map((l) => l.id);
+        this.reflow(pool);
+        return { pool, lanes };
+    }
+    /** Add a lane to a pool (optionally at an index) and re-tile. */
+    addLane(pool, spec, atIndex) {
+        var _a;
+        this.assertPool(pool);
+        const lane = this.buildLane(pool, spec, this.firstLaneHeader(pool));
+        const order = (_a = pool.laneConfig.laneOrder) !== null && _a !== void 0 ? _a : [];
+        if (atIndex === undefined || atIndex >= order.length) {
+            order.push(lane.id);
+        }
+        else {
+            order.splice(Math.max(0, atIndex), 0, lane.id);
+        }
+        pool.laneConfig.laneOrder = order;
+        this.touch(pool);
+        this.reflow(pool);
+        return lane;
+    }
+    /** Remove a lane from a pool and re-tile the survivors. */
+    removeLane(pool, laneId) {
+        var _a;
+        this.assertPool(pool);
+        const order = ((_a = pool.laneConfig.laneOrder) !== null && _a !== void 0 ? _a : []).filter((id) => id !== laneId);
+        pool.laneConfig.laneOrder = order;
+        pool.removeMember(laneId, this.diagram);
+        this.diagram.removeGroup(laneId);
+        this.touch(pool);
+        this.reflow(pool);
+    }
+    /**
+     * Resize a lane along the cross axis by pinning its band (fixedSize) and
+     * re-laying out the pool so siblings absorb the remaining space.
+     */
+    resizeLane(pool, laneId, crossSize) {
+        this.assertPool(pool);
+        const lane = this.diagram.getGroup(laneId);
+        if (!lane || !lane.laneConfig)
+            return;
+        lane.laneConfig = Object.assign(Object.assign({}, lane.laneConfig), { fixedSize: Math.max(0, crossSize) });
+        this.touch(lane);
+        this.reflow(pool);
+    }
+    /** Resize the whole pool and re-tile its lanes to the new frame. */
+    resizePool(pool, bounds) {
+        this.assertPool(pool);
+        pool.setFrame(bounds);
+        this.reflow(pool);
+    }
+    /** Lanes of a pool in band order. */
+    getLanes(pool) {
+        var _a;
+        this.assertPool(pool);
+        return ((_a = pool.laneConfig.laneOrder) !== null && _a !== void 0 ? _a : [])
+            .map((id) => this.diagram.getGroup(id))
+            .filter((g) => !!g);
+    }
+    /** Is this group a pool? */
+    isPool(group) {
+        var _a;
+        return ((_a = group.laneConfig) === null || _a === void 0 ? void 0 : _a.role) === 'pool';
+    }
+    /** Is this group a lane? */
+    isLane(group) {
+        var _a;
+        return ((_a = group.laneConfig) === null || _a === void 0 ? void 0 : _a.role) === 'lane';
+    }
+    /**
+     * Re-tile a pool's lanes into bands. fixedSize lanes take their pixel size;
+     * the rest split the remaining cross-axis space by weight. Each lane frame is
+     * set (drop-in hit-testing + drag constraints follow automatically).
+     */
+    reflow(pool) {
+        var _a, _b;
+        this.assertPool(pool);
+        const cfg = pool.laneConfig;
+        const lanes = this.getLanes(pool);
+        if (lanes.length === 0)
+            return;
+        const rect = pool.getOuterBounds();
+        const header = (_a = cfg.headerSize) !== null && _a !== void 0 ? _a : 0;
+        const horizontal = cfg.orientation === 'horizontal';
+        // Cross axis = the axis lanes are stacked along; main axis = the span each
+        // lane fills. Horizontal lanes (rows) stack along Y and span X; vertical
+        // lanes (columns) stack along X and span Y. The pool header is a band at
+        // the main-axis start (left for horizontal, top for vertical).
+        const crossTotal = horizontal ? rect.height : rect.width;
+        const mainStart = horizontal ? rect.x + header : rect.y + header;
+        const mainSpan = (horizontal ? rect.width : rect.height) - header;
+        const fixed = lanes.reduce((s, l) => { var _a, _b; return s + ((_b = (_a = l.laneConfig) === null || _a === void 0 ? void 0 : _a.fixedSize) !== null && _b !== void 0 ? _b : 0); }, 0);
+        const flexible = lanes.filter((l) => { var _a; return ((_a = l.laneConfig) === null || _a === void 0 ? void 0 : _a.fixedSize) === undefined; });
+        const totalWeight = flexible.reduce((s, l) => { var _a, _b; return s + ((_b = (_a = l.laneConfig) === null || _a === void 0 ? void 0 : _a.weight) !== null && _b !== void 0 ? _b : 1); }, 0) || 1;
+        const flexSpace = Math.max(0, crossTotal - fixed);
+        let cross = horizontal ? rect.y : rect.x;
+        for (const lane of lanes) {
+            const lc = lane.laneConfig;
+            const size = lc.fixedSize !== undefined ? lc.fixedSize : (flexSpace * ((_b = lc.weight) !== null && _b !== void 0 ? _b : 1)) / totalWeight;
+            const frame = horizontal
+                ? { x: mainStart, y: cross, width: mainSpan, height: size }
+                : { x: cross, y: mainStart, width: size, height: mainSpan };
+            lane.setFrame(frame);
+            // Lanes constrain their members to the band (Card 3 clamping).
+            lane.constrainChildren = true;
+            // Keep each lane's orientation in sync for downstream consumers.
+            lane.laneConfig = Object.assign(Object.assign({}, lc), { orientation: cfg.orientation });
+            cross += size;
+        }
+    }
+    buildLane(pool, spec, laneHeader) {
+        const lane = new GroupModel_1.GroupModel({ id: spec.id, name: spec.name });
+        lane.laneConfig = {
+            role: 'lane',
+            orientation: pool.laneConfig.orientation,
+            weight: spec.weight,
+            fixedSize: spec.fixedSize,
+        };
+        lane.headerHeight = laneHeader;
+        lane.constrainChildren = true;
+        this.diagram.addGroup(lane);
+        pool.addMember(lane.id, this.diagram); // sets parentGroupId = pool.id
+        return lane;
+    }
+    firstLaneHeader(pool) {
+        var _a;
+        const first = this.getLanes(pool)[0];
+        return (_a = first === null || first === void 0 ? void 0 : first.headerHeight) !== null && _a !== void 0 ? _a : 0;
+    }
+    assertPool(group) {
+        var _a;
+        if (((_a = group.laneConfig) === null || _a === void 0 ? void 0 : _a.role) !== 'pool') {
+            throw new Error(`Group ${group.id} is not a pool`);
+        }
+    }
+    /** Mark a group changed so the diff-capture serializes laneConfig edits. */
+    touch(group) {
+        var _a;
+        group.setMetadata('__laneRev', ((_a = group.getMetadata('__laneRev')) !== null && _a !== void 0 ? _a : 0) + 1);
+    }
+}
+exports.SwimlaneService = SwimlaneService;
+//# sourceMappingURL=SwimlaneService.js.map

package/src/libs/engine/src/interaction/index.d.ts

@@ -0,0 +1,4 @@
+export * from './GroupMembershipService';
+export * from './GroupCollapseService';
+export * from './SwimlaneService';
+export * from './SemanticMembershipService';

package/src/libs/engine/src/interaction/index.js

@@ -0,0 +1,9 @@
+"use strict";
+// Interaction module exports (Wave-2)
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./GroupMembershipService"), exports);
+tslib_1.__exportStar(require("./GroupCollapseService"), exports);
+tslib_1.__exportStar(require("./SwimlaneService"), exports);
+tslib_1.__exportStar(require("./SemanticMembershipService"), exports);
+//# sourceMappingURL=index.js.map

package/src/libs/engine/src/interop/drawio/importDrawio.d.ts

@@ -0,0 +1,52 @@
+import { DiagramModel } from '../../models/DiagramModel';
+/** One page of a multi-page file, decoded and compiled on its own. */
+export interface DrawioPage {
+    /** The page's `name` attribute, or "Page N" when the file has none. */
+    name: string;
+    /** Zero-based position of the page in the file. */
+    index: number;
+    /** The page's imported diagram — absent when `error` is set. */
+    diagram?: DiagramModel;
+    /** This page's own named-loss warnings. */
+    warnings: string[];
+    /** Fatal FOR THIS PAGE only: the page payload is not readable. */
+    error?: string;
+}
+export interface DrawioImportResult {
+    /** The imported diagram (page 1 of a multi-page file) — absent when `error` is set. */
+    diagram?: DiagramModel;
+    /**
+     * Every construct the import dropped or approximated, one NAMED entry each.
+     * Empty means the file mapped cleanly. For a multi-page file: page 1's
+     * warnings plus the file-level ones (including any later page's failure).
+     */
+    warnings: string[];
+    /** Fatal: the text is not a readable .drawio document. Never thrown. */
+    error?: string;
+    /**
+     * Present ONLY when the file carries more than one `<diagram>` page.
+     * `diagram === pages[0].diagram`; every page imports independently.
+     */
+    pages?: DrawioPage[];
+}
+/**
+ * `value="<b>Start</b><br>here"` must become "Start here", not carry markup
+ * into the label canon. Block/line-break boundaries turn into single spaces so
+ * words do not fuse.
+ *
+ * Entities are decoded a SECOND time here, after the tags are gone. The XML
+ * reader already decoded one level — but with `html=1` (draw.io's default) the
+ * value is an HTML FRAGMENT, so an author's literal `&` was double-encoded on
+ * save (`&amp;amp;`) and one decode still leaves `&amp;` in the label.
+ */
+export declare function stripHtmlToText(value: string): string;
+/**
+ * Import a .drawio / mxGraph XML document.
+ *
+ * Accepts plain `<mxGraphModel>` XML or a full `<mxfile>` (compressed or not).
+ * A multi-page file imports EVERY page: `diagram` is page 1 (back-compatible)
+ * and `pages[]` — present only when the file has more than one `<diagram>` —
+ * carries each page's own diagram, warnings, and (for a corrupt page) error.
+ * Never throws: unreadable input comes back as `{ error }`.
+ */
+export declare function importDrawio(text: string): Promise<DrawioImportResult>;