@weasel-js/diagram 1.14.2 → 1.15.1

package/dist/index.js

@@ -1,14 +1,14 @@
 import './chunk-WDIE35AK.js';
-import { CONTAINERS_GROUP, createConnectAction, avoidSceneInput, sceneEdges, inOrUnder, withHopsData, edgePolylines, themeWrites, hopDataOps, worldWith, diagramDropParentAt, containerBuild } from './chunk-GR2DK4S2.js';
-export { ADD_LANE_ACTION_ID, CONNECT_ACTION_ID, CONTAINERS_GROUP, CONTAINER_STENCILS, DEFAULT_EDGE_STROKE, DIAGRAM_ITEM_CARRY, DiagramView, EASED_LAYOUTS, EDGE_END_AFFORDANCE_KIND, EDGE_END_LAYER_ID, EDIT_CONTAINER_TITLE_ACTION_ID, GRAB_EDGE_END_ACTION_ID, GRAB_LABEL_ACTION_ID, GRAB_PORT_ACTION_ID, GRAB_WAYPOINT_ACTION_ID, ITEM_DROP_ACTION_ID, LANE_AFFORDANCE_KIND, LANE_LAYER_ID, LANE_RESIZE_ACTION_ID, LAYOUTS, LAYOUT_ACTION_ID, MOVE_LABEL_ACTION_ID, PORT_AFFORDANCE_KIND, PORT_LAYER_ID, RECONNECT_ACTION_ID, RELEASE_MEMBERS_ACTION_ID, REMOVE_WAYPOINT_ACTION_ID, REORDER_ACTION_ID, RESET_LABEL_ACTION_ID, RESET_ROUTE_ACTION_ID, ROUTER_LABELS, ROUTE_EDIT_ACTION_ID, SELECT_LABEL_EDGE_ACTION_ID, SET_HOPS_ACTION_ID, SET_ROUTER_ACTION_IDS, STEP_REORDER_ACTION_ID, WAYPOINT_AFFORDANCE_KIND, WAYPOINT_HIT_PX, WAYPOINT_LAYER_ID, addLane, applyLayout, avoidSceneInput, bodyAt, commitEdgeToScene, commitLabelToScene, commitLaneResizeToScene, commitReconnectToScene, commitRouteToScene, commitRouterToScene, connectBinding, containerBuild, createAddLaneAction, createConnectAction, createDiagramContribution, createEdgeEndAffordance, createItemDropAction, createLabelDragAction, createLaneAffordance, createLaneResizeAction, createLayoutAction, createPortAffordance, createReconnectAction, createReleaseMembersAction, createRemoveWaypointAction, createReorderAction, createResetLabelAction, createResetRouteAction, createRouteEditAction, createSetHopsAction, createSetRouterAction, createSpecHops, createSpecLabelPlacer, createSpecRouter, createStepReorderAction, createWaypointAffordance, defaultCanConnect, diagramCanDropInto, diagramContainers, diagramDropParentAt, diagramEdgeEnds, diagramLabelDrag, diagramLayoutOf, diagramPorts, diagramResizable, diagramShape, diagramWaypoints, dragItemProps, dragSegment, dragVertex, easedProducer, edgeEndLayer, edgeEndScratchOf, editContainerTitleAction, editContainerTitleBinding, forceProducer, grabPortAction, grabPortBindings, groupReorderContribution, groupReorderSlots, headerIdOf, insertWaypoint, isBodyEnd, isBodyOrRegion, isDiagramBody, itemDropContribution, laneLayer, laneResizeFrame, laneScratchOf, lanesOf, layoutDiagram, layoutPoses, movedLabelData, pinSegment, poolAxisOf, poolsOf, portLayer, portScratchOf, reconnectBinding, regionHeaderAt, registerDiagramShape, releaseMembers, removeSegment, removeWaypoint, reorderBinding, reorderContribution, routeHandles, routeStateOf, routeWrites, routedData, routerActions, routesOf, sceneParticipants, segmentAxis, sequenceSlots, startItemDrag, themeWrites, unpinSegment, useLiveLayout, useMirroredSelection, waypointLayer, waypointScratchOf, withRouter } from './chunk-GR2DK4S2.js';
-import { createAvoidRouter, HOPS_DOC_KEY, edgeHops, placeLabels } from './chunk-IYUU5KUY.js';
-export { AVOID_DEFAULTS, DEFAULT_HOP_SIZE, HOPS_DOC_KEY, createAvoidRouter, edgeHops, placeLabels, radial, simplifyStops } from './chunk-IYUU5KUY.js';
-import { DEFAULT_NODE_STYLE, NODE_STROKE_WIDTH, rowTextStyle, DEFAULT_FONT, bodyLayoutOf, offPageTagLook, diagramThemeOf, offPageSplits, offPageTagOf, DIAGRAM_THEMES, DIAGRAM_THEME_KEY, themeDocValue, DIAGRAM_ROLES, themeEdgeStroke, diagramLabelOf, diagramContainerOf, diagramGroupOf, offPageTagId, offPageFarText, offPageTagSpec, offPageTagData, offPageTagSize, relayoutBodies, recordedRows, labelSize, labelStyleOf } from './chunk-DE7UILJA.js';
-export { ANCHOR_DERIVE_POSE, CONTAINER_HEADER, CONTAINER_LAYOUTS, DEFAULT_EDGE_STYLE, DEFAULT_GROUP_STYLE, DEFAULT_LANE_SIZE, DEFAULT_NODE_STYLE, DEFAULT_POOL_ACROSS, DIAGRAM_ANCHOR, DIAGRAM_CONTAINER_LAYOUT, DIAGRAM_EDGE, DIAGRAM_GROUP, DIAGRAM_LABEL, DIAGRAM_LANE_COLUMNS_LAYOUT, DIAGRAM_LANE_ROWS_LAYOUT, DIAGRAM_OFF_PAGE_TAG, DIAGRAM_POOL_COLUMNS_LAYOUT, DIAGRAM_POOL_ROWS_LAYOUT, DIAGRAM_ROLES, DIAGRAM_THEMES, DIAGRAM_THEME_KEY, EDGE_DERIVE_PATH, EDGE_STROKE_WIDTH, EDIT_EDGE_LABEL_ACTION_ID, GROUP_DERIVE_POSE, LABEL_DERIVE_POSE, LABEL_DRAG_AFFORDANCE_KIND, LABEL_DRAG_LAYER_ID, LABEL_PLACEMENT, LANE_HEADER_SIZE, LANE_STROKE_WIDTH, MIN_LANE_SIZE, NODE_STROKE_WIDTH, OFF_PAGE_STUB, OFF_PAGE_TAG_DERIVE_POSE, OFF_PAGE_TAG_PADDING, POOL_HEADER_SIZE, ROUTERS, anchorDerivePose, avoid, bezier, bodyBox, boxAround, buildGraph, containerShape, dataEdgeStyle, dataNodeStyle, dataOffPage, dataRegionStyle, diagramAnchorOf, diagramContainerLayout, diagramContainerOf, diagramGroupOf, diagramLabelOf, diagramMarkOf, diagramPages, diagramScene, diagramThemeFrom, diagramThemeOf, draggableLabels, dropEmptyEdgeLabel, edgeDerivePath, edgeIdOf, edgeLabelSpec, edgeRouter, editEdgeLabelAction, editEdgeLabelBinding, firstLanes, groupDerivePose, headerBox, labelDerivePose, labelDragLayer, labelScratchOf, labelSize, labelUnder, laneHeader, laneStackLayout, markShape, nextOffPageRef, offPageFarText, offPageSplits, offPageTagData, offPageTagDerivePose, offPageTagId, offPageTagLook, offPageTagOf, offPageTagSize, offPageTagSpec, offPageTagSpecs, offPageTagText, orthogonal, poolHeader, regionSpecs, registerMarkShape, relayoutBodies, resolveEnd, roleEdgeStyle, roleStyle, rowTextStyle, selfLoop, stackedLanes, straight, themeDocValue, themeEdgeStroke, themeFont, themeLabelFont, themeLabelStyle, titleIdOf, titlePose, withDiagramRegistry, withHops } from './chunk-DE7UILJA.js';
-import { EVENT_SIZE, GATEWAY_SIZE, DEVICE_SIZE, buildBody, outlineDetail, outlinePath, diagramEdgeOf, samePoints, diagramNodeOf, layoutBody, labelCenter } from './chunk-FDCODMFW.js';
-export { COMPASS, DEFAULT_GROUP_INSET, DEFAULT_NODE_GAP, DEFAULT_PORTS, DEFAULT_RANK_GAP, DIAGRAM_TRAIT_KEY, DIVIDER_HEIGHT, PORT_LABEL_GAP, anchorOffset, axesFor, backEdges, bodyOutline, bodyTrait, boxForContent, buildBody, canvasMeasure, chain, contentBox, createDiagramNodes, dataKeyReader, diagramEdgeOf, diagramNodeOf, expandGroupEdges, footprintNode, force, forceRelaxation, forestOf, graphOrder, insetOf, isPinned, labelCenter, layered, layeredPlan, layeredRoutes, layoutBody, layoutOwnsPort, layoutOwnsRoute, layoutRowPorts, layoutWritesRoute, marginOf, measureBody, outlineDetail, outlineFromD, outlinePath, outlinePolyline, packAcross, packClusters, pinnedSet, planOf, plannerPlan, portLabelBox, portLabelsOf, portOf, portSitesOf, portsOf, portsOnOutline, rankGaps, ranksByLength, ranksOf, rayHit, registerOutline, routeHolds, seededOrder, settle, sizeToBody, subpathOf, subtreeBlocks, translated, tree, untilSettled } from './chunk-FDCODMFW.js';
+import { CONTAINERS_GROUP, createConnectAction, avoidSceneInput, sceneEdges, inOrUnder, withHopsData, edgePolylines, themeWrites, redrawSequences, sequenceCommitOf, startSequence, newParticipant, addParticipant, insertMark, sequencePartOf, sequenceRootOf, hopDataOps, worldWith, sequenceLayout, insertNote, SEQUENCE_AFFORDANCE_KIND, diagramDropParentAt, containerBuild, placedSequences, insertMessage, SEQ, wrapSteps, SEQ_ARROWS } from './chunk-EIHPPOAM.js';
+export { ADD_LANE_ACTION_ID, CONNECT_ACTION_ID, CONTAINERS_GROUP, CONTAINER_STENCILS, DEFAULT_EDGE_STROKE, DIAGRAM_ITEM_CARRY, DiagramView, EASED_LAYOUTS, EDGE_END_AFFORDANCE_KIND, EDGE_END_LAYER_ID, EDIT_CONTAINER_TITLE_ACTION_ID, GRAB_EDGE_END_ACTION_ID, GRAB_LABEL_ACTION_ID, GRAB_PORT_ACTION_ID, GRAB_SEQUENCE_ACTION_ID, GRAB_WAYPOINT_ACTION_ID, ITEM_DROP_ACTION_ID, LANE_AFFORDANCE_KIND, LANE_LAYER_ID, LANE_RESIZE_ACTION_ID, MOVE_LABEL_ACTION_ID, PORT_AFFORDANCE_KIND, PORT_LAYER_ID, RECONNECT_ACTION_ID, RELEASE_MEMBERS_ACTION_ID, REMOVE_WAYPOINT_ACTION_ID, REORDER_ACTION_ID, RESET_LABEL_ACTION_ID, RESET_ROUTE_ACTION_ID, ROUTER_LABELS, ROUTE_EDIT_ACTION_ID, SELECT_LABEL_EDGE_ACTION_ID, SELECT_SEQUENCE_PART_ACTION_ID, SEQUENCE_AFFORDANCE_KIND, SEQUENCE_DRAG_ACTION_ID, SEQUENCE_LAYER_ID, SEQUENCE_ROLES, SEQ_ARROWS, SEQ_MULTI_SECTION, SET_HOPS_ACTION_ID, SET_ROUTER_ACTION_IDS, STEP_REORDER_ACTION_ID, WAYPOINT_AFFORDANCE_KIND, WAYPOINT_HIT_PX, WAYPOINT_LAYER_ID, addBox, addLane, addParticipant, addSection, avoidSceneInput, bodyAt, commitEdgeToScene, commitLabelToScene, commitLaneResizeToScene, commitReconnectToScene, commitRouteToScene, commitRouterToScene, commitSequence, connectBinding, containerBuild, createAddLaneAction, createConnectAction, createDiagramContribution, createEdgeEndAffordance, createItemDropAction, createLabelDragAction, createLaneAffordance, createLaneResizeAction, createPortAffordance, createReconnectAction, createReleaseMembersAction, createRemoveWaypointAction, createReorderAction, createResetLabelAction, createResetRouteAction, createRouteEditAction, createSequenceDeleteAction, createSequenceDragAction, createSetHopsAction, createSetRouterAction, createSpecHops, createSpecLabelPlacer, createSpecRouter, createStepReorderAction, createWaypointAffordance, defaultCanConnect, diagramCanDropInto, diagramContainers, diagramDropParentAt, diagramEdgeEnds, diagramLabelDrag, diagramLayoutOf, diagramPorts, diagramResizable, diagramSequence, diagramShape, diagramWaypoints, dragItemProps, dragSegment, dragVertex, easedProducer, edgeEndLayer, edgeEndScratchOf, editContainerTitleAction, editContainerTitleBinding, findStep, foldSequenceText, forceProducer, freshSeqId, grabPortAction, grabPortBindings, groupReorderContribution, groupReorderSlots, headerIdOf, insertMark, insertMessage, insertNote, insertStep, insertWaypoint, isBodyEnd, isBodyOrRegion, isDiagramBody, isSequenceText, itemDropContribution, laneLayer, laneResizeFrame, laneScratchOf, lanesOf, moveParticipant, moveStep, movedLabelData, newParticipant, pinSegment, placeOf, poolAxisOf, poolsOf, portLayer, portScratchOf, reconnectBinding, reconnectMessage, redrawSequences, regionHeaderAt, registerDiagramShape, releaseMembers, removeBox, removeMarks, removeMarksOf, removeParticipant, removeSection, removeSegment, removeStep, removeStepAt, removeWaypoint, reorderBinding, reorderContribution, routeHandles, routeStateOf, routedData, routerActions, sceneParticipants, segmentAxis, selectSequencePartAction, seqIdTaken, sequenceCommitOf, sequenceDeletes, sequenceLayout, sequencePartNodeOf, sequencePartOf, sequenceRootOf, sequenceScratchOf, sequenceSlots, sequenceSpecs, sequenceTextOf, setAutonumber, setFragmentType, setMessageActivation, setMessageArrow, setParticipantOutline, setSequenceText, startItemDrag, startSequence, stepListOf, themeWrites, unpinSegment, unwrapFragment, useLiveLayout, useMirroredSelection, useSequenceTextEdit, waypointLayer, waypointScratchOf, withRouter, wrapSteps } from './chunk-EIHPPOAM.js';
+import { createAvoidRouter, HOPS_DOC_KEY, edgeHops, placeLabels } from './chunk-UUMLQEMR.js';
+export { AVOID_DEFAULTS, DEFAULT_HOP_SIZE, HOPS_DOC_KEY, createAvoidRouter, edgeHops, placeLabels, simplifyStops } from './chunk-UUMLQEMR.js';
+import { DEFAULT_NODE_STYLE, NODE_STROKE_WIDTH, rowTextStyle, DEFAULT_FONT, bodyLayoutOf, offPageTagLook, diagramThemeOf, offPageSplits, offPageTagOf, DIAGRAM_THEMES, DIAGRAM_THEME_KEY, themeDocValue, DIAGRAM_ROLES, themeEdgeStroke, diagramLabelOf, diagramContainerOf, diagramGroupOf, offPageTagId, offPageFarText, offPageTagSpec, offPageTagData, offPageTagSize, relayoutBodies, recordedRows, roleStyle, labelSize, labelStyleOf } from './chunk-NEX4QKQQ.js';
+export { ANCHOR_DERIVE_POSE, CONTAINER_HEADER, CONTAINER_LAYOUTS, DEFAULT_EDGE_STYLE, DEFAULT_GROUP_STYLE, DEFAULT_LANE_SIZE, DEFAULT_NODE_STYLE, DEFAULT_POOL_ACROSS, DIAGRAM_ANCHOR, DIAGRAM_CONTAINER_LAYOUT, DIAGRAM_EDGE, DIAGRAM_GROUP, DIAGRAM_LABEL, DIAGRAM_LANE_COLUMNS_LAYOUT, DIAGRAM_LANE_ROWS_LAYOUT, DIAGRAM_OFF_PAGE_TAG, DIAGRAM_POOL_COLUMNS_LAYOUT, DIAGRAM_POOL_ROWS_LAYOUT, DIAGRAM_ROLES, DIAGRAM_THEMES, DIAGRAM_THEME_KEY, EDGE_DERIVE_PATH, EDGE_STROKE_WIDTH, EDIT_EDGE_LABEL_ACTION_ID, END_LABEL_PLACEMENT, GROUP_DERIVE_POSE, LABEL_DERIVE_POSE, LABEL_DRAG_AFFORDANCE_KIND, LABEL_DRAG_LAYER_ID, LABEL_PLACEMENT, LANE_HEADER_SIZE, LANE_STROKE_WIDTH, LAYOUTS, LAYOUT_ACTION_ID, MIN_LANE_SIZE, NODE_STROKE_WIDTH, OFF_PAGE_STUB, OFF_PAGE_TAG_DERIVE_POSE, OFF_PAGE_TAG_PADDING, POOL_HEADER_SIZE, ROUTERS, anchorDerivePose, applyLayout, avoid, bezier, bodyBox, boxAround, buildGraph, containerShape, createLayoutAction, dataEdgeStyle, dataNodeStyle, dataOffPage, dataRegionStyle, diagramAnchorOf, diagramContainerLayout, diagramContainerOf, diagramGroupOf, diagramLabelOf, diagramMarkOf, diagramPages, diagramScene, diagramThemeFrom, diagramThemeOf, draggableLabels, dropEmptyEdgeLabel, edgeDerivePath, edgeIdOf, edgeLabelSpec, edgeRouter, editEdgeLabelAction, editEdgeLabelBinding, endLabelIdOf, firstLanes, groupDerivePose, headerBox, labelDerivePose, labelDragLayer, labelScratchOf, labelSize, labelUnder, laneHeader, laneStackLayout, layoutDiagram, layoutPoses, markShape, nextOffPageRef, offPageFarText, offPageSplits, offPageTagData, offPageTagDerivePose, offPageTagId, offPageTagLook, offPageTagOf, offPageTagSize, offPageTagSpec, offPageTagSpecs, offPageTagText, orthogonal, poolHeader, regionSpecs, registerMarkShape, relayoutBodies, resolveEnd, roleEdgeStyle, roleStyle, routeWrites, routesOf, rowTextStyle, selfLoop, stackedLanes, straight, themeDocValue, themeEdgeStroke, themeFont, themeLabelFont, themeLabelStyle, titleIdOf, titlePose, withDiagramRegistry, withHops } from './chunk-NEX4QKQQ.js';
+import { EVENT_SIZE, GATEWAY_SIZE, DEVICE_SIZE, buildBody, outlineDetail, outlineSolid, outlinePath, diagramEdgeOf, samePoints, diagramNodeOf, layoutBody, labelCenter } from './chunk-UOFQBGJY.js';
+export { COMPASS, DEFAULT_GROUP_INSET, DEFAULT_NODE_GAP, DEFAULT_PORTS, DEFAULT_RANK_GAP, DIAGRAM_TRAIT_KEY, DIVIDER_HEIGHT, PORT_LABEL_GAP, anchorOffset, axesFor, backEdges, bodyOutline, bodyTrait, boxForContent, buildBody, canvasMeasure, chain, contentBox, createDiagramNodes, dataKeyReader, diagramEdgeOf, diagramNodeOf, expandGroupEdges, footprintNode, force, forceRelaxation, forestOf, graphOrder, grid, insetOf, isPinned, labelCenter, layered, layeredPlan, layeredRoutes, layoutBody, layoutOwnsPort, layoutOwnsRoute, layoutRowPorts, layoutWritesRoute, marginOf, measureBody, outlineDetail, outlineFromD, outlinePath, outlinePolyline, outlineSolid, packAcross, packClusters, pinnedSet, planOf, plannerPlan, portLabelBox, portLabelsOf, portOf, portSitesOf, portsOf, portsOnOutline, radial, rankGaps, ranksByLength, ranksOf, rayHit, registerOutline, routeHolds, seededOrder, settle, sizeToBody, subpathOf, subtreeBlocks, translated, tree, untilSettled } from './chunk-UOFQBGJY.js';
 import { useMemo, useRef, useEffect } from 'react';
-import { bodyPredicate, AUTO_POSE_DESCRIPTOR, defineTool, localizeWorldPoses, RIGID_POSE_COMPOSITION, createInsertOp, INSERT_REPOSITION_BINDING, useDepRegistry, useLatest, useDepSource, commitOps, createSetDataOp, useOptionalDepRegistry, useTransformFollower, composeWorldPose, scenePoseAdapter, placedPagesOf, PAGES_DOC_KEY, ActionDisabledReason, measureTextBounds, createTransformOp, writtenBy, documentDepOf, documentPose, createDeleteOp, fitViewToPage, scenePoseFrame, parseColor } from '@weasel-js/core';
+import { bodyPredicate, toolSet, AUTO_POSE_DESCRIPTOR, defineTool, localizeWorldPoses, RIGID_POSE_COMPOSITION, createInsertOp, INSERT_REPOSITION_BINDING, useDepRegistry, useLatest, useDepSource, commitOps, createSetDataOp, useOptionalDepRegistry, useTransformFollower, composeWorldPose, scenePoseAdapter, placedPagesOf, PAGES_DOC_KEY, ActionDisabledReason, measureTextBounds, createTransformOp, writtenBy, documentDepOf, documentPose, createDeleteOp, fitViewToPage, scenePoseFrame, parseColor } from '@weasel-js/core';
 import { pathToD, pathPoint } from '@weasel-js/geom';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { PATH_M } from '@weasel-js/core/math';
@@ -100,7 +100,7 @@ function stencilBuild(stencil, bounds, opts) {
       layer: opts.layer,
       ...opts.measure ? { measure: opts.measure } : {},
       body: (trait) => ({
-        diagram: { ...trait, ...bodyLayoutOf(spec, trait, opts.measure) },
+        diagram: { ...trait, ...bodyLayoutOf(spec, trait, opts.measure), ...stencil.themeRole !== void 0 ? { style: stencil.themeRole } : {} },
         fill: { paint: { color: style.fill } },
         stroke: { paint: { color: style.stroke }, width: style.strokeWidth ?? NODE_STROKE_WIDTH, ...style.dash ? { dash: style.dash } : {} }
       }),
@@ -108,7 +108,8 @@ function stencilBuild(stencil, bounds, opts) {
         text,
         style: rowTextStyle(box.row, opts.font ?? DEFAULT_FONT),
         fill: { paint: { color: style.text } },
-        bodyRow: box.index
+        bodyRow: box.index,
+        ...box.row.kind === "field" ? { bodyField: box.row.label } : {}
       } : null
     }
   );
@@ -148,13 +149,13 @@ function useStencilInsert(stencils, opts = {}) {
       if (id === null) return void 0;
       return stencilsRef.current.find((s) => s.id === id) ?? optsRef.current.containers?.find((s) => s.id === id);
     };
-    const builtAt = (stencil, world) => {
+    const builtAt = (stencil, world2) => {
       if (scene === void 0) return null;
-      const center = { x: world.x + world.width / 2, y: world.y + world.height / 2 };
+      const center = { x: world2.x + world2.width / 2, y: world2.y + world2.height / 2 };
       const role = "role" in stencil ? stencil.role : null;
-      const { style, measure, font, containerStyle, laneStyles } = optsRef.current;
+      const { style, measure, font, containerStyle, laneStyles, theme } = optsRef.current;
       const parent = diagramDropParentAt(scene, center, role);
-      const bounds = parent === null ? world : scenePoseFrame(scene).localUnder(parent, { ...world });
+      const bounds = parent === null ? world2 : scenePoseFrame(scene).localUnder(parent, { ...world2 });
       const common = { layer: layer(), newId: () => scene.mintId(), parent };
       if ("role" in stencil) {
         const boxStyle = containerStyle ?? style;
@@ -164,9 +165,10 @@ function useStencilInsert(stencils, opts = {}) {
           ...laneStyles ? { laneStyles } : {}
         });
       }
+      const shapeStyle = stencil.themeRole !== void 0 && theme !== void 0 ? roleStyle(theme, stencil.themeRole) : style;
       return stencilBuild(stencil, bounds, {
         ...common,
-        ...style ? { style } : {},
+        ...shapeStyle ? { style: shapeStyle } : {},
         ...measure ? { measure } : {},
         ...font ? { font } : {}
       });
@@ -196,8 +198,9 @@ function StencilGhost({ stencil, style, scale = 1 }) {
   const own = "outline" in stencil ? { ...style, ...stencil.style } : style;
   const width = own.strokeWidth ?? NODE_STROKE_WIDTH;
   const bounds = { x: width / 2, y: width / 2, ...stencil.size };
-  const outline = "outline" in stencil ? stencil.outline : "rect";
-  const detail = outlineDetail(outline, bounds);
+  const outline2 = "outline" in stencil ? stencil.outline : "rect";
+  const detail = outlineDetail(outline2, bounds);
+  const solid = outlineSolid(outline2, bounds);
   const box = { width: stencil.size.width + width, height: stencil.size.height + width };
   const stroke = { stroke: own.stroke, strokeWidth: width, strokeDasharray: own.dash?.join(" ") };
   return /* @__PURE__ */ jsxs(
@@ -210,7 +213,8 @@ function StencilGhost({ stencil, style, scale = 1 }) {
       overflow: "visible",
       "data-stencil": stencil.id,
       children: [
-        /* @__PURE__ */ jsx("path", { d: pathToD(outlinePath(outline, bounds)), fill: own.fill, ...stroke }),
+        /* @__PURE__ */ jsx("path", { d: pathToD(outlinePath(outline2, bounds)), fill: own.fill, ...stroke }),
+        solid && /* @__PURE__ */ jsx("path", { d: pathToD(solid), fill: own.stroke }),
         detail && /* @__PURE__ */ jsx("path", { d: pathToD(detail), fill: "none", ...stroke })
       ]
     }
@@ -794,11 +798,11 @@ function createFollowOffPageAction(opts = {}) {
     invoker: {
       timing: "immediate",
       run(deps, params) {
-        const world = params?.world;
-        if (!world) return;
-        const target = tagUnder(deps, world);
+        const world2 = params?.world;
+        if (!world2) return;
+        const target = tagUnder(deps, world2);
         if (target === null) return;
-        follow(target, { world, modifiers: { alt: false, shift: false, meta: false, ctrl: false }, deps });
+        follow(target, { world: world2, modifiers: { alt: false, shift: false, meta: false, ctrl: false }, deps });
       }
     },
     enabled: (deps, at) => tagUnder(deps, at) !== null ? true : ActionDisabledReason.NotApplicable
@@ -901,6 +905,7 @@ function applyDiagramTheme(scene, theme, label = `Theme: ${theme.name}`, opts =
   scene.batch(label, () => {
     writeAll(scene, themeWrites(scene, theme, void 0, from), opts.measure);
     scene.doc.set(DIAGRAM_THEME_KEY, themeDocValue(theme));
+    redrawSequences(scene, { theme, ...opts.measure ? { measure: opts.measure } : {} });
   }, opts.coalesceKey !== void 0 ? { coalesceKey: opts.coalesceKey } : {});
 }
 var withTrait = (data, trait) => ({ ...data, diagram: trait });
@@ -1423,6 +1428,232 @@ var UML_STENCILS = [
 ];
 var UML_GROUP = { id: "uml", label: "UML", stencils: UML_STENCILS };
 
+// src/stencils/architecture.ts
+var SERVICE = { width: 100, height: 90 };
+var named = (text) => ({ rows: [{ kind: "label", text }] });
+var ARCHITECTURE_STENCILS = [
+  { id: "arch-service", label: "Service", outline: "roundRect", size: { width: 120, height: 50 }, ...named("Service"), icon: (
+    /* @icon */
+    "diagram:task"
+  ) },
+  { id: "arch-server", label: "Server", outline: "server", size: SERVICE, ...named("Server"), icon: (
+    /* @icon */
+    "diagram:server"
+  ) },
+  { id: "arch-database", label: "Database", outline: "cylinder", size: SERVICE, ...named("Database"), icon: (
+    /* @icon */
+    "diagram:database"
+  ) },
+  { id: "arch-disk", label: "Disk", outline: "disk", size: SERVICE, ...named("Disk"), icon: (
+    /* @icon */
+    "diagram:database"
+  ) },
+  { id: "arch-cloud", label: "Cloud", outline: "cloud", size: { width: 120, height: 80 }, ...named("Cloud"), icon: (
+    /* @icon */
+    "diagram:cloud"
+  ) },
+  { id: "arch-internet", label: "Internet", outline: "globe", size: SERVICE, ...named("Internet"), icon: (
+    /* @icon */
+    "diagram:internet"
+  ) },
+  { id: "arch-junction", label: "Junction", outline: "start", size: { width: 12, height: 12 }, rows: [], padding: 0, icon: (
+    /* @icon */
+    "diagram:stateStart"
+  ) },
+  { id: "arch-group", label: "Group", role: "container", size: { width: 300, height: 200 }, icon: (
+    /* @icon */
+    "diagram:container"
+  ) }
+];
+var ARCHITECTURE_GROUP = { id: "architecture", label: "Architecture", stencils: ARCHITECTURE_STENCILS };
+
+// src/stencils/c4.ts
+var SMALL = { fontSize: 10 };
+function element(e) {
+  const name = e.label.replace(/ \(external\)$/, "");
+  const rows = [
+    { kind: "label", text: `<<${e.kind}>>`, style: SMALL },
+    { kind: "label", text: name, style: { bold: true } },
+    ...e.technology !== void 0 ? [{ kind: "label", text: `[${e.technology}]`, style: SMALL }] : [],
+    { kind: "label", text: "What it does" }
+  ];
+  return {
+    id: e.id,
+    label: e.label,
+    outline: e.outline,
+    size: { width: e.width ?? 200, height: e.height ?? 110 },
+    rows,
+    icon: e.icon,
+    themeRole: e.kind.startsWith("external_") ? "muted" : "accent"
+  };
+}
+var boundary = (id, label, title) => ({ id, label, title, role: "container", size: { width: 320, height: 220 }, icon: (
+  /* @icon */
+  "diagram:container"
+) });
+var C4_STENCILS = [
+  element({ id: "c4-person", label: "Person", kind: "person", outline: "person", icon: (
+    /* @icon */
+    "diagram:person"
+  ), height: 170 }),
+  element({ id: "c4-person-ext", label: "Person (external)", kind: "external_person", outline: "person", icon: (
+    /* @icon */
+    "diagram:user"
+  ), height: 170 }),
+  element({ id: "c4-system", label: "System", kind: "system", outline: "roundRect", icon: (
+    /* @icon */
+    "diagram:task"
+  ) }),
+  element({ id: "c4-system-ext", label: "System (external)", kind: "external_system", outline: "roundRect", icon: (
+    /* @icon */
+    "diagram:task"
+  ) }),
+  element({ id: "c4-system-db", label: "System database", kind: "system_db", outline: "cylinder", icon: (
+    /* @icon */
+    "diagram:database"
+  ), height: 130 }),
+  element({ id: "c4-system-queue", label: "System queue", kind: "system_queue", outline: "queue", icon: (
+    /* @icon */
+    "diagram:queue"
+  ) }),
+  element({ id: "c4-container", label: "Container", kind: "container", outline: "roundRect", icon: (
+    /* @icon */
+    "diagram:c4Container"
+  ), technology: "Technology", height: 120 }),
+  element({
+    id: "c4-container-db",
+    label: "Container database",
+    kind: "container_db",
+    outline: "cylinder",
+    icon: (
+      /* @icon */
+      "diagram:database"
+    ),
+    technology: "Technology",
+    height: 150
+  }),
+  element({ id: "c4-container-queue", label: "Container queue", kind: "container_queue", outline: "queue", icon: (
+    /* @icon */
+    "diagram:queue"
+  ), technology: "Technology", width: 240, height: 120 }),
+  element({ id: "c4-component", label: "Component", kind: "component", outline: "roundRect", icon: (
+    /* @icon */
+    "diagram:umlComponent"
+  ), technology: "Technology", height: 120 }),
+  boundary("c4-enterprise-boundary", "Enterprise boundary", "Enterprise [enterprise]"),
+  boundary("c4-system-boundary", "System boundary", "System [system]"),
+  boundary("c4-container-boundary", "Container boundary", "Container [container]")
+];
+var C4_GROUP = { id: "c4", label: "C4", stencils: C4_STENCILS };
+
+// src/stencils/kanban.ts
+var KANBAN_STENCILS = [
+  {
+    id: "kanban-board",
+    label: "Board",
+    title: "Board",
+    role: "pool",
+    axis: "x",
+    lanes: ["To do", "In progress", "Done"],
+    size: { width: 660, height: 420 },
+    icon: (
+      /* @icon */
+      "diagram:poolColumns"
+    )
+  },
+  {
+    id: "kanban-card",
+    label: "Card",
+    outline: "rect",
+    size: { width: 180, height: 60 },
+    verticalAlign: "top",
+    rows: [{ kind: "label", text: "Task" }, { kind: "field", label: "assigned", value: "someone" }],
+    icon: (
+      /* @icon */
+      "diagram:kanbanCard"
+    )
+  }
+];
+var KANBAN_GROUP = { id: "kanban", label: "Kanban", stencils: KANBAN_STENCILS };
+
+// src/stencils/requirement.ts
+var SMALL2 = { fontSize: 10 };
+function block(id, label, kind, name, fields) {
+  const rows = [
+    { kind: "label", text: `<<${kind}>>`, style: SMALL2 },
+    { kind: "label", text: name, style: { bold: true } },
+    { kind: "divider" },
+    ...fields.map(([l, value]) => ({ kind: "field", label: l, value }))
+  ];
+  const icons = kind === "element" ? (
+    /* @icon */
+    "diagram:umlComponent"
+  ) : (
+    /* @icon */
+    "diagram:requirement"
+  );
+  return { id, label, outline: "rect", size: { width: 220, height: 60 + 18 * fields.length }, verticalAlign: "top", rows, icon: icons };
+}
+var REQUIREMENT_FIELDS = [["id", "1"], ["text", "The system shall\u2026"], ["risk", "Medium"], ["verifymethod", "Test"]];
+var REQUIREMENT_STENCILS = [
+  block("requirement", "Requirement", "requirement", "Requirement", REQUIREMENT_FIELDS),
+  block("functional-requirement", "Functional requirement", "functionalRequirement", "Functional", REQUIREMENT_FIELDS),
+  block("design-constraint", "Design constraint", "designConstraint", "Constraint", REQUIREMENT_FIELDS),
+  block("requirement-element", "Element", "element", "Element", [["type", "module"], ["docref", "docs/"]])
+];
+var REQUIREMENT_GROUP = { id: "requirement", label: "Requirement", stencils: REQUIREMENT_STENCILS };
+
+// src/stencils/state.ts
+var pseudo = { rows: [], padding: 0 };
+var STATE_STENCILS = [
+  { id: "state", label: "State", outline: "roundRect", size: { width: 120, height: 50 }, rows: [{ kind: "label", text: "State" }], icon: (
+    /* @icon */
+    "diagram:task"
+  ) },
+  { id: "state-start", label: "Start", outline: "start", size: { width: 20, height: 20 }, ...pseudo, icon: (
+    /* @icon */
+    "diagram:stateStart"
+  ) },
+  { id: "state-end", label: "End", outline: "end", size: { width: 20, height: 20 }, ...pseudo, icon: (
+    /* @icon */
+    "diagram:stateEnd"
+  ) },
+  { id: "state-choice", label: "Choice", outline: "diamond", size: { width: 28, height: 28 }, ...pseudo, icon: (
+    /* @icon */
+    "shape:diamond"
+  ) },
+  { id: "state-fork", label: "Fork or join", outline: "bar", size: { width: 80, height: 10 }, ...pseudo, icon: (
+    /* @icon */
+    "diagram:stateFork"
+  ) },
+  { id: "state-note", label: "Note", outline: "note", size: { width: 140, height: 60 }, rows: [{ kind: "label", text: "Note" }], icon: (
+    /* @icon */
+    "diagram:umlNote"
+  ) },
+  { id: "state-composite", label: "Composite state", title: "Composite", role: "container", size: { width: 280, height: 180 }, icon: (
+    /* @icon */
+    "diagram:container"
+  ) },
+  {
+    id: "state-concurrent",
+    label: "Concurrent state",
+    title: "Concurrent",
+    role: "pool",
+    axis: "y",
+    lanes: ["Region 1", "Region 2"],
+    size: { width: 360, height: 240 },
+    icon: (
+      /* @icon */
+      "diagram:poolRows"
+    )
+  }
+];
+var STATE_GROUP = { id: "state", label: "State", stencils: STATE_STENCILS };
+
+// src/diagramTypes/types.ts
+var FLOWCHART_NOTATION = "flowchart";
+var DIAGRAM_TYPE_DOC_KEY = "diagram:type";
+
 // src/diagramTypes/catalog.ts
 var byId = (list) => Object.freeze(Object.fromEntries(list.map((item) => [item.id, item])));
 var STENCIL_GROUPS = byId([
@@ -1433,7 +1664,12 @@ var STENCIL_GROUPS = byId([
   BPMN_GROUP,
   UML_GROUP,
   ERD_GROUP,
-  MIND_MAP_GROUP
+  MIND_MAP_GROUP,
+  STATE_GROUP,
+  REQUIREMENT_GROUP,
+  C4_GROUP,
+  ARCHITECTURE_GROUP,
+  KANBAN_GROUP
 ]);
 var FLOWCHART_TYPE = {
   id: "flowchart",
@@ -1442,7 +1678,8 @@ var FLOWCHART_TYPE = {
     /* @icon */
     "shape:diamond"
   ),
-  groups: [FLOWCHART_GROUP.id, CONTAINERS_GROUP.id]
+  groups: [FLOWCHART_GROUP.id, CONTAINERS_GROUP.id],
+  notations: [FLOWCHART_NOTATION]
 };
 var NETWORK_TYPE = {
   id: "network",
@@ -1484,7 +1721,8 @@ var MIND_MAP_TYPE = {
   ),
   groups: [MIND_MAP_GROUP.id],
   edge: { router: "bezier", markerEnd: null },
-  layout: "radial"
+  layout: "radial",
+  notations: ["mindmap"]
 };
 var UML_CLASS_TYPE = {
   id: "umlClass",
@@ -1494,7 +1732,8 @@ var UML_CLASS_TYPE = {
     "diagram:umlClass"
   ),
   groups: [UML_GROUP.id, CONTAINERS_GROUP.id],
-  edge: { router: "orthogonal", markerEnd: "arrow-open" }
+  edge: { router: "orthogonal", markerEnd: "arrow-open" },
+  notations: ["class"]
 };
 var ERD_TYPE = {
   id: "erd",
@@ -1504,7 +1743,71 @@ var ERD_TYPE = {
     "diagram:erdEntity"
   ),
   groups: [ERD_GROUP.id],
-  edge: { router: "orthogonal", markerStart: "crow-one", markerEnd: "crow-many" }
+  edge: { router: "orthogonal", markerStart: "crow-one", markerEnd: "crow-many" },
+  notations: ["er"]
+};
+var STATE_TYPE = {
+  id: "state",
+  label: "State",
+  icon: (
+    /* @icon */
+    "diagram:stateEnd"
+  ),
+  groups: [STATE_GROUP.id],
+  notations: ["state"]
+};
+var REQUIREMENT_TYPE = {
+  id: "requirement",
+  label: "Requirement",
+  icon: (
+    /* @icon */
+    "diagram:requirement"
+  ),
+  groups: [REQUIREMENT_GROUP.id],
+  edge: { markerEnd: "arrow", dash: [4, 4] },
+  notations: ["requirement"]
+};
+var C4_TYPE = {
+  id: "c4",
+  label: "C4",
+  icon: (
+    /* @icon */
+    "diagram:c4Container"
+  ),
+  groups: [C4_GROUP.id],
+  notations: ["c4-context", "c4-container", "c4-component", "c4-dynamic", "c4-deployment"]
+};
+var BLOCK_TYPE = {
+  id: "block",
+  label: "Block",
+  icon: (
+    /* @icon */
+    "diagram:blocks"
+  ),
+  groups: [FLOWCHART_GROUP.id, CONTAINERS_GROUP.id],
+  layout: "grid",
+  notations: ["block"]
+};
+var ARCHITECTURE_TYPE = {
+  id: "architecture",
+  label: "Architecture",
+  icon: (
+    /* @icon */
+    "diagram:cloud"
+  ),
+  groups: [ARCHITECTURE_GROUP.id],
+  edge: { router: "orthogonal", markerEnd: null },
+  notations: ["architecture"]
+};
+var KANBAN_TYPE = {
+  id: "kanban",
+  label: "Kanban",
+  icon: (
+    /* @icon */
+    "diagram:kanbanCard"
+  ),
+  groups: [KANBAN_GROUP.id],
+  notations: ["kanban"]
 };
 var DIAGRAM_TYPES = byId([
   FLOWCHART_TYPE,
@@ -1513,7 +1816,13 @@ var DIAGRAM_TYPES = byId([
   BPMN_TYPE,
   UML_CLASS_TYPE,
   ERD_TYPE,
-  MIND_MAP_TYPE
+  MIND_MAP_TYPE,
+  STATE_TYPE,
+  REQUIREMENT_TYPE,
+  C4_TYPE,
+  BLOCK_TYPE,
+  ARCHITECTURE_TYPE,
+  KANBAN_TYPE
 ]);
 var isContainerStencil = (stencil) => "role" in stencil;
 function groupStencils(ids, catalog = STENCIL_GROUPS) {
@@ -1521,9 +1830,6 @@ function groupStencils(ids, catalog = STENCIL_GROUPS) {
 }
 var groupStencilIds = (group) => group.stencils.map((s) => s.id);
 
-// src/diagramTypes/types.ts
-var DIAGRAM_TYPE_DOC_KEY = "diagram:type";
-
 // src/diagramTypes/doc.ts
 function diagramTypeDocValue(id, types = DIAGRAM_TYPES) {
   const type = types[id] ?? FLOWCHART_TYPE;
@@ -1539,6 +1845,11 @@ function diagramTypeDocOf(scene, types = DIAGRAM_TYPES) {
 function diagramTypeOf(scene, types = DIAGRAM_TYPES) {
   return types[diagramTypeDocOf(scene, types).type] ?? FLOWCHART_TYPE;
 }
+var diagramNotationOf = (scene, types = DIAGRAM_TYPES) => diagramTypeOf(scene, types).notations?.[0] ?? FLOWCHART_NOTATION;
+function diagramTypeOfNotation(notation, types = DIAGRAM_TYPES) {
+  const n = notation ?? FLOWCHART_NOTATION;
+  return Object.values(types).find((t) => (t.notations ?? []).includes(n)) ?? null;
+}
 function write(scene, value, label) {
   scene.batch(label, () => scene.doc.set(DIAGRAM_TYPE_DOC_KEY, value));
 }
@@ -1562,7 +1873,12 @@ function diagramTypeEdgeStroke(theme, type) {
   const { markerStart, markerEnd, ...rest } = themeEdgeStroke(theme);
   const start = type.edge?.markerStart === void 0 ? markerStart : type.edge.markerStart;
   const end = type.edge?.markerEnd === void 0 ? markerEnd : type.edge.markerEnd;
-  return { ...rest, ...start ? { markerStart: start } : {}, ...end ? { markerEnd: end } : {} };
+  return {
+    ...rest,
+    ...start ? { markerStart: start } : {},
+    ...end ? { markerEnd: end } : {},
+    ...type.edge?.dash !== void 0 ? { dash: [...type.edge.dash] } : {}
+  };
 }
 function restacked(sc, geometry, frame) {
   const out = [];
@@ -1603,6 +1919,364 @@ function bodyFollower(scene, geometry = AUTO_POSE_DESCRIPTOR) {
   };
 }
 
-export { BPMN_GROUP, BPMN_STENCILS, BPMN_TYPE, CONNECTOR_ACTION_ID, CONNECTOR_TOOL_ID, DIAGRAM_PASS_ORDER, DIAGRAM_THEME_EXTENSION, DIAGRAM_TYPES, DIAGRAM_TYPE_DOC_KEY, ERD_GROUP, ERD_STENCILS, ERD_TYPE, FLOWCHART_GROUP, FLOWCHART_STENCILS, FLOWCHART_TYPE, FOLLOW_OFF_PAGE_ACTION_ID, MIND_MAP_GROUP, MIND_MAP_STENCILS, MIND_MAP_TYPE, NETWORK_GROUP, NETWORK_STENCILS, NETWORK_TYPE, ORG_CHART_TYPE, ORG_GROUP, ORG_STENCILS, STENCIL_GROUPS, StencilGhost, UML_CLASS_TYPE, UML_GROUP, UML_STENCILS, addStencilGroup, addThemeRole, applyDiagramTheme, bodyFollower, connectorTool, createFollowOffPageAction, diagramOffPage, diagramStyleOf, diagramThemeFromTokens, diagramTypeDocOf, diagramTypeDocValue, diagramTypeEdgeStroke, diagramTypeOf, documentBoundsOf, editableTheme, followOffPageBinding, forkTheme, groupStencilIds, groupStencils, hopFollower, installAvoidRouting, installHops, installLabelPlacement, installOffPageMarkers, isContainerStencil, isShippedTheme, offPageOps, offPageTargetOf, parseDiagramTheme, removeStencilGroup, removeThemeRole, renameThemeRole, rendererMeasure, routeDataOps, setDiagramColor, setDiagramFontSize, setDiagramStyle, setDiagramType, setThemeValue, stencilBuild, stencilIdOf, stencilKind, stencilTool, themeRoles, themeToJson, themeValue, useAvoidRouting, useConnectorTool, useHops, useLabelPlacement, useOffPageMarkers, useStencilInsert, useStencilTool, waypointFollower };
+// src/sequence/authorPlace.ts
+function sequenceAt(scene, world2) {
+  const all = placedSequences(scene);
+  for (let i = all.length - 1; i >= 0; i--) {
+    const root = all[i];
+    const local = { x: world2.x - root.origin.x, y: world2.y - root.origin.y };
+    if (local.x < 0 || local.y < 0 || local.x > root.width || local.y > root.height) continue;
+    const held = sequenceRootOf(scene.get(root.id));
+    if (held !== null) return { root, data: held.sequence, local };
+  }
+  return null;
+}
+function sequenceHitOf(scene, id, world2) {
+  const root = placedSequences(scene).find((p) => p.id === id);
+  const node = root === void 0 ? void 0 : scene.get(id);
+  const held = node === void 0 ? null : sequenceRootOf(node);
+  if (root === void 0 || held === null) return null;
+  return { root, data: held.sequence, local: { x: world2.x - root.origin.x, y: world2.y - root.origin.y } };
+}
+function nearestIndex(xs, x) {
+  return xs.reduce((best, v, i) => best < 0 || Math.abs(v - x) < Math.abs(xs[best] - x) ? i : best, -1);
+}
+function columnNear(root, x) {
+  const i = nearestIndex(root.geometry.columns.map((c) => c.x), x);
+  return i < 0 ? null : { ...root.geometry.columns[i], index: i };
+}
+var columnIndexAt = (root, x) => root.geometry.columns.filter((c) => c.x < x).length;
+function slotNear(root, y, keep = () => true) {
+  const slots = root.geometry.slots.filter((s) => keep(s.place));
+  const i = nearestIndex(slots.map((s) => s.y), y);
+  return i < 0 ? null : slots[i];
+}
+var sameList = (a, b) => a === b || a !== null && b !== null && a.fragment === b.fragment && a.section === b.section;
+
+// src/sequence/authorActions.ts
+var ADD_PARTICIPANT_ACTION_ID = "diagram.sequence.addParticipant";
+var ADD_NOTE_ACTION_ID = "diagram.sequence.addNote";
+var ADD_MARK_ACTION_ID = "diagram.sequence.addMark";
+var NOTE_OVER_REACH = 20;
+var worldOf = (params) => {
+  const w = params?.world;
+  return w !== void 0 && typeof w.x === "number" && typeof w.y === "number" ? w : null;
+};
+function clickOf(deps, params) {
+  const scene = deps.scene;
+  const at = worldOf(params);
+  return scene === void 0 || at === null ? null : { scene, at, hit: sequenceAt(scene, at) };
+}
+function firstAt(at, p, opts) {
+  const data = { participants: [p], steps: [] };
+  const layout = sequenceLayout(data, opts.measure ? { measure: opts.measure } : {});
+  const head = layout.heads[0];
+  return { at: { x: at.x - layout.columns[0].x, y: at.y - head.box.y }, data };
+}
+function createAddParticipantAction(opts = {}) {
+  const commit = sequenceCommitOf(opts);
+  const start = opts.start !== void 0 ? opts.start : opts.commit !== void 0 ? null : (at, data, deps) => {
+    if (deps.scene !== void 0) startSequence(deps.scene, at, data, "Add sequence", opts);
+  };
+  return {
+    id: ADD_PARTICIPANT_ACTION_ID,
+    label: "Add participant",
+    group: "diagram",
+    requires: ["scene"],
+    invoker: {
+      timing: "immediate",
+      run(deps, params) {
+        const click = clickOf(deps, params);
+        if (click === null) return "pass";
+        const kind = params?.kind === "actor" ? "actor" : "participant";
+        const { hit } = click;
+        if (hit === null) {
+          if (start === null) return "pass";
+          const first = firstAt(click.at, newParticipant({ participants: [], steps: [] }, kind), opts);
+          start(first.at, first.data, deps);
+          return void 0;
+        }
+        const data = addParticipant(hit.data, newParticipant(hit.data, kind), columnIndexAt(hit.root, hit.local.x));
+        commit({ id: hit.root.id, data, label: "Add participant" }, { deps });
+        return void 0;
+      }
+    },
+    enabled: () => true
+  };
+}
+function noteAt(hit, x, y) {
+  const column = columnNear(hit.root, x);
+  const slot = slotNear(hit.root, y);
+  if (column === null || slot === null) return hit.data;
+  const dx = x - column.x;
+  const side = Math.abs(dx) <= NOTE_OVER_REACH ? void 0 : dx > 0 ? "right" : "left";
+  return insertNote(hit.data, { over: [column.id], at: slot.place, ...side ? { side } : {} });
+}
+function createAddNoteAction(opts = {}) {
+  const commit = sequenceCommitOf(opts);
+  return {
+    id: ADD_NOTE_ACTION_ID,
+    label: "Add note",
+    group: "diagram",
+    requires: ["scene"],
+    invoker: {
+      timing: "immediate",
+      run(deps, params) {
+        const hit = clickOf(deps, params)?.hit ?? null;
+        if (hit === null) return "pass";
+        const data = noteAt(hit, hit.local.x, hit.local.y);
+        if (data !== hit.data) commit({ id: hit.root.id, data, label: "Add note" }, { deps });
+        return void 0;
+      }
+    },
+    enabled: () => true
+  };
+}
+var MARKS = /* @__PURE__ */ new Set(["activate", "deactivate", "create", "destroy"]);
+function createAddMarkAction(opts = {}) {
+  const commit = sequenceCommitOf(opts);
+  return {
+    id: ADD_MARK_ACTION_ID,
+    label: "Add lifeline mark",
+    group: "diagram",
+    requires: ["scene"],
+    invoker: {
+      timing: "immediate",
+      run(deps, params) {
+        const hit = clickOf(deps, params)?.hit ?? null;
+        const column = hit === null ? null : columnNear(hit.root, hit.local.x);
+        const slot = hit === null ? null : slotNear(hit.root, hit.local.y);
+        if (hit === null || column === null || slot === null) return "pass";
+        const kind = MARKS.has(params?.mark) ? params.mark : "activate";
+        const data = insertMark(hit.data, { kind, participant: column.id }, slot.place);
+        if (data !== hit.data) commit({ id: hit.root.id, data, label: "Add lifeline mark" }, { deps });
+        return void 0;
+      }
+    },
+    enabled: () => true
+  };
+}
+
+// src/sequence/authorDrags.ts
+var DRAW_MESSAGE_ACTION_ID = "diagram.sequence.drawMessage";
+var DRAW_NOTE_ACTION_ID = "diagram.sequence.drawNote";
+var WRAP_FRAGMENT_ACTION_ID = "diagram.sequence.wrapFragment";
+function paramsOf(opts) {
+  const p = opts?.params;
+  return (typeof p === "function" ? p() : p) ?? {};
+}
+function authorDrag(id, label, opts, plan) {
+  const commit = sequenceCommitOf(opts);
+  return {
+    id,
+    label,
+    group: "diagram",
+    requires: ["scene"],
+    invoker: {
+      timing: "ongoing",
+      start(ctx, binding) {
+        const scene = ctx.deps.scene;
+        const start = ctx.drag?.start ?? { x: ctx.world.x, y: ctx.world.y };
+        const press = scene === void 0 ? null : sequenceAt(scene, start);
+        if (scene === void 0 || press === null) return {};
+        let proposal = null;
+        const propose = (at) => {
+          const now = sequenceHitOf(scene, press.root.id, at);
+          proposal = now === null ? null : plan(press, now, paramsOf(binding));
+        };
+        return {
+          kind: id,
+          onMove(move) {
+            propose({ x: move.world.x, y: move.world.y });
+          },
+          overlay: () => proposal?.overlay ?? null,
+          onEnd(end, reason) {
+            if (reason === "commit") propose({ x: end.world.x, y: end.world.y });
+            const done = proposal;
+            proposal = null;
+            if (reason !== "commit" || done === null || done.data === press.data) return;
+            commit({ id: press.root.id, data: done.data, label: done.label }, { deps: { ...end.deps, scene } });
+          }
+        };
+      }
+    },
+    enabled: () => true
+  };
+}
+var world = (hit, x, y) => ({ x: hit.root.origin.x + x, y: hit.root.origin.y + y });
+var arrowOf = (params) => typeof params.arrow === "object" && params.arrow !== null ? params.arrow : SEQ_ARROWS[params.arrow ?? "sync"] ?? SEQ_ARROWS.sync;
+function createDrawMessageAction(opts = {}) {
+  return authorDrag(DRAW_MESSAGE_ACTION_ID, "Draw message", opts, (press, now, params) => {
+    const from = columnNear(press.root, press.local.x);
+    const to = columnNear(now.root, now.local.x);
+    const slot = slotNear(press.root, press.local.y);
+    if (from === null || to === null || slot === null) return null;
+    const data = insertMessage(press.data, { from: from.id, to: to.id, at: slot.place, arrow: arrowOf(params) });
+    const y = slot.y;
+    const points = from.id === to.id ? [world(press, from.x, y), world(press, from.x + SEQ.loopWidth, y), world(press, from.x + SEQ.loopWidth, y + SEQ.loopHeight), world(press, from.x, y + SEQ.loopHeight)] : [world(press, from.x, y), world(press, now.local.x, y)];
+    return { data, label: "Add message", overlay: [{ kind: "polyline", points, role: "connector" }] };
+  });
+}
+var outline = (hit, x0, y0, x1, y1) => [world(hit, x0, y0), world(hit, x1, y0), world(hit, x1, y1), world(hit, x0, y1), world(hit, x0, y0)];
+function createDrawNoteAction(opts = {}) {
+  return authorDrag(DRAW_NOTE_ACTION_ID, "Draw note", opts, (press, now) => {
+    const from = columnNear(press.root, press.local.x);
+    const to = columnNear(now.root, now.local.x);
+    const slot = slotNear(press.root, press.local.y);
+    if (from === null || to === null || slot === null) return null;
+    const data = from.id === to.id ? noteAt(press, now.local.x, press.local.y) : insertNote(press.data, { over: from.index < to.index ? [from.id, to.id] : [to.id, from.id], at: slot.place });
+    const [x0, x1] = [Math.min(from.x, to.x) - SEQ.noteOverhang, Math.max(from.x, to.x) + SEQ.noteOverhang];
+    return { data, label: "Add note", overlay: [{ kind: "polyline", points: outline(press, x0, slot.y, x1, slot.y + SEQ.rowGap * 2), role: "insert" }] };
+  });
+}
+var FRAGMENT_TYPES = /* @__PURE__ */ new Set(["loop", "alt", "opt", "par", "critical", "break", "region"]);
+function createWrapFragmentAction(opts = {}) {
+  return authorDrag(WRAP_FRAGMENT_ACTION_ID, "Wrap in fragment", opts, (press, now, params) => {
+    const first = slotNear(press.root, press.local.y);
+    if (first === null) return null;
+    const last = slotNear(press.root, now.local.y, (place) => sameList(place.parent, first.place.parent)) ?? first;
+    const type = FRAGMENT_TYPES.has(params.type) ? params.type : "loop";
+    const data = wrapSteps(press.data, first.place.parent, first.place.index, last.place.index, { type });
+    const xs = press.root.geometry.columns.map((c) => c.x);
+    const [x0, x1] = [Math.min(...xs, press.local.x) - SEQ.fragmentPad, Math.max(...xs, press.local.x) + SEQ.fragmentPad];
+    const [y0, y1] = [Math.min(first.y, last.y), Math.max(first.y, last.y, Math.min(first.y, last.y) + SEQ.rowGap)];
+    return { data, label: "Add fragment", overlay: [{ kind: "polyline", points: outline(press, x0, y0, x1, y1), role: "target" }] };
+  });
+}
+
+// src/sequence/selected.ts
+var LIST_OF = {
+  head: "participants",
+  lifeline: "participants",
+  message: "messages",
+  note: "notes",
+  fragment: "fragments",
+  divider: "fragments",
+  box: "boxes"
+};
+function sequenceSelectionOf(scene, ids) {
+  let root = null;
+  for (const id of ids) {
+    const node = scene.get(id);
+    if (node === void 0) continue;
+    const part = sequencePartOf(node);
+    if (part !== null) root = part.root;
+    else if (sequenceRootOf(node) !== null) root = id;
+    if (root !== null) break;
+  }
+  if (root === null) {
+    const all = scene.renderOrderNodes().filter((n) => sequenceRootOf(n) !== null);
+    if (all.length !== 1) return null;
+    root = all[0].id;
+  }
+  const held = sequenceRootOf(scene.get(root));
+  if (held === null) return null;
+  const out = { root, data: held.sequence, participants: [], messages: [], notes: [], fragments: [], boxes: [] };
+  for (const id of ids) {
+    const node = scene.get(id);
+    const part = node === void 0 ? null : sequencePartOf(node);
+    if (part === null || part.root !== root || part.id === void 0) continue;
+    const list = LIST_OF[part.part];
+    if (list !== void 0 && !out[list].includes(part.id)) out[list].push(part.id);
+  }
+  return out;
+}
+var SEQUENCE_TOOLS = toolSet("sequence", [
+  "diagram.sequence.participant",
+  "diagram.sequence.message",
+  "diagram.sequence.note",
+  "diagram.sequence.fragment",
+  "diagram.sequence.mark"
+]);
+var ON_SEQUENCE = `affordance:${SEQUENCE_AFFORDANCE_KIND}`;
+function both(tool, kind, actionId, params) {
+  const at = (id) => ({ id: `${tool}.${id}`, ...params ? { params } : {} });
+  return [
+    { spec: { kind }, actionId, opts: at(kind) },
+    { spec: { kind, target: ON_SEQUENCE }, actionId, opts: at(`${kind}.onSequence`) }
+  ];
+}
+function sequenceTools(opts = {}) {
+  const participant = "diagram.sequence.participant";
+  const message = "diagram.sequence.message";
+  const note = "diagram.sequence.note";
+  const fragment = "diagram.sequence.fragment";
+  const mark = "diagram.sequence.mark";
+  return {
+    [participant]: defineTool({
+      id: participant,
+      hookName: "useSequenceTools",
+      cursor: "copy",
+      presentation: { label: "Participant", icon: (
+        /* @icon */
+        "diagram:umlActor"
+      ), group: "sequence" },
+      actions: [createAddParticipantAction(opts)],
+      bindings: both(participant, "click", ADD_PARTICIPANT_ACTION_ID, () => ({ kind: opts.participant?.() ?? "participant" }))
+    }),
+    [message]: defineTool({
+      id: message,
+      hookName: "useSequenceTools",
+      cursor: "crosshair",
+      presentation: { label: "Message", icon: (
+        /* @icon */
+        "core:arrow"
+      ), group: "sequence" },
+      actions: [createDrawMessageAction(opts)],
+      bindings: both(message, "drag", DRAW_MESSAGE_ACTION_ID, () => ({ arrow: opts.arrow?.() ?? "sync" }))
+    }),
+    [note]: defineTool({
+      id: note,
+      hookName: "useSequenceTools",
+      cursor: "copy",
+      presentation: { label: "Note", icon: (
+        /* @icon */
+        "diagram:umlNote"
+      ), group: "sequence" },
+      actions: [createAddNoteAction(opts), createDrawNoteAction(opts)],
+      bindings: [...both(note, "click", ADD_NOTE_ACTION_ID), ...both(note, "drag", DRAW_NOTE_ACTION_ID)]
+    }),
+    [fragment]: defineTool({
+      id: fragment,
+      hookName: "useSequenceTools",
+      cursor: "crosshair",
+      presentation: { label: "Fragment", icon: (
+        /* @icon */
+        "diagram:container"
+      ), group: "sequence" },
+      actions: [createWrapFragmentAction(opts)],
+      bindings: both(fragment, "drag", WRAP_FRAGMENT_ACTION_ID, () => ({ type: opts.fragment?.() ?? "loop" }))
+    }),
+    [mark]: defineTool({
+      id: mark,
+      hookName: "useSequenceTools",
+      cursor: "copy",
+      presentation: { label: "Mark", icon: (
+        /* @icon */
+        "diagram:task"
+      ), group: "sequence" },
+      actions: [createAddMarkAction(opts)],
+      bindings: both(mark, "click", ADD_MARK_ACTION_ID, () => ({ mark: opts.mark?.() ?? "activate" }))
+    })
+  };
+}
+function useSequenceTools(opts = {}) {
+  const latest = useLatest(opts);
+  const { measure, theme } = opts;
+  const custom = opts.commit !== void 0;
+  const starts = opts.start === void 0 ? "default" : opts.start === null ? "none" : "own";
+  return useMemo(() => sequenceTools({
+    ...measure ? { measure } : {},
+    ...theme ? { theme } : {},
+    ...custom ? { commit: (edit, ctx) => latest.current.commit?.(edit, ctx) } : {},
+    ...starts === "none" ? { start: null } : starts === "own" ? { start: (at, data, deps) => latest.current.start?.(at, data, deps) } : {},
+    participant: () => latest.current.participant?.() ?? "participant",
+    arrow: () => latest.current.arrow?.() ?? "sync",
+    fragment: () => latest.current.fragment?.() ?? "loop",
+    mark: () => latest.current.mark?.() ?? "activate"
+  }), [latest, measure, theme, custom, starts]);
+}
+
+export { ADD_MARK_ACTION_ID, ADD_NOTE_ACTION_ID, ADD_PARTICIPANT_ACTION_ID, ARCHITECTURE_GROUP, ARCHITECTURE_STENCILS, ARCHITECTURE_TYPE, BLOCK_TYPE, BPMN_GROUP, BPMN_STENCILS, BPMN_TYPE, C4_GROUP, C4_STENCILS, C4_TYPE, CONNECTOR_ACTION_ID, CONNECTOR_TOOL_ID, DIAGRAM_PASS_ORDER, DIAGRAM_THEME_EXTENSION, DIAGRAM_TYPES, DIAGRAM_TYPE_DOC_KEY, DRAW_MESSAGE_ACTION_ID, DRAW_NOTE_ACTION_ID, ERD_GROUP, ERD_STENCILS, ERD_TYPE, FLOWCHART_GROUP, FLOWCHART_NOTATION, FLOWCHART_STENCILS, FLOWCHART_TYPE, FOLLOW_OFF_PAGE_ACTION_ID, KANBAN_GROUP, KANBAN_STENCILS, KANBAN_TYPE, MIND_MAP_GROUP, MIND_MAP_STENCILS, MIND_MAP_TYPE, NETWORK_GROUP, NETWORK_STENCILS, NETWORK_TYPE, NOTE_OVER_REACH, ORG_CHART_TYPE, ORG_GROUP, ORG_STENCILS, REQUIREMENT_GROUP, REQUIREMENT_STENCILS, REQUIREMENT_TYPE, SEQUENCE_TOOLS, STATE_GROUP, STATE_STENCILS, STATE_TYPE, STENCIL_GROUPS, StencilGhost, UML_CLASS_TYPE, UML_GROUP, UML_STENCILS, WRAP_FRAGMENT_ACTION_ID, addStencilGroup, addThemeRole, applyDiagramTheme, bodyFollower, connectorTool, createAddMarkAction, createAddNoteAction, createAddParticipantAction, createDrawMessageAction, createDrawNoteAction, createFollowOffPageAction, createWrapFragmentAction, diagramNotationOf, diagramOffPage, diagramStyleOf, diagramThemeFromTokens, diagramTypeDocOf, diagramTypeDocValue, diagramTypeEdgeStroke, diagramTypeOf, diagramTypeOfNotation, documentBoundsOf, editableTheme, followOffPageBinding, forkTheme, groupStencilIds, groupStencils, hopFollower, installAvoidRouting, installHops, installLabelPlacement, installOffPageMarkers, isContainerStencil, isShippedTheme, offPageOps, offPageTargetOf, parseDiagramTheme, removeStencilGroup, removeThemeRole, renameThemeRole, rendererMeasure, routeDataOps, sequenceSelectionOf, sequenceTools, setDiagramColor, setDiagramFontSize, setDiagramStyle, setDiagramType, setThemeValue, stencilBuild, stencilIdOf, stencilKind, stencilTool, themeRoles, themeToJson, themeValue, useAvoidRouting, useConnectorTool, useHops, useLabelPlacement, useOffPageMarkers, useSequenceTools, useStencilInsert, useStencilTool, waypointFollower };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map