@weasel-js/diagram 1.13.0 → 1.14.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +122 -17
- package/dist/{chunk-Y72FK3Y7.js → chunk-5VNPLOIX.js} +94 -6
- package/dist/chunk-5VNPLOIX.js.map +1 -0
- package/dist/{chunk-ESFIS7BB.js → chunk-62SMY45E.js} +918 -574
- package/dist/chunk-62SMY45E.js.map +1 -0
- package/dist/{chunk-FAQXYGMX.js → chunk-TBG6DFB2.js} +3 -3
- package/dist/{chunk-FAQXYGMX.js.map → chunk-TBG6DFB2.js.map} +1 -1
- package/dist/{chunk-L4H444QI.js → chunk-VB6HUKNG.js} +659 -185
- package/dist/chunk-VB6HUKNG.js.map +1 -0
- package/dist/{chunk-QU4QZUC6.js → chunk-ZWXM5F4I.js} +141 -39
- package/dist/chunk-ZWXM5F4I.js.map +1 -0
- package/dist/{dataTypes-DW-MljuN.d.ts → dataTypes-BIkhAOc4.d.ts} +13 -2
- package/dist/effect-audio.d.ts +2 -1
- package/dist/effect-audio.js +6 -5
- package/dist/effect-audio.js.map +1 -1
- package/dist/effect.d.ts +46 -16
- package/dist/effect.js +257 -102
- package/dist/effect.js.map +1 -1
- package/dist/icons.table.js +262 -0
- package/dist/icons.table.js.map +1 -1
- package/dist/icons.table.json +262 -0
- package/dist/index.d.ts +491 -167
- package/dist/index.js +586 -36
- package/dist/index.js.map +1 -1
- package/dist/labelTrait-BBjRgxbz.d.ts +44 -0
- package/dist/layout.d.ts +4 -3
- package/dist/{layout.entry-CQoPNfzA.d.ts → layout.entry-Ca6pVvqo.d.ts} +23 -2
- package/dist/layout.js +2 -2
- package/dist/{stageTypes-DvnR8cKQ.d.ts → stageTypes-UiO25hcn.d.ts} +7 -0
- package/dist/{types-vbW21fHm.d.ts → types-B0n2CNTW.d.ts} +108 -81
- package/package.json +11 -9
- package/dist/chunk-ESFIS7BB.js.map +0 -1
- package/dist/chunk-L4H444QI.js.map +0 -1
- package/dist/chunk-QU4QZUC6.js.map +0 -1
- package/dist/chunk-Y72FK3Y7.js.map +0 -1
package/dist/index.js
CHANGED
|
@@ -1,14 +1,16 @@
|
|
|
1
1
|
import './chunk-WDIE35AK.js';
|
|
2
|
-
import { createConnectAction, avoidSceneInput, sceneEdges, inOrUnder, withHopsData, edgePolylines, themeWrites, hopDataOps, diagramDropParentAt, containerBuild } from './chunk-
|
|
3
|
-
export { ADD_LANE_ACTION_ID, CONNECT_ACTION_ID, CONTAINER_STENCILS, DEFAULT_EDGE_STROKE, 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, 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, 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, dragSegment, dragVertex, easedProducer, edgeEndLayer, edgeEndScratchOf, editContainerTitleAction, editContainerTitleBinding, forceProducer, grabPortAction, grabPortBindings, groupReorderContribution, groupReorderSlots, headerIdOf, insertWaypoint, isBodyEnd, isBodyOrRegion, isDiagramBody, laneLayer, laneResizeFrame, laneScratchOf, lanesOf, layoutPoses, movedLabelData, pinSegment, poolAxisOf, poolsOf, portLayer, portScratchOf, reconnectBinding, regionHeaderAt, registerDiagramShape, releaseMembers, removeSegment, removeWaypoint, reorderBinding, reorderContribution, routeHandles, routeStateOf, routeWrites, routedData, routerActions, routesOf, sceneParticipants, segmentAxis, sequenceSlots, themeWrites, unpinSegment, useLiveLayout, useMirroredSelection, waypointLayer, waypointScratchOf, withRouter } from './chunk-
|
|
4
|
-
import { createAvoidRouter, HOPS_DOC_KEY, edgeHops, placeLabels } from './chunk-
|
|
5
|
-
export { AVOID_DEFAULTS, DEFAULT_HOP_SIZE, HOPS_DOC_KEY, createAvoidRouter, edgeHops, placeLabels, simplifyStops } from './chunk-
|
|
6
|
-
import { DEFAULT_NODE_STYLE, NODE_STROKE_WIDTH, rowTextStyle, DEFAULT_FONT, bodyLayoutOf, offPageTagLook, diagramThemeOf, offPageSplits, offPageTagOf, DIAGRAM_THEMES, DIAGRAM_THEME_KEY, themeDocValue, DIAGRAM_ROLES, diagramLabelOf, diagramContainerOf, diagramGroupOf, offPageTagId, offPageFarText, offPageTagSpec, offPageTagData, offPageTagSize, relayoutBodies, labelSize, labelStyleOf } from './chunk-
|
|
7
|
-
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-
|
|
8
|
-
import { buildBody, diagramEdgeOf, samePoints, diagramNodeOf, labelCenter } from './chunk-
|
|
9
|
-
export { COMPASS, DEFAULT_GROUP_INSET, DEFAULT_NODE_GAP, DEFAULT_PORTS, DEFAULT_RANK_GAP, DIAGRAM_TRAIT_KEY, 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, outlinePath, outlinePolyline, packAcross, packClusters, pinnedSet, planOf, plannerPlan, portLabelBox, portLabelsOf, portOf, portSitesOf, portsOf, portsOnOutline, rankGaps, ranksByLength, ranksOf, rayHit, routeHolds, seededOrder, settle, sizeToBody, subpathOf, translated, tree, untilSettled } from './chunk-
|
|
2
|
+
import { CONTAINERS_GROUP, createConnectAction, avoidSceneInput, sceneEdges, inOrUnder, withHopsData, edgePolylines, themeWrites, hopDataOps, worldWith, diagramDropParentAt, containerBuild } from './chunk-62SMY45E.js';
|
|
3
|
+
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-62SMY45E.js';
|
|
4
|
+
import { createAvoidRouter, HOPS_DOC_KEY, edgeHops, placeLabels } from './chunk-5VNPLOIX.js';
|
|
5
|
+
export { AVOID_DEFAULTS, DEFAULT_HOP_SIZE, HOPS_DOC_KEY, createAvoidRouter, edgeHops, placeLabels, radial, simplifyStops } from './chunk-5VNPLOIX.js';
|
|
6
|
+
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-ZWXM5F4I.js';
|
|
7
|
+
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-ZWXM5F4I.js';
|
|
8
|
+
import { EVENT_SIZE, GATEWAY_SIZE, DEVICE_SIZE, buildBody, outlineDetail, outlinePath, diagramEdgeOf, samePoints, diagramNodeOf, layoutBody, labelCenter } from './chunk-VB6HUKNG.js';
|
|
9
|
+
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-VB6HUKNG.js';
|
|
10
10
|
import { useMemo, useRef, useEffect } from 'react';
|
|
11
|
-
import { bodyPredicate, AUTO_POSE_DESCRIPTOR, defineTool, createInsertOp, INSERT_REPOSITION_BINDING, useDepRegistry, useLatest, useDepSource, commitOps, createSetDataOp, useOptionalDepRegistry, useTransformFollower,
|
|
11
|
+
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';
|
|
12
|
+
import { pathToD, pathPoint } from '@weasel-js/geom';
|
|
13
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
12
14
|
import { PATH_M } from '@weasel-js/core/math';
|
|
13
15
|
|
|
14
16
|
var CONNECTOR_TOOL_ID = "diagram.connector";
|
|
@@ -34,6 +36,8 @@ function useConnectorTool(opts) {
|
|
|
34
36
|
[participants, read2, geometry, canConnect, showsPort, snapRadius, router, routers, commit, edgeStroke]
|
|
35
37
|
);
|
|
36
38
|
}
|
|
39
|
+
|
|
40
|
+
// src/stencils/flowchart.ts
|
|
37
41
|
var FLOWCHART_STENCILS = [
|
|
38
42
|
{ id: "process", label: "Process", outline: "rect", size: { width: 120, height: 60 }, icon: (
|
|
39
43
|
/* @icon */
|
|
@@ -64,6 +68,9 @@ var FLOWCHART_STENCILS = [
|
|
|
64
68
|
"shape:circle"
|
|
65
69
|
) }
|
|
66
70
|
];
|
|
71
|
+
var FLOWCHART_GROUP = { id: "flowchart", label: "Flowchart", stencils: FLOWCHART_STENCILS };
|
|
72
|
+
|
|
73
|
+
// src/stencil.ts
|
|
67
74
|
var stencilKind = (id) => `stencil:${id}`;
|
|
68
75
|
function stencilIdOf(kind) {
|
|
69
76
|
return kind.startsWith("stencil:") ? kind.slice("stencil:".length) : null;
|
|
@@ -76,9 +83,15 @@ function placedBounds(stencil, b) {
|
|
|
76
83
|
}
|
|
77
84
|
function stencilBuild(stencil, bounds, opts) {
|
|
78
85
|
const id = opts.newId();
|
|
79
|
-
const style = opts.style ?? DEFAULT_NODE_STYLE;
|
|
86
|
+
const style = { ...opts.style ?? DEFAULT_NODE_STYLE, ...stencil.style };
|
|
80
87
|
const at = placedBounds(stencil, bounds);
|
|
81
|
-
const spec = {
|
|
88
|
+
const spec = {
|
|
89
|
+
outline: stencil.outline,
|
|
90
|
+
rows: stencil.rows ?? DEFAULT_ROWS,
|
|
91
|
+
...stencil.padding !== void 0 ? { padding: stencil.padding } : {},
|
|
92
|
+
...stencil.gap !== void 0 ? { gap: stencil.gap } : {},
|
|
93
|
+
...stencil.verticalAlign !== void 0 ? { verticalAlign: stencil.verticalAlign } : {}
|
|
94
|
+
};
|
|
82
95
|
const built = buildBody(
|
|
83
96
|
spec,
|
|
84
97
|
at,
|
|
@@ -87,7 +100,7 @@ function stencilBuild(stencil, bounds, opts) {
|
|
|
87
100
|
layer: opts.layer,
|
|
88
101
|
...opts.measure ? { measure: opts.measure } : {},
|
|
89
102
|
body: (trait) => ({
|
|
90
|
-
diagram: { ...trait, ...bodyLayoutOf(spec, trait) },
|
|
103
|
+
diagram: { ...trait, ...bodyLayoutOf(spec, trait, opts.measure) },
|
|
91
104
|
fill: { paint: { color: style.fill } },
|
|
92
105
|
stroke: { paint: { color: style.stroke }, width: style.strokeWidth ?? NODE_STROKE_WIDTH, ...style.dash ? { dash: style.dash } : {} }
|
|
93
106
|
}),
|
|
@@ -99,8 +112,9 @@ function stencilBuild(stencil, bounds, opts) {
|
|
|
99
112
|
} : null
|
|
100
113
|
}
|
|
101
114
|
);
|
|
102
|
-
const
|
|
103
|
-
|
|
115
|
+
const specs = localizeWorldPoses(built.specs.map((spec2, k) => ({ ...spec2, id: spec2.id ?? `${id}/${k}` })), RIGID_POSE_COMPOSITION);
|
|
116
|
+
const ops = specs.map((spec2) => createInsertOp({
|
|
117
|
+
node: { ...spec2, parent: spec2.parent ?? opts.parent ?? null },
|
|
104
118
|
label: `Insert ${stencil.label}`
|
|
105
119
|
}));
|
|
106
120
|
return { id, ops };
|
|
@@ -134,16 +148,14 @@ function useStencilInsert(stencils, opts = {}) {
|
|
|
134
148
|
if (id === null) return void 0;
|
|
135
149
|
return stencilsRef.current.find((s) => s.id === id) ?? optsRef.current.containers?.find((s) => s.id === id);
|
|
136
150
|
};
|
|
137
|
-
const builtAt = (stencil,
|
|
151
|
+
const builtAt = (stencil, world) => {
|
|
138
152
|
if (scene === void 0) return null;
|
|
139
|
-
const center = { x:
|
|
153
|
+
const center = { x: world.x + world.width / 2, y: world.y + world.height / 2 };
|
|
140
154
|
const role = "role" in stencil ? stencil.role : null;
|
|
141
155
|
const { style, measure, font, containerStyle, laneStyles } = optsRef.current;
|
|
142
|
-
const
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
parent: diagramDropParentAt(scene, center, role)
|
|
146
|
-
};
|
|
156
|
+
const parent = diagramDropParentAt(scene, center, role);
|
|
157
|
+
const bounds = parent === null ? world : scenePoseFrame(scene).localUnder(parent, { ...world });
|
|
158
|
+
const common = { layer: layer(), newId: () => scene.mintId(), parent };
|
|
147
159
|
if ("role" in stencil) {
|
|
148
160
|
const boxStyle = containerStyle ?? style;
|
|
149
161
|
return containerBuild(stencil, bounds, {
|
|
@@ -180,6 +192,30 @@ function useStencilInsert(stencils, opts = {}) {
|
|
|
180
192
|
};
|
|
181
193
|
});
|
|
182
194
|
}
|
|
195
|
+
function StencilGhost({ stencil, style, scale = 1 }) {
|
|
196
|
+
const own = "outline" in stencil ? { ...style, ...stencil.style } : style;
|
|
197
|
+
const width = own.strokeWidth ?? NODE_STROKE_WIDTH;
|
|
198
|
+
const bounds = { x: width / 2, y: width / 2, ...stencil.size };
|
|
199
|
+
const outline = "outline" in stencil ? stencil.outline : "rect";
|
|
200
|
+
const detail = outlineDetail(outline, bounds);
|
|
201
|
+
const box = { width: stencil.size.width + width, height: stencil.size.height + width };
|
|
202
|
+
const stroke = { stroke: own.stroke, strokeWidth: width, strokeDasharray: own.dash?.join(" ") };
|
|
203
|
+
return /* @__PURE__ */ jsxs(
|
|
204
|
+
"svg",
|
|
205
|
+
{
|
|
206
|
+
width: box.width * scale,
|
|
207
|
+
height: box.height * scale,
|
|
208
|
+
viewBox: `0 0 ${box.width} ${box.height}`,
|
|
209
|
+
"aria-hidden": "true",
|
|
210
|
+
overflow: "visible",
|
|
211
|
+
"data-stencil": stencil.id,
|
|
212
|
+
children: [
|
|
213
|
+
/* @__PURE__ */ jsx("path", { d: pathToD(outlinePath(outline, bounds)), fill: own.fill, ...stroke }),
|
|
214
|
+
detail && /* @__PURE__ */ jsx("path", { d: pathToD(detail), fill: "none", ...stroke })
|
|
215
|
+
]
|
|
216
|
+
}
|
|
217
|
+
);
|
|
218
|
+
}
|
|
183
219
|
var EPS = 1e-6;
|
|
184
220
|
function offsetOf(geometry, before, after) {
|
|
185
221
|
const a = geometry.getBounds(before);
|
|
@@ -194,16 +230,15 @@ function carried(edge, d) {
|
|
|
194
230
|
}
|
|
195
231
|
function followers(sc, geometry, frame) {
|
|
196
232
|
const out = [];
|
|
233
|
+
const before = worldWith(sc);
|
|
234
|
+
const after = worldWith(sc, frame);
|
|
197
235
|
for (const node of sc.renderOrderNodes()) {
|
|
198
236
|
const edge = diagramEdgeOf(node);
|
|
199
237
|
const ends = node.dependsOn;
|
|
200
238
|
if (edge === null || (edge.waypoints ?? []).length === 0 || !Array.isArray(ends) || ends.length !== 2) continue;
|
|
201
|
-
|
|
202
|
-
const
|
|
203
|
-
const
|
|
204
|
-
if (from === void 0 || to === void 0 || fromAfter === void 0 || toAfter === void 0) continue;
|
|
205
|
-
const d = offsetOf(geometry, from.pose, fromAfter);
|
|
206
|
-
const e = offsetOf(geometry, to.pose, toAfter);
|
|
239
|
+
if (sc.get(ends[0]) === void 0 || sc.get(ends[1]) === void 0) continue;
|
|
240
|
+
const d = offsetOf(geometry, before(ends[0]), after(ends[0]));
|
|
241
|
+
const e = offsetOf(geometry, before(ends[1]), after(ends[1]));
|
|
207
242
|
if (Math.abs(d.x - e.x) > EPS || Math.abs(d.y - e.y) > EPS || d.x === 0 && d.y === 0) continue;
|
|
208
243
|
const data = node.data;
|
|
209
244
|
out.push({ id: node.id, pose: node.pose, data: { ...data, diagram: carried(edge, d) } });
|
|
@@ -221,10 +256,10 @@ function waypointFollower(scene, geometry = AUTO_POSE_DESCRIPTOR) {
|
|
|
221
256
|
const sc = scene;
|
|
222
257
|
const geo = geometry;
|
|
223
258
|
return {
|
|
224
|
-
preview: (frame) => frame.size
|
|
259
|
+
preview: (frame) => frame.size === 0 ? [] : followers(sc, geo, frame),
|
|
225
260
|
finish(ops, label) {
|
|
226
261
|
const moved = posesMovedBy(sc, ops);
|
|
227
|
-
if (moved === null || moved.size
|
|
262
|
+
if (moved === null || moved.size === 0) return [...ops];
|
|
228
263
|
const changes = followers(sc, geo, moved).map((c) => createSetDataOp({
|
|
229
264
|
id: c.id,
|
|
230
265
|
from: sc.get(c.id).data,
|
|
@@ -479,14 +514,12 @@ function labelFitOps(scene, summary, measure) {
|
|
|
479
514
|
}
|
|
480
515
|
return { ops, sizes };
|
|
481
516
|
}
|
|
482
|
-
|
|
483
|
-
// src/labels/install.ts
|
|
484
517
|
function runsOf(path) {
|
|
485
518
|
if (path === null || path.kind !== "polygon") return [];
|
|
486
519
|
const runs = [];
|
|
487
520
|
for (let i = 0; i < path.commands.length; i++) {
|
|
488
521
|
if (path.commands[i] === PATH_M || runs.length === 0) runs.push([]);
|
|
489
|
-
runs[runs.length - 1].push(
|
|
522
|
+
runs[runs.length - 1].push(pathPoint(path, i));
|
|
490
523
|
}
|
|
491
524
|
return runs.filter((r) => r.length >= 2);
|
|
492
525
|
}
|
|
@@ -621,7 +654,7 @@ function useLabelPlacement(scene, opts = {}) {
|
|
|
621
654
|
useEffect(() => installLabelPlacement(scene, latest.current).dispose, [scene, latest]);
|
|
622
655
|
}
|
|
623
656
|
function documentBoundsOf(scene, node, geometry = AUTO_POSE_DESCRIPTOR) {
|
|
624
|
-
return geometry.getBounds(
|
|
657
|
+
return geometry.getBounds(composeWorldPose(scenePoseAdapter(scene), node.id, scene.composition.compose));
|
|
625
658
|
}
|
|
626
659
|
var ENDS = ["from", "to"];
|
|
627
660
|
var sameSplit = (a, b) => a === void 0 ? b === null : b !== null && a.ref === b.ref && a.from === b.from && a.to === b.to;
|
|
@@ -761,7 +794,8 @@ function createFollowOffPageAction(opts = {}) {
|
|
|
761
794
|
invoker: {
|
|
762
795
|
timing: "immediate",
|
|
763
796
|
run(deps, params) {
|
|
764
|
-
const world =
|
|
797
|
+
const world = params?.world;
|
|
798
|
+
if (!world) return;
|
|
765
799
|
const target = tagUnder(deps, world);
|
|
766
800
|
if (target === null) return;
|
|
767
801
|
follow(target, { world, modifiers: { alt: false, shift: false, meta: false, ctrl: false }, deps });
|
|
@@ -833,7 +867,8 @@ var rendererMeasure = (text, style) => {
|
|
|
833
867
|
const { width } = measureTextBounds(text, {
|
|
834
868
|
fontSize,
|
|
835
869
|
...style.fontFamily !== void 0 ? { fontFamily: style.fontFamily } : {},
|
|
836
|
-
...style.bold === true ? { fontWeight: 700 } : {}
|
|
870
|
+
...style.bold === true ? { fontWeight: 700 } : {},
|
|
871
|
+
...style.italic === true ? { fontStyle: "italic" } : {}
|
|
837
872
|
});
|
|
838
873
|
return { width: Math.ceil(width), height: Math.ceil(fontSize * 1.2) };
|
|
839
874
|
};
|
|
@@ -1053,6 +1088,521 @@ function parseDiagramTheme(json) {
|
|
|
1053
1088
|
return errors.length > 0 ? { errors } : { theme: raw };
|
|
1054
1089
|
}
|
|
1055
1090
|
|
|
1056
|
-
|
|
1091
|
+
// src/stencils/bpmn.ts
|
|
1092
|
+
var END_EVENT_STROKE = 4;
|
|
1093
|
+
var BPMN_STENCILS = [
|
|
1094
|
+
{ id: "start-event", label: "Start event", outline: "event", size: EVENT_SIZE, icon: (
|
|
1095
|
+
/* @icon */
|
|
1096
|
+
"diagram:startEvent"
|
|
1097
|
+
) },
|
|
1098
|
+
{ id: "intermediate-event", label: "Intermediate event", outline: "intermediateEvent", size: EVENT_SIZE, icon: (
|
|
1099
|
+
/* @icon */
|
|
1100
|
+
"diagram:intermediateEvent"
|
|
1101
|
+
) },
|
|
1102
|
+
{
|
|
1103
|
+
id: "end-event",
|
|
1104
|
+
label: "End event",
|
|
1105
|
+
outline: "event",
|
|
1106
|
+
size: EVENT_SIZE,
|
|
1107
|
+
icon: (
|
|
1108
|
+
/* @icon */
|
|
1109
|
+
"diagram:endEvent"
|
|
1110
|
+
),
|
|
1111
|
+
style: { strokeWidth: END_EVENT_STROKE }
|
|
1112
|
+
},
|
|
1113
|
+
{ id: "task", label: "Task", outline: "roundRect", size: { width: 120, height: 70 }, icon: (
|
|
1114
|
+
/* @icon */
|
|
1115
|
+
"diagram:task"
|
|
1116
|
+
) },
|
|
1117
|
+
{ id: "subprocess", label: "Subprocess", outline: "subprocess", size: { width: 120, height: 80 }, icon: (
|
|
1118
|
+
/* @icon */
|
|
1119
|
+
"diagram:subprocess"
|
|
1120
|
+
) },
|
|
1121
|
+
{ id: "exclusive-gateway", label: "Exclusive gateway", outline: "exclusiveGateway", size: GATEWAY_SIZE, icon: (
|
|
1122
|
+
/* @icon */
|
|
1123
|
+
"diagram:exclusiveGateway"
|
|
1124
|
+
) },
|
|
1125
|
+
{ id: "parallel-gateway", label: "Parallel gateway", outline: "parallelGateway", size: GATEWAY_SIZE, icon: (
|
|
1126
|
+
/* @icon */
|
|
1127
|
+
"diagram:parallelGateway"
|
|
1128
|
+
) },
|
|
1129
|
+
{ id: "inclusive-gateway", label: "Inclusive gateway", outline: "inclusiveGateway", size: GATEWAY_SIZE, icon: (
|
|
1130
|
+
/* @icon */
|
|
1131
|
+
"diagram:inclusiveGateway"
|
|
1132
|
+
) },
|
|
1133
|
+
{ id: "event-gateway", label: "Event-based gateway", outline: "eventGateway", size: GATEWAY_SIZE, icon: (
|
|
1134
|
+
/* @icon */
|
|
1135
|
+
"diagram:eventGateway"
|
|
1136
|
+
) },
|
|
1137
|
+
{ id: "data-object", label: "Data object", outline: "note", size: { width: 60, height: 80 }, icon: (
|
|
1138
|
+
/* @icon */
|
|
1139
|
+
"diagram:dataObject"
|
|
1140
|
+
) },
|
|
1141
|
+
{ id: "data-store", label: "Data store", outline: "cylinder", size: { width: 80, height: 80 }, icon: (
|
|
1142
|
+
/* @icon */
|
|
1143
|
+
"diagram:dataStore"
|
|
1144
|
+
) }
|
|
1145
|
+
];
|
|
1146
|
+
var BPMN_GROUP = { id: "bpmn", label: "BPMN", stencils: BPMN_STENCILS };
|
|
1147
|
+
|
|
1148
|
+
// src/stencils/network.ts
|
|
1149
|
+
var NETWORK_STENCILS = [
|
|
1150
|
+
{ id: "server", label: "Server", outline: "server", size: DEVICE_SIZE, icon: (
|
|
1151
|
+
/* @icon */
|
|
1152
|
+
"diagram:server"
|
|
1153
|
+
) },
|
|
1154
|
+
{ id: "database", label: "Database", outline: "cylinder", size: { width: 72, height: 84 }, icon: (
|
|
1155
|
+
/* @icon */
|
|
1156
|
+
"diagram:database"
|
|
1157
|
+
) },
|
|
1158
|
+
{ id: "cloud", label: "Cloud", outline: "cloud", size: { width: 120, height: 80 }, icon: (
|
|
1159
|
+
/* @icon */
|
|
1160
|
+
"diagram:cloud"
|
|
1161
|
+
) },
|
|
1162
|
+
{ id: "router", label: "Router", outline: "router", size: DEVICE_SIZE, icon: (
|
|
1163
|
+
/* @icon */
|
|
1164
|
+
"diagram:router"
|
|
1165
|
+
) },
|
|
1166
|
+
{ id: "switch", label: "Switch", outline: "switch", size: DEVICE_SIZE, icon: (
|
|
1167
|
+
/* @icon */
|
|
1168
|
+
"diagram:switch"
|
|
1169
|
+
) },
|
|
1170
|
+
{ id: "firewall", label: "Firewall", outline: "firewall", size: DEVICE_SIZE, icon: (
|
|
1171
|
+
/* @icon */
|
|
1172
|
+
"diagram:firewall"
|
|
1173
|
+
) },
|
|
1174
|
+
{ id: "laptop", label: "Laptop", outline: "laptop", size: DEVICE_SIZE, icon: (
|
|
1175
|
+
/* @icon */
|
|
1176
|
+
"diagram:laptop"
|
|
1177
|
+
) },
|
|
1178
|
+
{ id: "desktop", label: "Desktop", outline: "desktop", size: DEVICE_SIZE, icon: (
|
|
1179
|
+
/* @icon */
|
|
1180
|
+
"diagram:desktop"
|
|
1181
|
+
) },
|
|
1182
|
+
{ id: "phone", label: "Phone", outline: "phone", size: DEVICE_SIZE, icon: (
|
|
1183
|
+
/* @icon */
|
|
1184
|
+
"diagram:phone"
|
|
1185
|
+
) },
|
|
1186
|
+
{ id: "printer", label: "Printer", outline: "printer", size: DEVICE_SIZE, icon: (
|
|
1187
|
+
/* @icon */
|
|
1188
|
+
"diagram:printer"
|
|
1189
|
+
) },
|
|
1190
|
+
{ id: "user", label: "User", outline: "user", size: DEVICE_SIZE, icon: (
|
|
1191
|
+
/* @icon */
|
|
1192
|
+
"diagram:user"
|
|
1193
|
+
) },
|
|
1194
|
+
{ id: "internet", label: "Internet", outline: "globe", size: DEVICE_SIZE, icon: (
|
|
1195
|
+
/* @icon */
|
|
1196
|
+
"diagram:internet"
|
|
1197
|
+
) }
|
|
1198
|
+
];
|
|
1199
|
+
var NETWORK_GROUP = { id: "network", label: "Network", stencils: NETWORK_STENCILS };
|
|
1200
|
+
|
|
1201
|
+
// src/stencils/mindMap.ts
|
|
1202
|
+
var MIND_MAP_STENCILS = [
|
|
1203
|
+
{
|
|
1204
|
+
id: "central-topic",
|
|
1205
|
+
label: "Central topic",
|
|
1206
|
+
outline: "ellipse",
|
|
1207
|
+
size: { width: 220, height: 110 },
|
|
1208
|
+
rows: [{ kind: "label", text: "Central topic", style: { bold: true, fontSize: 16 } }],
|
|
1209
|
+
icon: (
|
|
1210
|
+
/* @icon */
|
|
1211
|
+
"diagram:centralTopic"
|
|
1212
|
+
)
|
|
1213
|
+
},
|
|
1214
|
+
{
|
|
1215
|
+
id: "main-topic",
|
|
1216
|
+
label: "Main topic",
|
|
1217
|
+
outline: "roundRect",
|
|
1218
|
+
size: { width: 140, height: 50 },
|
|
1219
|
+
rows: [{ kind: "label", text: "Main topic", style: { bold: true, fontSize: 13 } }],
|
|
1220
|
+
icon: (
|
|
1221
|
+
/* @icon */
|
|
1222
|
+
"diagram:mainTopic"
|
|
1223
|
+
)
|
|
1224
|
+
},
|
|
1225
|
+
{
|
|
1226
|
+
id: "subtopic",
|
|
1227
|
+
label: "Subtopic",
|
|
1228
|
+
outline: "stadium",
|
|
1229
|
+
size: { width: 130, height: 40 },
|
|
1230
|
+
rows: [{ kind: "label", text: "Subtopic" }],
|
|
1231
|
+
icon: (
|
|
1232
|
+
/* @icon */
|
|
1233
|
+
"diagram:subtopic"
|
|
1234
|
+
)
|
|
1235
|
+
},
|
|
1236
|
+
{
|
|
1237
|
+
id: "floating-note",
|
|
1238
|
+
label: "Note",
|
|
1239
|
+
outline: "note",
|
|
1240
|
+
size: { width: 130, height: 80 },
|
|
1241
|
+
rows: [{ kind: "label", text: "Note", style: { fontSize: 11 } }],
|
|
1242
|
+
icon: (
|
|
1243
|
+
/* @icon */
|
|
1244
|
+
"diagram:floatingNote"
|
|
1245
|
+
)
|
|
1246
|
+
}
|
|
1247
|
+
];
|
|
1248
|
+
var MIND_MAP_GROUP = { id: "mindMap", label: "Mind map", stencils: MIND_MAP_STENCILS };
|
|
1249
|
+
|
|
1250
|
+
// src/stencils/org.ts
|
|
1251
|
+
var card = (name, title) => [
|
|
1252
|
+
{ kind: "label", text: "Name", style: name, id: "name" },
|
|
1253
|
+
{ kind: "label", text: "Title", style: title, id: "title" }
|
|
1254
|
+
];
|
|
1255
|
+
var ORG_STENCILS = [
|
|
1256
|
+
{
|
|
1257
|
+
id: "person",
|
|
1258
|
+
label: "Person",
|
|
1259
|
+
outline: "roundRect",
|
|
1260
|
+
size: { width: 160, height: 64 },
|
|
1261
|
+
rows: card({ bold: true }, { fontSize: 11 }),
|
|
1262
|
+
icon: (
|
|
1263
|
+
/* @icon */
|
|
1264
|
+
"diagram:person"
|
|
1265
|
+
)
|
|
1266
|
+
},
|
|
1267
|
+
{
|
|
1268
|
+
id: "executive",
|
|
1269
|
+
label: "Executive",
|
|
1270
|
+
outline: "roundRect",
|
|
1271
|
+
size: { width: 200, height: 84 },
|
|
1272
|
+
rows: card({ bold: true, fontSize: 15 }, { fontSize: 12 }),
|
|
1273
|
+
icon: (
|
|
1274
|
+
/* @icon */
|
|
1275
|
+
"diagram:executive"
|
|
1276
|
+
)
|
|
1277
|
+
},
|
|
1278
|
+
{
|
|
1279
|
+
id: "assistant",
|
|
1280
|
+
label: "Assistant",
|
|
1281
|
+
outline: "roundRect",
|
|
1282
|
+
size: { width: 140, height: 56 },
|
|
1283
|
+
rows: card({ bold: true, fontSize: 11 }, { fontSize: 10 }),
|
|
1284
|
+
icon: (
|
|
1285
|
+
/* @icon */
|
|
1286
|
+
"diagram:assistant"
|
|
1287
|
+
)
|
|
1288
|
+
},
|
|
1289
|
+
{
|
|
1290
|
+
id: "vacancy",
|
|
1291
|
+
label: "Vacancy",
|
|
1292
|
+
outline: "roundRect",
|
|
1293
|
+
size: { width: 160, height: 64 },
|
|
1294
|
+
rows: [{ kind: "label", text: "Vacant", style: { bold: true }, id: "name" }, { kind: "label", text: "Title", style: { fontSize: 11 }, id: "title" }],
|
|
1295
|
+
style: { dash: [6, 4] },
|
|
1296
|
+
icon: (
|
|
1297
|
+
/* @icon */
|
|
1298
|
+
"diagram:vacancy"
|
|
1299
|
+
)
|
|
1300
|
+
},
|
|
1301
|
+
{
|
|
1302
|
+
id: "department",
|
|
1303
|
+
label: "Department",
|
|
1304
|
+
outline: "rect",
|
|
1305
|
+
size: { width: 200, height: 56 },
|
|
1306
|
+
rows: [{ kind: "label", text: "Department", style: { bold: true, fontSize: 13 } }],
|
|
1307
|
+
icon: (
|
|
1308
|
+
/* @icon */
|
|
1309
|
+
"diagram:department"
|
|
1310
|
+
)
|
|
1311
|
+
}
|
|
1312
|
+
];
|
|
1313
|
+
var ORG_GROUP = { id: "org", label: "Org chart", stencils: ORG_STENCILS };
|
|
1314
|
+
|
|
1315
|
+
// src/stencils/erd.ts
|
|
1316
|
+
var ERD_STENCILS = [
|
|
1317
|
+
{
|
|
1318
|
+
id: "erd-entity",
|
|
1319
|
+
label: "Entity",
|
|
1320
|
+
outline: "rect",
|
|
1321
|
+
size: { width: 140, height: 100 },
|
|
1322
|
+
verticalAlign: "top",
|
|
1323
|
+
icon: (
|
|
1324
|
+
/* @icon */
|
|
1325
|
+
"diagram:erdEntity"
|
|
1326
|
+
),
|
|
1327
|
+
rows: [
|
|
1328
|
+
{ kind: "label", text: "Entity", style: { bold: true } },
|
|
1329
|
+
{ kind: "divider" },
|
|
1330
|
+
{ kind: "field", label: "id", value: "PK" },
|
|
1331
|
+
{ kind: "field", label: "name", value: "text" },
|
|
1332
|
+
{ kind: "field", label: "owner_id", value: "FK" }
|
|
1333
|
+
]
|
|
1334
|
+
},
|
|
1335
|
+
{ id: "erd-weak-entity", label: "Weak entity", outline: "doubleRect", size: { width: 130, height: 60 }, icon: (
|
|
1336
|
+
/* @icon */
|
|
1337
|
+
"diagram:erdWeakEntity"
|
|
1338
|
+
) },
|
|
1339
|
+
{ id: "erd-relationship", label: "Relationship", outline: "diamond", size: { width: 130, height: 80 }, icon: (
|
|
1340
|
+
/* @icon */
|
|
1341
|
+
"shape:diamond"
|
|
1342
|
+
) },
|
|
1343
|
+
{ id: "erd-attribute", label: "Attribute", outline: "ellipse", size: { width: 110, height: 50 }, icon: (
|
|
1344
|
+
/* @icon */
|
|
1345
|
+
"shape:ellipse"
|
|
1346
|
+
) }
|
|
1347
|
+
];
|
|
1348
|
+
var ERD_GROUP = { id: "erd", label: "ERD", stencils: ERD_STENCILS };
|
|
1349
|
+
|
|
1350
|
+
// src/stencils/uml.ts
|
|
1351
|
+
var member = (label, value) => ({ kind: "field", label, value });
|
|
1352
|
+
var DIVIDER = { kind: "divider" };
|
|
1353
|
+
var compartments = (name, attributes, operations) => ({
|
|
1354
|
+
rows: [name, attributes, operations].filter((c) => c.length > 0).flatMap((c, i) => i === 0 ? c : [DIVIDER, ...c]),
|
|
1355
|
+
verticalAlign: "top"
|
|
1356
|
+
});
|
|
1357
|
+
var UML_STENCILS = [
|
|
1358
|
+
{
|
|
1359
|
+
id: "uml-class",
|
|
1360
|
+
label: "Class",
|
|
1361
|
+
outline: "rect",
|
|
1362
|
+
size: { width: 160, height: 124 },
|
|
1363
|
+
icon: (
|
|
1364
|
+
/* @icon */
|
|
1365
|
+
"diagram:umlClass"
|
|
1366
|
+
),
|
|
1367
|
+
...compartments(
|
|
1368
|
+
[{ kind: "label", text: "Class", style: { bold: true } }],
|
|
1369
|
+
[member("+ id", "int"), member("+ name", "String")],
|
|
1370
|
+
[member("+ getId()", "int"), member("+ setName(n)", "void")]
|
|
1371
|
+
)
|
|
1372
|
+
},
|
|
1373
|
+
{
|
|
1374
|
+
id: "uml-interface",
|
|
1375
|
+
label: "Interface",
|
|
1376
|
+
outline: "rect",
|
|
1377
|
+
size: { width: 160, height: 96 },
|
|
1378
|
+
icon: (
|
|
1379
|
+
/* @icon */
|
|
1380
|
+
"diagram:umlInterface"
|
|
1381
|
+
),
|
|
1382
|
+
...compartments(
|
|
1383
|
+
[{ kind: "label", text: "\xABinterface\xBB" }, { kind: "label", text: "Interface", style: { bold: true } }],
|
|
1384
|
+
[],
|
|
1385
|
+
[member("+ run()", "void"), member("+ stop()", "void")]
|
|
1386
|
+
)
|
|
1387
|
+
},
|
|
1388
|
+
{
|
|
1389
|
+
id: "uml-abstract",
|
|
1390
|
+
label: "Abstract class",
|
|
1391
|
+
outline: "rect",
|
|
1392
|
+
size: { width: 160, height: 108 },
|
|
1393
|
+
icon: (
|
|
1394
|
+
/* @icon */
|
|
1395
|
+
"diagram:umlAbstract"
|
|
1396
|
+
),
|
|
1397
|
+
...compartments(
|
|
1398
|
+
[{ kind: "label", text: "AbstractClass", style: { bold: true, italic: true } }],
|
|
1399
|
+
[member("# id", "int")],
|
|
1400
|
+
[{ kind: "field", label: "+ draw()", value: "void", style: { italic: true } }, member("+ getId()", "int")]
|
|
1401
|
+
)
|
|
1402
|
+
},
|
|
1403
|
+
{ id: "uml-package", label: "Package", outline: "folder", size: { width: 120, height: 80 }, icon: (
|
|
1404
|
+
/* @icon */
|
|
1405
|
+
"diagram:umlPackage"
|
|
1406
|
+
) },
|
|
1407
|
+
{ id: "uml-note", label: "Note", outline: "note", size: { width: 120, height: 70 }, icon: (
|
|
1408
|
+
/* @icon */
|
|
1409
|
+
"diagram:umlNote"
|
|
1410
|
+
) },
|
|
1411
|
+
{ id: "uml-actor", label: "Actor", outline: "actor", size: { width: 60, height: 90 }, padding: 2, icon: (
|
|
1412
|
+
/* @icon */
|
|
1413
|
+
"diagram:umlActor"
|
|
1414
|
+
) },
|
|
1415
|
+
{ id: "uml-use-case", label: "Use case", outline: "ellipse", size: { width: 140, height: 70 }, icon: (
|
|
1416
|
+
/* @icon */
|
|
1417
|
+
"shape:ellipse"
|
|
1418
|
+
) },
|
|
1419
|
+
{ id: "uml-component", label: "Component", outline: "component", size: { width: 150, height: 70 }, icon: (
|
|
1420
|
+
/* @icon */
|
|
1421
|
+
"diagram:umlComponent"
|
|
1422
|
+
) }
|
|
1423
|
+
];
|
|
1424
|
+
var UML_GROUP = { id: "uml", label: "UML", stencils: UML_STENCILS };
|
|
1425
|
+
|
|
1426
|
+
// src/diagramTypes/catalog.ts
|
|
1427
|
+
var byId = (list) => Object.freeze(Object.fromEntries(list.map((item) => [item.id, item])));
|
|
1428
|
+
var STENCIL_GROUPS = byId([
|
|
1429
|
+
FLOWCHART_GROUP,
|
|
1430
|
+
CONTAINERS_GROUP,
|
|
1431
|
+
ORG_GROUP,
|
|
1432
|
+
NETWORK_GROUP,
|
|
1433
|
+
BPMN_GROUP,
|
|
1434
|
+
UML_GROUP,
|
|
1435
|
+
ERD_GROUP,
|
|
1436
|
+
MIND_MAP_GROUP
|
|
1437
|
+
]);
|
|
1438
|
+
var FLOWCHART_TYPE = {
|
|
1439
|
+
id: "flowchart",
|
|
1440
|
+
label: "Flowchart",
|
|
1441
|
+
icon: (
|
|
1442
|
+
/* @icon */
|
|
1443
|
+
"shape:diamond"
|
|
1444
|
+
),
|
|
1445
|
+
groups: [FLOWCHART_GROUP.id, CONTAINERS_GROUP.id]
|
|
1446
|
+
};
|
|
1447
|
+
var NETWORK_TYPE = {
|
|
1448
|
+
id: "network",
|
|
1449
|
+
label: "Network",
|
|
1450
|
+
icon: (
|
|
1451
|
+
/* @icon */
|
|
1452
|
+
"diagram:router"
|
|
1453
|
+
),
|
|
1454
|
+
groups: [NETWORK_GROUP.id, CONTAINERS_GROUP.id],
|
|
1455
|
+
edge: { router: "straight", markerEnd: null }
|
|
1456
|
+
};
|
|
1457
|
+
var BPMN_TYPE = {
|
|
1458
|
+
id: "bpmn",
|
|
1459
|
+
label: "BPMN",
|
|
1460
|
+
icon: (
|
|
1461
|
+
/* @icon */
|
|
1462
|
+
"diagram:exclusiveGateway"
|
|
1463
|
+
),
|
|
1464
|
+
groups: [BPMN_GROUP.id, CONTAINERS_GROUP.id],
|
|
1465
|
+
edge: { router: "orthogonal", markerEnd: "arrow" }
|
|
1466
|
+
};
|
|
1467
|
+
var ORG_CHART_TYPE = {
|
|
1468
|
+
id: "orgChart",
|
|
1469
|
+
label: "Org chart",
|
|
1470
|
+
icon: (
|
|
1471
|
+
/* @icon */
|
|
1472
|
+
"diagram:orgChart"
|
|
1473
|
+
),
|
|
1474
|
+
groups: [ORG_GROUP.id, CONTAINERS_GROUP.id],
|
|
1475
|
+
edge: { router: "orthogonal", markerEnd: null },
|
|
1476
|
+
layout: "tree"
|
|
1477
|
+
};
|
|
1478
|
+
var MIND_MAP_TYPE = {
|
|
1479
|
+
id: "mindMap",
|
|
1480
|
+
label: "Mind map",
|
|
1481
|
+
icon: (
|
|
1482
|
+
/* @icon */
|
|
1483
|
+
"diagram:mindMap"
|
|
1484
|
+
),
|
|
1485
|
+
groups: [MIND_MAP_GROUP.id],
|
|
1486
|
+
edge: { router: "bezier", markerEnd: null },
|
|
1487
|
+
layout: "radial"
|
|
1488
|
+
};
|
|
1489
|
+
var UML_CLASS_TYPE = {
|
|
1490
|
+
id: "umlClass",
|
|
1491
|
+
label: "UML class",
|
|
1492
|
+
icon: (
|
|
1493
|
+
/* @icon */
|
|
1494
|
+
"diagram:umlClass"
|
|
1495
|
+
),
|
|
1496
|
+
groups: [UML_GROUP.id, CONTAINERS_GROUP.id],
|
|
1497
|
+
edge: { router: "orthogonal", markerEnd: "arrow-open" }
|
|
1498
|
+
};
|
|
1499
|
+
var ERD_TYPE = {
|
|
1500
|
+
id: "erd",
|
|
1501
|
+
label: "Entity relationship",
|
|
1502
|
+
icon: (
|
|
1503
|
+
/* @icon */
|
|
1504
|
+
"diagram:erdEntity"
|
|
1505
|
+
),
|
|
1506
|
+
groups: [ERD_GROUP.id],
|
|
1507
|
+
edge: { router: "orthogonal", markerStart: "crow-one", markerEnd: "crow-many" }
|
|
1508
|
+
};
|
|
1509
|
+
var DIAGRAM_TYPES = byId([
|
|
1510
|
+
FLOWCHART_TYPE,
|
|
1511
|
+
ORG_CHART_TYPE,
|
|
1512
|
+
NETWORK_TYPE,
|
|
1513
|
+
BPMN_TYPE,
|
|
1514
|
+
UML_CLASS_TYPE,
|
|
1515
|
+
ERD_TYPE,
|
|
1516
|
+
MIND_MAP_TYPE
|
|
1517
|
+
]);
|
|
1518
|
+
var isContainerStencil = (stencil) => "role" in stencil;
|
|
1519
|
+
function groupStencils(ids, catalog = STENCIL_GROUPS) {
|
|
1520
|
+
return ids.flatMap((id) => catalog[id]?.stencils ?? []);
|
|
1521
|
+
}
|
|
1522
|
+
var groupStencilIds = (group) => group.stencils.map((s) => s.id);
|
|
1523
|
+
|
|
1524
|
+
// src/diagramTypes/types.ts
|
|
1525
|
+
var DIAGRAM_TYPE_DOC_KEY = "diagram:type";
|
|
1526
|
+
|
|
1527
|
+
// src/diagramTypes/doc.ts
|
|
1528
|
+
function diagramTypeDocValue(id, types = DIAGRAM_TYPES) {
|
|
1529
|
+
const type = types[id] ?? FLOWCHART_TYPE;
|
|
1530
|
+
return { type: type.id, groups: [...type.groups] };
|
|
1531
|
+
}
|
|
1532
|
+
function diagramTypeDocOf(scene, types = DIAGRAM_TYPES) {
|
|
1533
|
+
const value = scene.doc.get(DIAGRAM_TYPE_DOC_KEY);
|
|
1534
|
+
const id = typeof value?.type === "string" && types[value.type] !== void 0 ? value.type : null;
|
|
1535
|
+
if (id === null) return diagramTypeDocValue(FLOWCHART_TYPE.id, types);
|
|
1536
|
+
const groups = Array.isArray(value?.groups) ? value.groups.filter((g) => typeof g === "string") : null;
|
|
1537
|
+
return groups === null ? diagramTypeDocValue(id, types) : { type: id, groups };
|
|
1538
|
+
}
|
|
1539
|
+
function diagramTypeOf(scene, types = DIAGRAM_TYPES) {
|
|
1540
|
+
return types[diagramTypeDocOf(scene, types).type] ?? FLOWCHART_TYPE;
|
|
1541
|
+
}
|
|
1542
|
+
function write(scene, value, label) {
|
|
1543
|
+
scene.batch(label, () => scene.doc.set(DIAGRAM_TYPE_DOC_KEY, value));
|
|
1544
|
+
}
|
|
1545
|
+
function setDiagramType(scene, id, opts = {}) {
|
|
1546
|
+
const value = diagramTypeDocValue(id, opts.types);
|
|
1547
|
+
write(scene, value, opts.label ?? `Diagram type: ${(opts.types ?? DIAGRAM_TYPES)[value.type]?.label ?? value.type}`);
|
|
1548
|
+
}
|
|
1549
|
+
function addStencilGroup(scene, id, opts = {}) {
|
|
1550
|
+
const doc = diagramTypeDocOf(scene, opts.types);
|
|
1551
|
+
if (doc.groups.includes(id)) return;
|
|
1552
|
+
write(scene, { type: doc.type, groups: [...doc.groups, id] }, opts.label ?? "Add shapes");
|
|
1553
|
+
}
|
|
1554
|
+
function removeStencilGroup(scene, id, opts = {}) {
|
|
1555
|
+
const doc = diagramTypeDocOf(scene, opts.types);
|
|
1556
|
+
if (!doc.groups.includes(id)) return;
|
|
1557
|
+
write(scene, { type: doc.type, groups: doc.groups.filter((g) => g !== id) }, opts.label ?? "Remove shapes");
|
|
1558
|
+
}
|
|
1559
|
+
|
|
1560
|
+
// src/diagramTypes/edge.ts
|
|
1561
|
+
function diagramTypeEdgeStroke(theme, type) {
|
|
1562
|
+
const { markerStart, markerEnd, ...rest } = themeEdgeStroke(theme);
|
|
1563
|
+
const start = type.edge?.markerStart === void 0 ? markerStart : type.edge.markerStart;
|
|
1564
|
+
const end = type.edge?.markerEnd === void 0 ? markerEnd : type.edge.markerEnd;
|
|
1565
|
+
return { ...rest, ...start ? { markerStart: start } : {}, ...end ? { markerEnd: end } : {} };
|
|
1566
|
+
}
|
|
1567
|
+
function restacked(sc, geometry, frame) {
|
|
1568
|
+
const out = [];
|
|
1569
|
+
for (const [id, pose] of frame) {
|
|
1570
|
+
const node = sc.get(id);
|
|
1571
|
+
const trait = node === void 0 ? null : diagramNodeOf(node);
|
|
1572
|
+
const layout = trait?.body;
|
|
1573
|
+
if (node === void 0 || layout === void 0 || trait?.outline === void 0) continue;
|
|
1574
|
+
const before = geometry.getBounds(node.pose);
|
|
1575
|
+
const after = geometry.getBounds(pose);
|
|
1576
|
+
if (before.width === after.width && before.height === after.height) continue;
|
|
1577
|
+
const rows = recordedRows(layout);
|
|
1578
|
+
if (rows === null) continue;
|
|
1579
|
+
const boxes = layoutBody(
|
|
1580
|
+
{ outline: trait.outline, rows, padding: layout.padding, gap: layout.gap, verticalAlign: layout.verticalAlign },
|
|
1581
|
+
{ x: 0, y: 0, width: after.width, height: after.height }
|
|
1582
|
+
);
|
|
1583
|
+
for (const child of sc.childrenOf(id)) {
|
|
1584
|
+
const c = sc.get(child);
|
|
1585
|
+
const index = c.data?.bodyRow;
|
|
1586
|
+
const box = typeof index === "number" ? boxes[index] : void 0;
|
|
1587
|
+
if (box !== void 0) out.push({ id: child, pose: { ...c.pose, x: box.x, y: box.y, width: box.width, height: box.height } });
|
|
1588
|
+
}
|
|
1589
|
+
}
|
|
1590
|
+
return out;
|
|
1591
|
+
}
|
|
1592
|
+
function bodyFollower(scene, geometry = AUTO_POSE_DESCRIPTOR) {
|
|
1593
|
+
const sc = scene;
|
|
1594
|
+
const geo = geometry;
|
|
1595
|
+
return {
|
|
1596
|
+
preview: (frame) => restacked(sc, geo, frame),
|
|
1597
|
+
finish(ops, label) {
|
|
1598
|
+
const moved = posesMovedBy(sc, ops);
|
|
1599
|
+
if (moved === null || moved.size === 0) return [...ops];
|
|
1600
|
+
const rows = restacked(sc, geo, moved).map((r) => createTransformOp({ id: r.id, from: sc.get(r.id).pose, to: r.pose, label }));
|
|
1601
|
+
return [...ops, ...rows];
|
|
1602
|
+
}
|
|
1603
|
+
};
|
|
1604
|
+
}
|
|
1605
|
+
|
|
1606
|
+
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 };
|
|
1057
1607
|
//# sourceMappingURL=index.js.map
|
|
1058
1608
|
//# sourceMappingURL=index.js.map
|