@formicoidea/labre-framework-bpmn 0.58.0 → 0.59.0

package/dist/actions.d.ts

@@ -19,7 +19,9 @@ export declare function createBpmnPool(std: BlockStdScope): void;
 /**
  * Arm the native connector tool, pre-styled for a BPMN sequence flow:
  * orthogonal, solid, with a filled triangle head. The user then draws from
- * one node to another (endpoints attach to centers).
+ * one node to another, attaching at the anchor of each outline they pick (a
+ * gateway's corners, an activity's side midpoints, an event's cardinal points;
+ * `BPMN_CENTRE_ANCHORED`).
  */
 export declare function activateBpmnSequenceFlow(std: BlockStdScope): void;
 /**
@@ -102,12 +104,14 @@ export declare function bpmnPoolsForLaneEdit(std: BlockStdScope): BpmnPoolElemen
  */
 export declare function addBpmnLane(std: BlockStdScope): void;
 /**
- * Remove the LAST lane of every selected pool.
+ * Remove the FOCUSED lane of every selected pool, or its LAST lane when none is
+ * focused.
  *
- * The last one and not the selected one, because a lane is not selectable: it
- * is a slice of the pool's plot, painted by the background primitive, with no
- * element of its own. Removing from the end is the gesture that undoes the one
- * that added it.
+ * Focused and not selected, because a lane is not selectable: it is a slice of
+ * the pool's plot, painted by the background primitive, with no element of its
+ * own. A single click on its title strip, in a selected pool, focuses it
+ * ({@link bpmnFocusedLaneIndex}). With nothing focused, removing from the end
+ * is the gesture that undoes the one that added it.
  *
  * ## Nothing moves
  *
@@ -221,3 +225,69 @@ export declare function importBpmnSvgFile(std: BlockStdScope): Promise<void>;
  * same thing that only the bytes can tell apart.
  */
 export declare function renameBpmnLane(std: BlockStdScope, model: BpmnPoolElementModel, index: number, name: string): void;
+/**
+ * Move the lane at `from` to `to` inside `pool`, carrying what is drawn in it.
+ *
+ * A lane is a slice of the pool's plot, and what is "in" it is decided by
+ * geometry: the centre of an artefact, read by {@link bpmnLaneOf}. Reordering
+ * the `lanes` array alone would leave every task where it was on the canvas and
+ * silently hand it to whichever lane now covers that spot — the user moves the
+ * Sales lane up and finds their sales tasks filed under Ops. So the gesture
+ * moves both: the array is reordered, and every unlocked artefact wholly inside
+ * the pool is translated by the vertical shift of the lane its centre was in.
+ * Connectors attached to them follow through the connector watcher, as on any
+ * other move.
+ *
+ * A GESTURE-time write, not a cascade: it runs once, on the author's client,
+ * from a command, and a peer receives the reorder and the moves as ordinary
+ * updates. No stored-format change either: the same `lanes` array, the same
+ * `xywh` props.
+ *
+ * One `captureSync`, then one `transact`, so the reorder and every move are ONE
+ * undo step. Refused — and nothing written, so no empty undo entry — on a
+ * read-only document, a locked pool, an index that names no lane, or a move to
+ * where the lane already is. Returns whether it wrote.
+ *
+ * ponytail: a connector attached to nothing, drawn inside a lane, stays where
+ * it is, and a locked artefact is left behind; the upgrade is to translate the
+ * free endpoints too, here and nowhere else.
+ */
+export declare function moveBpmnLane(std: BlockStdScope, pool: BpmnPoolElementModel, from: number, to: number): boolean;
+/**
+ * Something that knows which lane of a pool is FOCUSED — the pool's view
+ * (`BpmnPoolView`) in an editor, a plain object in a test.
+ *
+ * A lane is not an element, so it cannot be selected; the lane commands need
+ * another way to know which lane the user means. The focus is set by a single
+ * click on a lane's title strip in a selected pool, and it is on-screen state
+ * and nothing more: held by the view, never stored, never synced, dropped when
+ * the pool is deselected. Another viewer of the same document has their own or
+ * none. An id rather than an index, so the focus follows the lane it names
+ * through a move.
+ */
+export interface BpmnLaneFocusHolder {
+    readonly focusedLaneId: string | null;
+}
+/**
+ * The index of `pool`'s focused lane in this editor, or `null` when none is
+ * focused or the focused one is gone (removed by a peer, undone away).
+ *
+ * Read through {@link BpmnLaneFocusHolder} rather than the view class, so the
+ * commands do not import the view.
+ */
+export declare function bpmnFocusedLaneIndex(std: BlockStdScope, pool: BpmnPoolElementModel): number | null;
+/**
+ * The selected pool whose focused lane can move one step `by` (`-1` up, `1`
+ * down), and the lane's index — `null` when no such pool is selected.
+ *
+ * The first one that qualifies: a lane is focused by clicking it, on one pool
+ * at a time, so a selection holding two pools still names at most one lane.
+ */
+export declare function bpmnLaneToMove(std: BlockStdScope, by: -1 | 1): {
+    pool: BpmnPoolElementModel;
+    index: number;
+} | null;
+/** Move the focused lane of the selected pool one step up. */
+export declare function moveBpmnLaneUp(std: BlockStdScope): void;
+/** Move the focused lane of the selected pool one step down. */
+export declare function moveBpmnLaneDown(std: BlockStdScope): void;

package/dist/actions.js

@@ -1,13 +1,15 @@
-import { DefaultTool, EdgelessCRUDIdentifier, generateElementId, materializeInterchangeImport, reportInterchangeImport, runInterchangeImportFile, } from '@formicoidea/labre-core/blocks/surface';
+import { backgroundInstanceZones, backgroundPlot, DefaultTool, EdgelessCRUDIdentifier, generateElementId, materializeInterchangeImport, reportInterchangeImport, runInterchangeImportFile, } from '@formicoidea/labre-core/blocks/surface';
 import { ConnectorTool } from '@formicoidea/labre-core/gfx/connector';
 import { createGroupCommand } from '@formicoidea/labre-core/gfx/group';
-import { BpmnPoolElementModel, ConnectorMode, } from '@formicoidea/labre-core/model';
+import { BpmnPoolElementModel, ConnectorElementModel, ConnectorMode, } from '@formicoidea/labre-core/model';
 import { NotificationProvider, translateKey, } from '@formicoidea/labre-core/shared/services';
 import { downloadBlob } from '@formicoidea/labre-core/shared/utils';
 import { Bound } from '@formicoidea/labre-core/global/gfx';
-import { GfxControllerIdentifier } from '@formicoidea/labre-core/std/gfx';
+import { GfxControllerIdentifier, GfxGroupLikeElementModel, } from '@formicoidea/labre-core/std/gfx';
+import { BPMN_POOL_BACKGROUND } from './background.js';
 import { BPMN_EDGE_STYLE, bpmnLabelMode, LANE_NAME_FALLBACK, LANE_NAME_KEY, NODE_LABEL, nodeLabelKey, NODE_SIZE, POOL_NAME_FALLBACK, POOL_NAME_KEY, } from './consts.js';
 import { BPMN_FORMAT_ID, exportBpmnXmlWithWarnings, } from './export.js';
+import { bpmnLaneOf } from './facts.js';
 import { BPMN_SVG_IMPORT, BPMN_XML_EXPORT, BPMN_XML_FORMAT, BPMN_XML_IMPORT, bpmnBoardFrom, bpmnSafeFilename, } from './interchange.js';
 import { bpmnLabelBoxFor, bpmnLabelProps, bpmnNodeProps, bpmnPoolProps, } from './presets.js';
 import { BPMN_ROLE } from './roles.js';
@@ -105,7 +107,9 @@ export function createBpmnPool(std) {
 /**
  * Arm the native connector tool, pre-styled for a BPMN sequence flow:
  * orthogonal, solid, with a filled triangle head. The user then draws from
- * one node to another (endpoints attach to centers).
+ * one node to another, attaching at the anchor of each outline they pick (a
+ * gateway's corners, an activity's side midpoints, an event's cardinal points;
+ * `BPMN_CENTRE_ANCHORED`).
  */
 export function activateBpmnSequenceFlow(std) {
     gfxOf(std).tool.setTool(ConnectorTool, {
@@ -280,12 +284,14 @@ export function addBpmnLane(std) {
     }
 }
 /**
- * Remove the LAST lane of every selected pool.
+ * Remove the FOCUSED lane of every selected pool, or its LAST lane when none is
+ * focused.
  *
- * The last one and not the selected one, because a lane is not selectable: it
- * is a slice of the pool's plot, painted by the background primitive, with no
- * element of its own. Removing from the end is the gesture that undoes the one
- * that added it.
+ * Focused and not selected, because a lane is not selectable: it is a slice of
+ * the pool's plot, painted by the background primitive, with no element of its
+ * own. A single click on its title strip, in a selected pool, focuses it
+ * ({@link bpmnFocusedLaneIndex}). With nothing focused, removing from the end
+ * is the gesture that undoes the one that added it.
  *
  * ## Nothing moves
  *
@@ -304,7 +310,13 @@ export function removeBpmnLane(std) {
         return;
     std.store.captureSync();
     for (const model of withLanes) {
-        writeLanes(std, model, bpmnLanesOf(model).slice(0, -1));
+        const lanes = bpmnLanesOf(model);
+        // The FOCUSED lane when the user picked one (a click on its title strip),
+        // the last one otherwise — which is still the one the previous "Add lane"
+        // added.
+        const focused = bpmnFocusedLaneIndex(std, model);
+        const gone = focused ?? lanes.length - 1;
+        writeLanes(std, model, lanes.filter((_, i) => i !== gone));
     }
 }
 /* ── Export (BPMN 2.0 XML) ────────────────────────────────────────────── */
@@ -510,3 +522,126 @@ export function renameBpmnLane(std, model, index, name) {
     std.store.captureSync();
     writeLanes(std, model, next);
 }
+/**
+ * Move the lane at `from` to `to` inside `pool`, carrying what is drawn in it.
+ *
+ * A lane is a slice of the pool's plot, and what is "in" it is decided by
+ * geometry: the centre of an artefact, read by {@link bpmnLaneOf}. Reordering
+ * the `lanes` array alone would leave every task where it was on the canvas and
+ * silently hand it to whichever lane now covers that spot — the user moves the
+ * Sales lane up and finds their sales tasks filed under Ops. So the gesture
+ * moves both: the array is reordered, and every unlocked artefact wholly inside
+ * the pool is translated by the vertical shift of the lane its centre was in.
+ * Connectors attached to them follow through the connector watcher, as on any
+ * other move.
+ *
+ * A GESTURE-time write, not a cascade: it runs once, on the author's client,
+ * from a command, and a peer receives the reorder and the moves as ordinary
+ * updates. No stored-format change either: the same `lanes` array, the same
+ * `xywh` props.
+ *
+ * One `captureSync`, then one `transact`, so the reorder and every move are ONE
+ * undo step. Refused — and nothing written, so no empty undo entry — on a
+ * read-only document, a locked pool, an index that names no lane, or a move to
+ * where the lane already is. Returns whether it wrote.
+ *
+ * ponytail: a connector attached to nothing, drawn inside a lane, stays where
+ * it is, and a locked artefact is left behind; the upgrade is to translate the
+ * free endpoints too, here and nowhere else.
+ */
+export function moveBpmnLane(std, pool, from, to) {
+    if (std.store.readonly || pool.isLocked())
+        return false;
+    if (from === to)
+        return false;
+    const lanes = bpmnLanesOf(pool);
+    if (!lanes[from] || !lanes[to])
+        return false;
+    const next = [...lanes];
+    const [moved] = next.splice(from, 1);
+    next.splice(to, 0, moved);
+    // Each band's top, before and after, read off the painted partition: the
+    // normalisation the renderer and the audit use, so an artefact moves by
+    // exactly the distance its lane moves on the canvas.
+    const frame = pool.elementBound;
+    const plot = backgroundPlot(BPMN_POOL_BACKGROUND, frame.w, frame.h);
+    const topsOf = (rows) => new Map(backgroundInstanceZones(BPMN_POOL_BACKGROUND, { lanes: rows }).map(zone => [zone.id, zone.rect.y * plot.height]));
+    const before = topsOf(lanes);
+    const after = topsOf(next);
+    const prefix = BPMN_POOL_BACKGROUND.instanceZones?.idPrefix ?? 'lane';
+    // Membership BEFORE the write: once the array is reordered the bands are
+    // where the lanes are going, and a centre would read the wrong lane.
+    const moves = [];
+    for (const element of gfxOf(std).grid.search(frame, { strict: true })) {
+        if (element === pool || element.isLocked())
+            continue;
+        // A connector follows its endpoints; a group or a mind map derives its
+        // bound from its children, which are moved on their own.
+        if (element instanceof ConnectorElementModel)
+            continue;
+        if (element instanceof GfxGroupLikeElementModel)
+            continue;
+        const bound = Bound.deserialize(element.xywh);
+        const lane = bpmnLaneOf(pool, bound);
+        if (!lane)
+            continue;
+        const key = `${prefix}:${lane.id}`;
+        const dy = (after.get(key) ?? 0) - (before.get(key) ?? 0);
+        if (dy === 0)
+            continue;
+        moves.push({ id: element.id, xywh: bound.moveDelta(0, dy).serialize() });
+    }
+    std.store.captureSync();
+    std.store.transact(() => {
+        writeLanes(std, pool, next);
+        const crud = std.get(EdgelessCRUDIdentifier);
+        for (const { id, xywh } of moves)
+            crud.updateElement(id, { xywh });
+    });
+    return true;
+}
+/**
+ * The index of `pool`'s focused lane in this editor, or `null` when none is
+ * focused or the focused one is gone (removed by a peer, undone away).
+ *
+ * Read through {@link BpmnLaneFocusHolder} rather than the view class, so the
+ * commands do not import the view.
+ */
+export function bpmnFocusedLaneIndex(std, pool) {
+    const holder = gfxOf(std).view?.get(pool.id);
+    const id = holder?.focusedLaneId;
+    if (!id)
+        return null;
+    const index = bpmnLanesOf(pool).findIndex(lane => lane.id === id);
+    return index < 0 ? null : index;
+}
+/**
+ * The selected pool whose focused lane can move one step `by` (`-1` up, `1`
+ * down), and the lane's index — `null` when no such pool is selected.
+ *
+ * The first one that qualifies: a lane is focused by clicking it, on one pool
+ * at a time, so a selection holding two pools still names at most one lane.
+ */
+export function bpmnLaneToMove(std, by) {
+    for (const pool of bpmnPoolsForLaneEdit(std)) {
+        const index = bpmnFocusedLaneIndex(std, pool);
+        if (index === null)
+            continue;
+        if (!bpmnLanesOf(pool)[index + by])
+            continue;
+        return { pool, index };
+    }
+    return null;
+}
+/** Move the focused lane of the selected pool one step up. */
+export function moveBpmnLaneUp(std) {
+    const target = bpmnLaneToMove(std, -1);
+    if (target)
+        moveBpmnLane(std, target.pool, target.index, target.index - 1);
+}
+/** Move the focused lane of the selected pool one step down. */
+export function moveBpmnLaneDown(std) {
+    const target = bpmnLaneToMove(std, 1);
+    if (target)
+        moveBpmnLane(std, target.pool, target.index, target.index + 1);
+}

package/dist/background.js

@@ -26,7 +26,15 @@ import { BPMN_ROLE } from './roles.js';
  *
  * The left margin IS the name band: `margin.left` is both the room the flow
  * area gives up and the width of the strip the participant name is written in
- * (see `BackgroundSideBandDef`).
+ * (see `BackgroundSideBandDef`) — its MINIMUM width. The name WRAPS up the band
+ * (`fit: 'wrap'`), on words, into as many as three lines side by side, and the
+ * band thickens to hold them: one line fits the declared 28 units, every
+ * further line adds one line height. The PO preferred this to the ellipsis cut
+ * PR #532 shipped (2026-10-27): a band that grows with its name reads as a
+ * title, a name cut short reads as a bug. A name past three lines is still cut
+ * with "…" on the last one, so a pasted paragraph does not eat the pool. The
+ * thickness is derived at paint time (`backgroundBandWidths`) and never
+ * stored, and the stored name stays whole.
  *
  * ## The lanes
  *
@@ -43,6 +51,10 @@ import { BPMN_ROLE } from './roles.js';
  *
  * Each lane wears its own title band inside the pool's — a narrower strip, no
  * fill, one divider, the name turned on its side, exactly as BPMN 2.0 draws it.
+ * A lane name wraps the same way, up to two lines, and every lane's strip takes
+ * the thickness the most demanding name needs (PO, 2026-10-27): strips of
+ * different widths would stagger the lanes' leading edges, and lanes of one
+ * pool are siblings, so they share one edge.
  * The strip is CHROME inside the lane and not a smaller lane: a task dropped on
  * a lane's title band is in that lane, because in BPMN the band belongs to it.
  */
@@ -99,6 +111,13 @@ export const BPMN_POOL_BACKGROUND = {
                 // pool is the same stroke, so the lanes read as the frame continued.
                 divider: { color: '@frame', width: POOL_FRAME_WIDTH },
             },
+            // Wrapped across the strip, which grows to hold the lines — every lane's
+            // strip to the same thickness. Two lines at most: a lane title is a
+            // label, and past two a third line would cost the flow area more than
+            // the name gains; past that it is cut with "…". The stored name stays
+            // whole, and the rename editor shows it in full.
+            fit: 'wrap',
+            maxLines: 2,
             style: {
                 size: POOL_LANE_NAME_FONT_SIZE,
                 color: '@name',
@@ -151,6 +170,12 @@ export const BPMN_POOL_BACKGROUND = {
                     },
                     // Read bottom-to-top, as the spec draws a vertical pool name.
                     vertical: true,
+                    // Wrapped up the band, which grows to hold the lines (three at
+                    // most, the last cut with "…" if the name is longer still). The
+                    // anchor stays half the DECLARED width in from the plot edge; the
+                    // primitive keeps it in the middle of the grown band.
+                    fit: 'wrap',
+                    maxLines: 3,
                 },
             },
         ],

package/dist/commands-manifest.js

@@ -199,6 +199,22 @@ export const bpmnCommandsManifest = [
         scope: 'edgeless',
         defaultKeys: { mac: [], other: [] },
     },
+    {
+        id: 'bpmn.moveLaneUp',
+        owner: 'bpmn',
+        labelKey: 'com.labre.commands.bpmn.moveLaneUp',
+        labelFallback: 'Move lane up',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+    {
+        id: 'bpmn.moveLaneDown',
+        owner: 'bpmn',
+        labelKey: 'com.labre.commands.bpmn.moveLaneDown',
+        labelFallback: 'Move lane down',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
     {
         id: 'bpmn.exportXml',
         owner: 'bpmn',

package/dist/commands.js

@@ -1,9 +1,9 @@
 import { StrokeStyle } from '@formicoidea/labre-core/model';
-import { activateBpmnAssociation, activateBpmnMessageFlow, activateBpmnSequenceFlow, addBpmnLane, bpmnLanesOf, bpmnPoolsForLaneEdit, bpmnPoolsSelected, createBpmnNode, createBpmnPool, exportBpmnXmlFile, importBpmnSvgFile, importBpmnXmlFile, removeBpmnLane, } from './actions.js';
+import { activateBpmnAssociation, activateBpmnMessageFlow, activateBpmnSequenceFlow, addBpmnLane, bpmnLanesOf, bpmnPoolsForLaneEdit, bpmnPoolsSelected, createBpmnNode, createBpmnPool, exportBpmnXmlFile, importBpmnSvgFile, importBpmnXmlFile, bpmnLaneToMove, moveBpmnLaneDown, moveBpmnLaneUp, removeBpmnLane, } from './actions.js';
 import { BPMN_EDGE_STYLE, NODE_FILL, NODE_SIZE, } from './consts.js';
 import { bpmnNodeProps } from './presets.js';
 import { BPMN_ROLE, BPMN_ROLE_OF_KIND } from './roles.js';
-import { bpmnAssociationIcon, bpmnCallActivityIcon, bpmnDataObjectIcon, bpmnDataStoreIcon, bpmnEndIcon, bpmnEndMessageIcon, bpmnEndTerminateIcon, bpmnExportXmlIcon, bpmnGatewayIcon, bpmnGatewayParallelIcon, bpmnGroupIcon, bpmnImportSvgIcon, bpmnImportXmlIcon, bpmnLaneAddIcon, bpmnLaneRemoveIcon, bpmnMessageIcon, bpmnPoolIcon, bpmnSequenceIcon, bpmnStartIcon, bpmnStartMessageIcon, bpmnStartTimerIcon, bpmnSubProcessIcon, bpmnTaskIcon, bpmnTaskServiceIcon, bpmnTaskUserIcon, bpmnTextAnnotationIcon, bpmnToolbarIcon, } from './toolbar/icons.js';
+import { bpmnAssociationIcon, bpmnCallActivityIcon, bpmnDataObjectIcon, bpmnDataStoreIcon, bpmnEndIcon, bpmnEndMessageIcon, bpmnEndTerminateIcon, bpmnExportXmlIcon, bpmnGatewayIcon, bpmnGatewayParallelIcon, bpmnGroupIcon, bpmnImportSvgIcon, bpmnImportXmlIcon, bpmnLaneAddIcon, bpmnLaneDownIcon, bpmnLaneRemoveIcon, bpmnLaneUpIcon, bpmnMessageIcon, bpmnPoolIcon, bpmnSequenceIcon, bpmnStartIcon, bpmnStartMessageIcon, bpmnStartTimerIcon, bpmnSubProcessIcon, bpmnTaskIcon, bpmnTaskServiceIcon, bpmnTaskUserIcon, bpmnTextAnnotationIcon, bpmnToolbarIcon, } from './toolbar/icons.js';
 /**
  * What a spec DOES — its own gesture, or the one its {@link Spec.node} implies.
  *
@@ -493,7 +493,7 @@ const laneCommands = [
         labelKey: 'com.labre.commands.bpmn.removeLane',
         labelFallback: 'Remove lane',
         descriptionKey: 'com.labre.commands.bpmn.removeLane.description',
-        descriptionFallback: 'Remove the last lane of the selected pool. Nothing drawn in it moves.',
+        descriptionFallback: 'Remove the focused lane of the selected pool, or its last lane. Nothing drawn in it moves.',
         iconKey: 'bpmn.lane-remove',
         order: SPECS.length + 1,
         run: removeBpmnLane,
@@ -501,6 +501,36 @@ const laneCommands = [
         // …and additionally: a pool with no lane has none to remove.
         when: std => bpmnPoolsForLaneEdit(std).some(model => bpmnLanesOf(model).length > 0),
     },
+    // The two REORDER commands act on the FOCUSED lane — the one a single click
+    // on its title strip picked in the selected pool (`bpmnFocusedLaneIndex`).
+    // A lane is not an element and cannot be selected, so without a focus there
+    // is no lane to move and the commands are not offered at all.
+    {
+        ...LANE_COMMON,
+        id: 'bpmn.moveLaneUp',
+        labelKey: 'com.labre.commands.bpmn.moveLaneUp',
+        labelFallback: 'Move lane up',
+        descriptionKey: 'com.labre.commands.bpmn.moveLaneUp.description',
+        descriptionFallback: 'Move the focused lane above the one before it, with everything drawn in it.',
+        iconKey: 'bpmn.lane-up',
+        order: SPECS.length + 5,
+        run: moveBpmnLaneUp,
+        telemetry: { framework: 'bpmn', element: 'pool:lane-move-up' },
+        when: std => bpmnLaneToMove(std, -1) !== null,
+    },
+    {
+        ...LANE_COMMON,
+        id: 'bpmn.moveLaneDown',
+        labelKey: 'com.labre.commands.bpmn.moveLaneDown',
+        labelFallback: 'Move lane down',
+        descriptionKey: 'com.labre.commands.bpmn.moveLaneDown.description',
+        descriptionFallback: 'Move the focused lane below the one after it, with everything drawn in it.',
+        iconKey: 'bpmn.lane-down',
+        order: SPECS.length + 6,
+        run: moveBpmnLaneDown,
+        telemetry: { framework: 'bpmn', element: 'pool:lane-move-down' },
+        when: std => bpmnLaneToMove(std, 1) !== null,
+    },
 ];
 /**
  * The EXPORT — the first BPMN command whose subject is the whole board.
@@ -721,6 +751,8 @@ export const bpmnCommandIcons = {
     'bpmn.pool': bpmnPoolIcon,
     'bpmn.lane-add': bpmnLaneAddIcon,
     'bpmn.lane-remove': bpmnLaneRemoveIcon,
+    'bpmn.lane-up': bpmnLaneUpIcon,
+    'bpmn.lane-down': bpmnLaneDownIcon,
     'bpmn.export-xml': bpmnExportXmlIcon,
     'bpmn.import-xml': bpmnImportXmlIcon,
     'bpmn.import-svg': bpmnImportSvgIcon,

package/dist/element-renderer.d.ts

@@ -1,18 +1,26 @@
 import { type ElementRenderer } from '@formicoidea/labre-core/blocks/surface';
 import type { BpmnPoolElementModel } from '@formicoidea/labre-core/model';
 /**
- * Canvas renderer for the BPMN pool.
+ * Canvas renderer for the BPMN pool: the declared background, then the outline
+ * of the FOCUSED lane, if this editor has one (`BpmnLaneFocusHolder`, held by
+ * the pool's view and never stored).
  *
- * There is no BPMN drawing code any more: the pool is an INSTANTIATION of the
- * framework-background primitive, configured by the `BPMN_POOL_BACKGROUND`
- * declaration. What used to be ninety lines of hand-traced rounded rectangle,
- * filled band and rotated name is now a declaration any other framework can
- * write for itself.
+ * The outline is the editor talking about the drawing — "this is the lane the
+ * reorder commands will move" — not part of it, so it is the theme's accent
+ * (`--affine-primary-color`, resolved through the renderer) rather than a
+ * notation colour. It is painted only onto the editor's OWN canvases: the SVG
+ * and PNG exports paint through this same renderer into a context of their
+ * own, and a file must not carry an on-screen focus. A renderer with no editor
+ * behind it (a bare unit test) paints none either, and a host that defines no
+ * accent gets none.
+ *
+ * Painted in the transform the primitive left on the context — element-local
+ * units, rotated about the centre like the rest of the pool.
  *
  * Exported as a function as well as an extension because the fidelity suite
  * drives it directly with a canvas stub.
  */
 export declare const bpmnPool: ElementRenderer<BpmnPoolElementModel>;
-export declare const BpmnPoolRendererExtension: import("@formicoidea/labre-core/_pkgs/store").ExtensionType & {
-    identifier: import("@formicoidea/labre-core/_pkgs/global/di").ServiceIdentifier<ElementRenderer<BpmnPoolElementModel>>;
+export declare const BpmnPoolRendererExtension: import("@formicoidea/labre-core/_pkgs/store/index.js").ExtensionType & {
+    identifier: import("@formicoidea/labre-core/_pkgs/global/di/types.js").ServiceIdentifier<ElementRenderer<BpmnPoolElementModel>>;
 };

package/dist/element-renderer.js

@@ -1,16 +1,80 @@
-import { createFrameworkBackgroundRenderer, ElementRendererExtension, } from '@formicoidea/labre-core/blocks/surface';
+import { backgroundInstanceZones, backgroundPlot, createFrameworkBackgroundRenderer, ElementRendererExtension, } from '@formicoidea/labre-core/blocks/surface';
+import { GfxControllerIdentifier } from '@formicoidea/labre-core/std/gfx';
 import { BPMN_POOL_BACKGROUND } from './background.js';
+import { bpmnPoolLayout, cachePaintedBands } from './pool-hit.js';
 /**
- * Canvas renderer for the BPMN pool.
+ * The pool as the framework-background primitive paints it.
  *
  * There is no BPMN drawing code any more: the pool is an INSTANTIATION of the
  * framework-background primitive, configured by the `BPMN_POOL_BACKGROUND`
  * declaration. What used to be ninety lines of hand-traced rounded rectangle,
  * filled band and rotated name is now a declaration any other framework can
  * write for itself.
+ */
+const paintPool = createFrameworkBackgroundRenderer(BPMN_POOL_BACKGROUND, {
+    // The model cannot measure text, so picking would select by the DECLARED
+    // band widths while a long name paints them wider. Cache what was painted
+    // on the model's `@local()` `paintedBands` (never stored), and only when
+    // it changed: a local write is an `elementUpdated`, which repaints. The
+    // view writes the same cache before any paint (`element-view.ts`).
+    onBands: (model, layout) => {
+        cachePaintedBands(model, layout);
+    },
+});
+/** Width of the focused lane's outline, in model units. */
+const FOCUS_OUTLINE_WIDTH = 2;
+/**
+ * Canvas renderer for the BPMN pool: the declared background, then the outline
+ * of the FOCUSED lane, if this editor has one (`BpmnLaneFocusHolder`, held by
+ * the pool's view and never stored).
+ *
+ * The outline is the editor talking about the drawing — "this is the lane the
+ * reorder commands will move" — not part of it, so it is the theme's accent
+ * (`--affine-primary-color`, resolved through the renderer) rather than a
+ * notation colour. It is painted only onto the editor's OWN canvases: the SVG
+ * and PNG exports paint through this same renderer into a context of their
+ * own, and a file must not carry an on-screen focus. A renderer with no editor
+ * behind it (a bare unit test) paints none either, and a host that defines no
+ * accent gets none.
+ *
+ * Painted in the transform the primitive left on the context — element-local
+ * units, rotated about the centre like the rest of the pool.
  *
  * Exported as a function as well as an extension because the fidelity suite
  * drives it directly with a canvas stub.
  */
-export const bpmnPool = createFrameworkBackgroundRenderer(BPMN_POOL_BACKGROUND);
+export const bpmnPool = (model, ctx, matrix, renderer, rc, viewportBound) => {
+    paintPool(model, ctx, matrix, renderer, rc, viewportBound);
+    const canvas = renderer;
+    if (!canvas?.std)
+        return;
+    const onScreen = ctx.canvas === canvas.canvas ||
+        canvas.stackingCanvas.includes(ctx.canvas);
+    if (!onScreen)
+        return;
+    const holder = canvas.std
+        .getOptional(GfxControllerIdentifier)
+        ?.view?.get(model.id);
+    const id = holder?.focusedLaneId;
+    if (!id)
+        return;
+    const [, , w, h] = model.deserializedXYWH;
+    // The outline hugs the flow area as PAINTED, i.e. right of a participant
+    // band a long name may have widened.
+    const plot = backgroundPlot(BPMN_POOL_BACKGROUND, w, h, bpmnPoolLayout(model).margin);
+    const prefix = BPMN_POOL_BACKGROUND.instanceZones?.idPrefix ?? 'lane';
+    const zone = backgroundInstanceZones(BPMN_POOL_BACKGROUND, model).find(candidate => candidate.id === `${prefix}:${id}`);
+    if (!zone)
+        return;
+    const accent = canvas.getPropertyValue('--affine-primary-color').trim();
+    if (!accent)
+        return;
+    const inset = FOCUS_OUTLINE_WIDTH / 2;
+    ctx.save();
+    ctx.strokeStyle = accent;
+    ctx.lineWidth = FOCUS_OUTLINE_WIDTH;
+    ctx.setLineDash([]);
+    ctx.strokeRect(plot.x0 + inset, plot.y0 + zone.rect.y * plot.height + inset, plot.width - FOCUS_OUTLINE_WIDTH, zone.rect.h * plot.height - FOCUS_OUTLINE_WIDTH);
+    ctx.restore();
+};
 export const BpmnPoolRendererExtension = ElementRendererExtension(BPMN_POOL_BACKGROUND.type, bpmnPool);

package/dist/element-view.d.ts

@@ -2,6 +2,7 @@ import type { BpmnPoolElementModel } from '@formicoidea/labre-core/model';
 import type { EditorHost } from '@formicoidea/labre-core/std';
 import type { PointTestOptions } from '@formicoidea/labre-core/std/gfx';
 import { GfxElementModelView } from '@formicoidea/labre-core/std/gfx';
+import { type BpmnLaneFocusHolder } from './actions.js';
 /**
  * View for a BPMN pool. Three direct gestures live here:
  *
@@ -14,7 +15,11 @@ import { GfxElementModelView } from '@formicoidea/labre-core/std/gfx';
  *   renderer paints the name in, rather than a second set of metrics that would
  *   one day disagree with it;
  * - **drag on an internal lane boundary** moves the separator, taking from one
- *   lane and giving to the other.
+ *   lane and giving to the other;
+ * - **click in a lane's title band of a SELECTED pool** focuses that lane —
+ *   the lane "Move lane up / down" and "Remove lane" act on. On-screen state
+ *   only ({@link BpmnLaneFocusHolder}): never stored, outlined on the canvas
+ *   by the renderer, dropped when the pool leaves the selection.
  *
  * Both renames are ZONED to their band (PO recette, 2026-08-26). The whole pool
  * used to open the participant editor, which was right while a pool had one
@@ -55,14 +60,18 @@ import { GfxElementModelView } from '@formicoidea/labre-core/std/gfx';
  * local point by `-model.rotate` about the element centre, at the one function
  * that has the element in hand (`_localPoint`), not a new declared field.
  */
-export declare class BpmnPoolView extends GfxElementModelView<BpmnPoolElementModel> {
+export declare class BpmnPoolView extends GfxElementModelView<BpmnPoolElementModel> implements BpmnLaneFocusHolder {
     static type: string;
     private _nameEditor;
+    private _focusedLaneId;
+    /** The focused lane's id — see {@link BpmnLaneFocusHolder}. */
+    get focusedLaneId(): string | null;
     /** The boundary the pointer is over, and the handlers armed for it. */
     private _armed;
     /** Everything a separator drag needs, frozen at `dragstart`. */
     private _drag;
     onCreated(): void;
+    private _refreshPaintedBands;
     onDestroyed(): void;
     /** Hand the cursor back on the way out; nothing here owns it for long. */
     private _leave;
@@ -90,9 +99,14 @@ export declare class BpmnPoolView extends GfxElementModelView<BpmnPoolElementMod
      * - the internal LANE SEPARATORS, twelve-unit strips in the middle of the
      *   flow area, which arm the drag that moves them;
      * - the zoom-GROWN rename targets, which reach past the painted bands when
-     *   the board is small on screen so a fingertip can still land on one.
+     *   the board is small on screen so a fingertip can still land on one;
+     * - the part of a title band a long name has WIDENED past its declared
+     *   width (the name wraps onto more lines and the band grows with it,
+     *   `backgroundBandWidths`). The model selects by the declared widths, since
+     *   it cannot measure text; the rename double-click must still land on every
+     *   line painted, so `pool-hit.ts` aims at the band as painted.
      *
-     * Neither is a selection zone — a click in the flow area still goes to
+     * None is a selection zone — a click in the flow area still goes to
      * whatever the user dropped there, because picking asks the MODEL. This
      * override only decides where the pool's own gestures are heard, which is why
      * it is declared here, beside the code that draws and handles them, rather
@@ -115,6 +129,18 @@ export declare class BpmnPoolView extends GfxElementModelView<BpmnPoolElementMod
     private _onDragStart;
     private _onDragMove;
     private _onDragEnd;
+    /**
+     * A press in a lane's title band of a SELECTED pool focuses that lane; a
+     * press in the participant band clears the focus. Anywhere else leaves it.
+     *
+     * On `pointerdown`, which this view already listens to, and NOT on `click`:
+     * a view that registers a handler reports the event as handled, and a
+     * registered `click` would take click-to-select away from the default tool.
+     * Selected first, for the reason the separator drag gives: a first click on
+     * a pool is "work on this pool", not "pick this lane".
+     */
+    private _focusAt;
+    private _setFocus;
     /**
      * A double-click renames whatever TITLE BAND it landed in, and nothing
      * otherwise (PO recette, 2026-08-26).

package/dist/element-view.js

@@ -1,8 +1,15 @@
-import { EdgelessCRUDIdentifier } from '@formicoidea/labre-core/blocks/surface';
+import { EdgelessCRUDIdentifier, } from '@formicoidea/labre-core/blocks/surface';
+import { ToolbarFlag, ToolbarRegistryIdentifier, } from '@formicoidea/labre-core/shared/services';
 import { GfxElementModelView } from '@formicoidea/labre-core/std/gfx';
-import { bpmnLanesOf, renameBpmnLane } from './actions.js';
+import { bpmnLanesOf, renameBpmnLane, } from './actions.js';
 import { POOL_LANE_MIN_HEIGHT } from './consts.js';
-import { bpmnLaneBoundaryAt, bpmnPoolBands, bpmnPoolTargetAt, } from './pool-hit.js';
+import { bpmnLaneBoundaryAt, bpmnPoolBands, bpmnPoolMeasuredLayout, bpmnPoolTargetAt, cachePaintedBands, } from './pool-hit.js';
+/**
+ * The props whose change moves a title band: the names it is sized by, and the
+ * box whose height a name wraps along. `paintedBands` itself is NOT here — the
+ * cache's own write must never re-enter the code that writes it.
+ */
+const BAND_PROPS = new Set(['name', 'lanes', 'xywh']);
 /**
  * View for a BPMN pool. Three direct gestures live here:
  *
@@ -15,7 +22,11 @@ import { bpmnLaneBoundaryAt, bpmnPoolBands, bpmnPoolTargetAt, } from './pool-hit
  *   renderer paints the name in, rather than a second set of metrics that would
  *   one day disagree with it;
  * - **drag on an internal lane boundary** moves the separator, taking from one
- *   lane and giving to the other.
+ *   lane and giving to the other;
+ * - **click in a lane's title band of a SELECTED pool** focuses that lane —
+ *   the lane "Move lane up / down" and "Remove lane" act on. On-screen state
+ *   only ({@link BpmnLaneFocusHolder}): never stored, outlined on the canvas
+ *   by the renderer, dropped when the pool leaves the selection.
  *
  * Both renames are ZONED to their band (PO recette, 2026-08-26). The whole pool
  * used to open the participant editor, which was right while a pool had one
@@ -60,18 +71,49 @@ export class BpmnPoolView extends GfxElementModelView {
     constructor() {
         super(...arguments);
         this._nameEditor = null;
+        this._focusedLaneId = null;
         /** The boundary the pointer is over, and the handlers armed for it. */
         this._armed = null;
         /** Everything a separator drag needs, frozen at `dragstart`. */
         this._drag = null;
     }
     static { this.type = 'bpmnPool'; }
+    /** The focused lane's id — see {@link BpmnLaneFocusHolder}. */
+    get focusedLaneId() {
+        return this._focusedLaneId;
+    }
     onCreated() {
         super.onCreated();
+        // Picking asks the MODEL, which selects by `paintedBands`. The renderer
+        // writes it after each paint, but a hidden tab never paints and the first
+        // click can come before the first frame: the view measures it now, and
+        // again whenever a band can have moved, so picking never waits for a
+        // frame. One measure per update; the renderer's write after the next
+        // paint lands on the same numbers and writes nothing.
+        this._refreshPaintedBands();
+        this.disposable.add(this.model.propsUpdated.subscribe(({ key }) => {
+            if (BAND_PROPS.has(key))
+                this._refreshPaintedBands();
+        }));
         this.on('dblclick', e => this._onDblClick(e));
         this.on('pointermove', e => this._updateHover(e));
-        this.on('pointerdown', e => this._updateHover(e));
+        this.on('pointerdown', e => {
+            this._updateHover(e);
+            this._focusAt(e);
+        });
         this.on('pointerleave', () => this._leave());
+        // The focus belongs to a pool the user is working on: once it leaves the
+        // selection, there is no lane to act on and nothing to outline.
+        this.disposable.add(this.gfx.selection.slots.updated.subscribe(() => {
+            if (this._focusedLaneId === null)
+                return;
+            if (this.gfx.selection.selectedIds.includes(this.model.id))
+                return;
+            this._setFocus(null);
+        }));
+    }
+    _refreshPaintedBands() {
+        cachePaintedBands(this.model, bpmnPoolMeasuredLayout(this.model));
     }
     onDestroyed() {
         this._closeEditor();
@@ -121,9 +163,14 @@ export class BpmnPoolView extends GfxElementModelView {
      * - the internal LANE SEPARATORS, twelve-unit strips in the middle of the
      *   flow area, which arm the drag that moves them;
      * - the zoom-GROWN rename targets, which reach past the painted bands when
-     *   the board is small on screen so a fingertip can still land on one.
+     *   the board is small on screen so a fingertip can still land on one;
+     * - the part of a title band a long name has WIDENED past its declared
+     *   width (the name wraps onto more lines and the band grows with it,
+     *   `backgroundBandWidths`). The model selects by the declared widths, since
+     *   it cannot measure text; the rename double-click must still land on every
+     *   line painted, so `pool-hit.ts` aims at the band as painted.
      *
-     * Neither is a selection zone — a click in the flow area still goes to
+     * None is a selection zone — a click in the flow area still goes to
      * whatever the user dropped there, because picking asks the MODEL. This
      * override only decides where the pool's own gestures are heard, which is why
      * it is declared here, beside the code that draws and handles them, rather
@@ -255,6 +302,37 @@ export class BpmnPoolView extends GfxElementModelView {
         this.model.pop('lanes');
         this._disarm();
     }
+    /* ── Lane focus ────────────────────────────────────────────────────── */
+    /**
+     * A press in a lane's title band of a SELECTED pool focuses that lane; a
+     * press in the participant band clears the focus. Anywhere else leaves it.
+     *
+     * On `pointerdown`, which this view already listens to, and NOT on `click`:
+     * a view that registers a handler reports the event as handled, and a
+     * registered `click` would take click-to-select away from the default tool.
+     * Selected first, for the reason the separator drag gives: a first click on
+     * a pool is "work on this pool", not "pick this lane".
+     */
+    _focusAt(e) {
+        if (!this.gfx.selection.selectedIds.includes(this.model.id))
+            return;
+        const target = this._targetAt(this._localPoint(e));
+        if (target === null)
+            return;
+        const lane = target.kind === 'lane' ? bpmnLanesOf(this.model)[target.index] : null;
+        this._setFocus(lane?.id ?? null);
+    }
+    _setFocus(id) {
+        if (this._focusedLaneId === id)
+            return;
+        this._focusedLaneId = id;
+        // The outline is painted by the canvas renderer, and the toolbar decides
+        // whether to offer the reorder commands: both have to be told.
+        this.gfx.surfaceComponent?.refresh();
+        this.gfx.std
+            .getOptional(ToolbarRegistryIdentifier)
+            ?.flags.refresh(ToolbarFlag.Surface);
+    }
     /* ── In-place naming ───────────────────────────────────────────────── */
     /**
      * A double-click renames whatever TITLE BAND it landed in, and nothing

package/dist/pool-hit.d.ts

@@ -1,4 +1,4 @@
-import { type BackgroundRect, backgroundPlot } from '@formicoidea/labre-core/blocks/surface';
+import { type BackgroundInset, type BackgroundRect, backgroundPlot } from '@formicoidea/labre-core/blocks/surface';
 /**
  * Where a pointer is on a pool, in ELEMENT-LOCAL model units.
  *
@@ -9,8 +9,18 @@ import { type BackgroundRect, backgroundPlot } from '@formicoidea/labre-core/blo
  *
  * Every box is derived from `backgroundInstanceZones` /
  * `backgroundInstanceZoneBand` — the same two functions the renderer paints
- * from and the audit reports from. Nothing here restates a coordinate, so a
- * target cannot drift away from the thing it is a target for.
+ * from and the audit reports from — at the band widths `backgroundBandWidths`
+ * resolves, the one resolver the renderer sizes the bands with. A long name
+ * WIDENS its band (it wraps onto more lines), and the rename target widens with
+ * it: a double-click on the second line of a participant name is a
+ * double-click on that name. Measured with `measureBackgroundText`, the same
+ * metrics the canvas paints with wherever a document exists. Nothing here
+ * restates a coordinate, so a target cannot drift away from the thing it is a
+ * target for.
+ *
+ * The model's own `includesPoint` (`affine-model`, headless, no text
+ * measurement) still selects by the DECLARED widths; the grown part of a band
+ * answers the pool's gestures through the view, which asks these functions.
  *
  * ponytail: a ROTATED pool is not accounted for — the caller converts by
  * subtraction, so every box assumes an upright pool. Same reserve
@@ -18,11 +28,60 @@ import { type BackgroundRect, backgroundPlot } from '@formicoidea/labre-core/blo
  * framework background today. Upgrade: rotate the local point by
  * `-model.rotate` about the element centre, in the caller that has the element.
  */
-/** What these functions need of a pool: its box and its lanes. */
+/**
+ * What these functions need of a pool: its box, its lanes and its name — the
+ * name and the lane names size the bands.
+ */
 export interface BpmnPoolGeometry {
     deserializedXYWH: readonly number[];
     lanes?: unknown;
+    name?: unknown;
+    /** What the renderer last painted — `BpmnPoolElementModel.paintedBands`. */
+    paintedBands?: {
+        margin: number;
+        zoneBandWidth: number;
+    };
 }
+/**
+ * The pool's bands as painted: the margin and strip width the names need.
+ *
+ * The widths the renderer cached on the model when it has painted the pool —
+ * the very numbers the model's `includesPoint` selects by, so a rename target
+ * and a selection click agree to the unit; measured here otherwise (a pool not
+ * painted yet, a headless caller).
+ */
+export declare function bpmnPoolLayout(model: BpmnPoolGeometry): {
+    margin: BackgroundInset;
+    zoneBandWidth: number | undefined;
+};
+/**
+ * The pool's bands MEASURED now, from its name and lanes, ignoring any cache:
+ * what the view writes into `paintedBands` before the first paint and after
+ * every change that moves a band.
+ */
+export declare function bpmnPoolMeasuredLayout(model: BpmnPoolGeometry): {
+    margin: BackgroundInset;
+    zoneBandWidth: number | undefined;
+};
+/**
+ * Write the band widths into the model's `paintedBands` cache — the one place
+ * that does, for both writers: the renderer after each paint (the measured
+ * truth on the canvas) and the view on creation and on every change that moves
+ * a band, so picking never waits for a frame (a hidden tab never paints).
+ *
+ * Writes ONLY when a width changed and returns whether it wrote: a `@local()`
+ * write emits `elementUpdated`, which repaints, so writing an equal value on
+ * every paint would repaint forever.
+ */
+export declare function cachePaintedBands(model: {
+    paintedBands?: {
+        margin: number;
+        zoneBandWidth: number;
+    };
+}, layout: {
+    margin: BackgroundInset;
+    zoneBandWidth: number | undefined;
+}): boolean;
 /** A lane band and, when the declaration asks for one, its title strip. */
 export interface BpmnLaneBand {
     top: number;

package/dist/pool-hit.js

@@ -1,10 +1,59 @@
-import { backgroundInstanceZoneBand, backgroundInstanceZones, backgroundPlot, } from '@formicoidea/labre-core/blocks/surface';
+import { backgroundBandWidths, backgroundInstanceZoneBand, backgroundInstanceZones, backgroundPlot, measureBackgroundText, } from '@formicoidea/labre-core/blocks/surface';
 import { BPMN_POOL_BACKGROUND } from './background.js';
-import { POOL_LANE_GRAB } from './consts.js';
+import { POOL_LANE_BAND_WIDTH, POOL_LANE_GRAB } from './consts.js';
+/**
+ * The pool's bands as painted: the margin and strip width the names need.
+ *
+ * The widths the renderer cached on the model when it has painted the pool —
+ * the very numbers the model's `includesPoint` selects by, so a rename target
+ * and a selection click agree to the unit; measured here otherwise (a pool not
+ * painted yet, a headless caller).
+ */
+export function bpmnPoolLayout(model) {
+    const declared = BPMN_POOL_BACKGROUND.geometry.margin;
+    const painted = model.paintedBands;
+    if (painted) {
+        return {
+            margin: { ...declared, left: painted.margin },
+            zoneBandWidth: painted.zoneBandWidth,
+        };
+    }
+    return bpmnPoolMeasuredLayout(model);
+}
+/**
+ * The pool's bands MEASURED now, from its name and lanes, ignoring any cache:
+ * what the view writes into `paintedBands` before the first paint and after
+ * every change that moves a band.
+ */
+export function bpmnPoolMeasuredLayout(model) {
+    const [, , w, h] = model.deserializedXYWH;
+    return backgroundBandWidths(BPMN_POOL_BACKGROUND, model, w, h, measureBackgroundText);
+}
+/**
+ * Write the band widths into the model's `paintedBands` cache — the one place
+ * that does, for both writers: the renderer after each paint (the measured
+ * truth on the canvas) and the view on creation and on every change that moves
+ * a band, so picking never waits for a frame (a hidden tab never paints).
+ *
+ * Writes ONLY when a width changed and returns whether it wrote: a `@local()`
+ * write emits `elementUpdated`, which repaints, so writing an equal value on
+ * every paint would repaint forever.
+ */
+export function cachePaintedBands(model, layout) {
+    const margin = layout.margin.left;
+    const zoneBandWidth = layout.zoneBandWidth ?? POOL_LANE_BAND_WIDTH;
+    const previous = model.paintedBands;
+    if (previous?.margin === margin && previous.zoneBandWidth === zoneBandWidth) {
+        return false;
+    }
+    model.paintedBands = { margin, zoneBandWidth };
+    return true;
+}
 /** The lane bands of this pool, or `null` when it has no usable partition. */
 export function bpmnPoolBands(model) {
     const [, , w, h] = model.deserializedXYWH;
-    const plot = backgroundPlot(BPMN_POOL_BACKGROUND, w, h);
+    const layout = bpmnPoolLayout(model);
+    const plot = backgroundPlot(BPMN_POOL_BACKGROUND, w, h, layout.margin);
     if (!(plot.width > 0) || !(plot.height > 0))
         return null;
     const zones = backgroundInstanceZones(BPMN_POOL_BACKGROUND, model);
@@ -15,7 +64,7 @@ export function bpmnPoolBands(model) {
         bands: zones.map(zone => ({
             top: plot.y0 + zone.rect.y * plot.height,
             height: zone.rect.h * plot.height,
-            strip: backgroundInstanceZoneBand(BPMN_POOL_BACKGROUND, zone, plot),
+            strip: backgroundInstanceZoneBand(BPMN_POOL_BACKGROUND, zone, plot, layout.zoneBandWidth),
         })),
     };
 }
@@ -94,10 +143,10 @@ export function bpmnLaneTitleBandAt(model, local, zoom) {
  */
 export function bpmnInPoolTitleBand(model, local, zoom) {
     const [, , w, h] = model.deserializedXYWH;
-    const plot = backgroundPlot(BPMN_POOL_BACKGROUND, w, h);
-    // The band IS the margin, clamped to a pool narrower than its own margin —
-    // the same degenerate case the renderer clamps.
-    const painted = Math.min(plot.x0, w);
+    // The band IS the margin — as wide as the wrapped name needs — clamped to a
+    // pool narrower than its own margin, the same degenerate case the renderer
+    // clamps.
+    const painted = Math.min(bpmnPoolLayout(model).margin.left, w);
     if (!(painted > 0))
         return false;
     // Grown rightwards, capped at twice the margin: past that lies the lane

package/dist/toolbar/config.d.ts

@@ -24,6 +24,22 @@ export declare const bpmnPoolToolbarConfig: {
             tooltip: string;
             run: (runCtx: ToolbarContext) => void;
         };
+    }, {
+        id: string;
+        when: (ctx: ToolbarContext) => boolean;
+        generate: (ctx: ToolbarContext) => {
+            icon: TemplateResult;
+            tooltip: string;
+            run: (runCtx: ToolbarContext) => void;
+        };
+    }, {
+        id: string;
+        when: (ctx: ToolbarContext) => boolean;
+        generate: (ctx: ToolbarContext) => {
+            icon: TemplateResult;
+            tooltip: string;
+            run: (runCtx: ToolbarContext) => void;
+        };
     }, import("@formicoidea/labre-core/shared/services").ToolbarActionGenerator];
     readonly when: (ctx: ToolbarContext) => boolean;
 };
@@ -35,8 +51,8 @@ export declare const bpmnPoolToolbarExtension: import("@formicoidea/labre-core/_
  * up — the same merge C4's board makes for the same reason).
  *
  * `c.legend` and not `b.legend`: the toolbar sorts lexicographically by id
- * after partitioning by placement, and `'b.add-lane' < 'b.legend' <
- * 'b.remove-lane'` would wedge the button between the two lane gestures. `c.`
+ * after partitioning by placement, and `'b.lane-1-add' < 'b.legend' <
+ * 'b.lane-4-remove'` would wedge the button between the two lane gestures. `c.`
  * puts it where it belongs — resize · add lane · remove lane · **Legend** ·
  * Validation, with Export XML in the "⋮".
  *

package/dist/toolbar/config.js

@@ -3,7 +3,7 @@ import { BpmnPoolElementModel } from '@formicoidea/labre-core/model';
 import { BOARD_RESIZE_TOGGLE, commandMoreAction, ToolbarModuleExtension, translateKey, } from '@formicoidea/labre-core/shared/services';
 import { BlockFlavourIdentifier, getRegisteredCommands, runCommand, } from '@formicoidea/labre-core/std';
 import { html } from 'lit';
-import { bpmnExportXmlIcon, bpmnLaneAddIcon, bpmnLaneRemoveIcon, } from './icons.js';
+import { bpmnExportXmlIcon, bpmnLaneAddIcon, bpmnLaneDownIcon, bpmnLaneRemoveIcon, bpmnLaneUpIcon, } from './icons.js';
 const ResizeIcon = html `<svg
   width="24"
   height="24"
@@ -90,10 +90,14 @@ export const bpmnPoolToolbarConfig = {
         booleanToggle('a.toggle-resize', BOARD_RESIZE_TOGGLE, ResizeIcon, 'resizeEnabled'),
         // The two lane gestures, next to the resize toggle: everything on this row
         // is about the SHAPE of the pool rather than about what is drawn in it.
-        // Add before remove, because that is the order they can be used in — a pool
-        // has no lane to remove until one has been added.
-        commandAction('b.add-lane', 'bpmn.addLane', 'com.labre.commands.bpmn.addLane', 'Add lane', bpmnLaneAddIcon),
-        commandAction('b.remove-lane', 'bpmn.removeLane', 'com.labre.commands.bpmn.removeLane', 'Remove lane', bpmnLaneRemoveIcon),
+        // Actions sort by id: add, move up, move down, remove — the order a lane
+        // is handled in, with remove last because it is the destructive one.
+        commandAction('b.lane-1-add', 'bpmn.addLane', 'com.labre.commands.bpmn.addLane', 'Add lane', bpmnLaneAddIcon),
+        commandAction('b.lane-4-remove', 'bpmn.removeLane', 'com.labre.commands.bpmn.removeLane', 'Remove lane', bpmnLaneRemoveIcon),
+        // Reorder, beside add and remove: they act on the FOCUSED lane (a click on
+        // its title strip) and only show while one is focused and can move.
+        commandAction('b.lane-2-up', 'bpmn.moveLaneUp', 'com.labre.commands.bpmn.moveLaneUp', 'Move lane up', bpmnLaneUpIcon),
+        commandAction('b.lane-3-down', 'bpmn.moveLaneDown', 'com.labre.commands.bpmn.moveLaneDown', 'Move lane down', bpmnLaneDownIcon),
         // …and, in the "⋮", the one thing you do to a finished process rather than
         // to the shape of a pool: take it away as a file.
         commandMoreAction('z.export-xml', 'bpmn.exportXml', 'com.labre.commands.bpmn.exportXml', 'Export BPMN XML', bpmnExportXmlIcon),
@@ -111,8 +115,8 @@ export const bpmnPoolToolbarExtension = ToolbarModuleExtension({
  * up — the same merge C4's board makes for the same reason).
  *
  * `c.legend` and not `b.legend`: the toolbar sorts lexicographically by id
- * after partitioning by placement, and `'b.add-lane' < 'b.legend' <
- * 'b.remove-lane'` would wedge the button between the two lane gestures. `c.`
+ * after partitioning by placement, and `'b.lane-1-add' < 'b.legend' <
+ * 'b.lane-4-remove'` would wedge the button between the two lane gestures. `c.`
  * puts it where it belongs — resize · add lane · remove lane · **Legend** ·
  * Validation, with Export XML in the "⋮".
  *

package/dist/toolbar/icons.d.ts

@@ -87,3 +87,7 @@ export declare const bpmnPoolIcon: import("lit-html").TemplateResult<2>;
 export declare const bpmnLaneAddIcon: import("lit-html").TemplateResult<2>;
 /** Remove lane — the same pool, with a minus on the band that goes. */
 export declare const bpmnLaneRemoveIcon: import("lit-html").TemplateResult<2>;
+/** Move lane up — the pool cut in two, with an arrow rising out of the lower band. */
+export declare const bpmnLaneUpIcon: import("lit-html").TemplateResult<2>;
+/** Move lane down — the same pool, with an arrow falling out of the upper band. */
+export declare const bpmnLaneDownIcon: import("lit-html").TemplateResult<2>;

package/dist/toolbar/icons.js

@@ -179,3 +179,17 @@ export const bpmnLaneRemoveIcon = svg `<svg width="24" height="24" viewBox="0 0
   <path d="M8 12 H20.5" stroke="currentColor" stroke-width="1.6"/>
   <path d="M12.4 15.1 H16.1" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/>
 </svg>`;
+/** Move lane up — the pool cut in two, with an arrow rising out of the lower band. */
+export const bpmnLaneUpIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="3.5" y="5.5" width="17" height="13" rx="1.5" stroke="currentColor" stroke-width="1.6"/>
+  <path d="M8 5.5 V18.5" stroke="currentColor" stroke-width="1.6"/>
+  <path d="M8 12 H20.5" stroke="currentColor" stroke-width="1.6"/>
+  <path d="M14.25 16.6 V13.6 M12.6 15 L14.25 13.4 L15.9 15" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>`;
+/** Move lane down — the same pool, with an arrow falling out of the upper band. */
+export const bpmnLaneDownIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect x="3.5" y="5.5" width="17" height="13" rx="1.5" stroke="currentColor" stroke-width="1.6"/>
+  <path d="M8 5.5 V18.5" stroke="currentColor" stroke-width="1.6"/>
+  <path d="M8 12 H20.5" stroke="currentColor" stroke-width="1.6"/>
+  <path d="M14.25 7.4 V10.4 M12.6 9 L14.25 10.6 L15.9 9" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>`;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@formicoidea/labre-framework-bpmn",
   "description": "Labre bpmn framework for @formicoidea/labre-core.",
-  "version": "0.58.0",
+  "version": "0.59.0",
   "type": "module",
   "sideEffects": false,
   "author": "lajola",
@@ -35,7 +35,7 @@
     "dist"
   ],
   "dependencies": {
-    "@formicoidea/labre-core": "0.58.0",
+    "@formicoidea/labre-core": "0.59.0",
     "lit": "^3.2.0"
   }
 }