orcasvn-react-diagrams 0.2.0 → 0.2.2
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 +22 -1
- package/ai/api-contract.json +57 -5
- package/ai/invariants.json +5 -3
- package/ai/manifest.json +1 -1
- package/dist/cjs/examples.js +11775 -0
- package/dist/cjs/index.js +3889 -1112
- package/dist/cjs/types/api/createDiagramEditor.d.ts +7 -2
- package/dist/cjs/types/api/types.d.ts +178 -0
- package/dist/cjs/types/displaybox/demos/DeletionEventsDemoTab.d.ts +3 -0
- package/dist/cjs/types/displaybox/demos/ShapeHoverControlsDemoTab.d.ts +3 -0
- package/dist/cjs/types/displaybox/demos/TextLayoutDemoTab.d.ts +3 -0
- package/dist/cjs/types/displaybox/demos/deletionEventsDemo.d.ts +2 -0
- package/dist/cjs/types/displaybox/demos/rotatedCreationDemo.d.ts +2 -0
- package/dist/cjs/types/displaybox/demos/roundedRectRadiusDemo.d.ts +2 -0
- package/dist/cjs/types/displaybox/demos/shapeBorderMovementDemo.d.ts +2 -0
- package/dist/cjs/types/displaybox/demos/shapeHoverControlsDemo.d.ts +10 -0
- package/dist/cjs/types/displaybox/demos/textDemo.d.ts +4 -0
- package/dist/cjs/types/displaybox/useDemoEditor.d.ts +5 -2
- package/dist/cjs/types/engine/AutoLayoutService.d.ts +24 -0
- package/dist/cjs/types/engine/DiagramEngine.d.ts +32 -14
- package/dist/cjs/types/engine/EngineCommands.d.ts +4 -1
- package/dist/cjs/types/engine/LinkRoutingService.d.ts +35 -0
- package/dist/cjs/types/engine/MutationPipeline.d.ts +23 -0
- package/dist/cjs/types/engine/TextLayoutService.d.ts +40 -0
- package/dist/cjs/types/examples/index.d.ts +2 -0
- package/dist/cjs/types/measure/textStyleDefaults.d.ts +9 -0
- package/dist/cjs/types/models/DiagramModel.d.ts +1 -0
- package/dist/cjs/types/models/ElementModel.d.ts +1 -0
- package/dist/cjs/types/models/PortModel.d.ts +3 -0
- package/dist/cjs/types/models/TextModel.d.ts +8 -0
- package/dist/cjs/types/renderer/RenderTypes.d.ts +34 -1
- package/dist/cjs/types/renderer/konva/KonvaHitTester.d.ts +1 -1
- package/dist/cjs/types/renderer/konva/KonvaInteraction.d.ts +53 -3
- package/dist/cjs/types/renderer/konva/KonvaNodeFactory.d.ts +18 -1
- package/dist/cjs/types/renderer/konva/KonvaRenderer.d.ts +49 -2
- package/dist/cjs/types/shapes/BuiltInShapes.d.ts +107 -0
- package/dist/cjs/types/shapes/__tests__/BuiltInShapes.test.d.ts +1 -0
- package/dist/cjs/types/shapes/index.d.ts +1 -0
- package/dist/cjs/types/utils/__tests__/borderGeometry.test.d.ts +1 -0
- package/dist/cjs/types/utils/borderGeometry.d.ts +6 -0
- package/dist/cjs/types/utils/geometry.d.ts +22 -0
- package/dist/esm/examples.js +11767 -0
- package/dist/esm/examples.js.map +1 -0
- package/dist/esm/index.js +3890 -1113
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/api/createDiagramEditor.d.ts +7 -2
- package/dist/esm/types/api/types.d.ts +178 -0
- package/dist/esm/types/displaybox/demos/DeletionEventsDemoTab.d.ts +3 -0
- package/dist/esm/types/displaybox/demos/ShapeHoverControlsDemoTab.d.ts +3 -0
- package/dist/esm/types/displaybox/demos/TextLayoutDemoTab.d.ts +3 -0
- package/dist/esm/types/displaybox/demos/deletionEventsDemo.d.ts +2 -0
- package/dist/esm/types/displaybox/demos/rotatedCreationDemo.d.ts +2 -0
- package/dist/esm/types/displaybox/demos/roundedRectRadiusDemo.d.ts +2 -0
- package/dist/esm/types/displaybox/demos/shapeBorderMovementDemo.d.ts +2 -0
- package/dist/esm/types/displaybox/demos/shapeHoverControlsDemo.d.ts +10 -0
- package/dist/esm/types/displaybox/demos/textDemo.d.ts +4 -0
- package/dist/esm/types/displaybox/useDemoEditor.d.ts +5 -2
- package/dist/esm/types/engine/AutoLayoutService.d.ts +24 -0
- package/dist/esm/types/engine/DiagramEngine.d.ts +32 -14
- package/dist/esm/types/engine/EngineCommands.d.ts +4 -1
- package/dist/esm/types/engine/LinkRoutingService.d.ts +35 -0
- package/dist/esm/types/engine/MutationPipeline.d.ts +23 -0
- package/dist/esm/types/engine/TextLayoutService.d.ts +40 -0
- package/dist/esm/types/examples/index.d.ts +2 -0
- package/dist/esm/types/measure/textStyleDefaults.d.ts +9 -0
- package/dist/esm/types/models/DiagramModel.d.ts +1 -0
- package/dist/esm/types/models/ElementModel.d.ts +1 -0
- package/dist/esm/types/models/PortModel.d.ts +3 -0
- package/dist/esm/types/models/TextModel.d.ts +8 -0
- package/dist/esm/types/renderer/RenderTypes.d.ts +34 -1
- package/dist/esm/types/renderer/konva/KonvaHitTester.d.ts +1 -1
- package/dist/esm/types/renderer/konva/KonvaInteraction.d.ts +53 -3
- package/dist/esm/types/renderer/konva/KonvaNodeFactory.d.ts +18 -1
- package/dist/esm/types/renderer/konva/KonvaRenderer.d.ts +49 -2
- package/dist/esm/types/shapes/BuiltInShapes.d.ts +107 -0
- package/dist/esm/types/shapes/__tests__/BuiltInShapes.test.d.ts +1 -0
- package/dist/esm/types/shapes/index.d.ts +1 -0
- package/dist/esm/types/utils/__tests__/borderGeometry.test.d.ts +1 -0
- package/dist/esm/types/utils/borderGeometry.d.ts +6 -0
- package/dist/esm/types/utils/geometry.d.ts +22 -0
- package/dist/examples.d.ts +532 -0
- package/dist/index.d.ts +233 -2
- package/docs/API_CONTRACT.md +59 -3
- package/docs/ARCHITECTURE.md +1 -0
- package/docs/CAPABILITIES.md +3 -1
- package/docs/COMMANDS_EVENTS.md +5 -0
- package/docs/DOCUMENTATION_WORKFLOW.md +6 -8
- package/docs/INTEGRATION_PLAYBOOK.md +2 -0
- package/docs/PORTING_CHECKLIST.md +1 -0
- package/docs/STATE_INVARIANTS.md +4 -0
- package/package.json +20 -10
- package/src/displaybox/demos/AutoLayoutDemoTab.tsx +501 -0
- package/src/displaybox/demos/DeletionEventsDemoTab.tsx +147 -0
- package/src/displaybox/demos/EngineEventsDemoTab.tsx +151 -0
- package/src/displaybox/demos/EventHandlersDemoTab.tsx +110 -0
- package/src/displaybox/demos/ExternalDragDropDemoTab.tsx +261 -0
- package/src/displaybox/demos/LinkCancelDemoTab.tsx +238 -0
- package/src/displaybox/demos/ObstacleRoutingDemoTab.tsx +30 -0
- package/src/displaybox/demos/ShapeHoverControlsDemoTab.tsx +558 -0
- package/src/displaybox/demos/SimpleDemo.tsx +73 -0
- package/src/displaybox/demos/SvgPathDemoTab.tsx +327 -0
- package/src/displaybox/demos/TextLayoutDemoTab.tsx +386 -0
- package/src/displaybox/demos/autoLayoutDemo.ts +111 -0
- package/src/displaybox/demos/basicDemo.ts +131 -0
- package/src/displaybox/demos/childConstraintsDemo.ts +65 -0
- package/src/displaybox/demos/customDemo.ts +59 -0
- package/src/displaybox/demos/deletionEventsDemo.ts +91 -0
- package/src/displaybox/demos/engineEventsDemo.ts +64 -0
- package/src/displaybox/demos/eventHandlersDemo.ts +41 -0
- package/src/displaybox/demos/externalDragDropDemo.ts +28 -0
- package/src/displaybox/demos/gridOverlayDemo.ts +50 -0
- package/src/displaybox/demos/index.tsx +217 -0
- package/src/displaybox/demos/linkBendHandlesDemo.ts +143 -0
- package/src/displaybox/demos/linkCancelDemo.ts +56 -0
- package/src/displaybox/demos/linkPortCreationDemo.ts +46 -0
- package/src/displaybox/demos/multiLevelTreeDemo.ts +120 -0
- package/src/displaybox/demos/multipleElementsDemo.ts +62 -0
- package/src/displaybox/demos/nestedDemo.ts +78 -0
- package/src/displaybox/demos/obstacleRoutingDemo.ts +176 -0
- package/src/displaybox/demos/portBorderDemo.ts +98 -0
- package/src/displaybox/demos/portConstraintsDemo.ts +175 -0
- package/src/displaybox/demos/rotatedCreationDemo.ts +185 -0
- package/src/displaybox/demos/roundedRectRadiusDemo.ts +93 -0
- package/src/displaybox/demos/routingDemo.ts +57 -0
- package/src/displaybox/demos/selectionDemo.ts +49 -0
- package/src/displaybox/demos/shapeBorderMovementDemo.ts +126 -0
- package/src/displaybox/demos/shapeGalleryDemo.ts +73 -0
- package/src/displaybox/demos/shapeHoverControlsDemo.ts +172 -0
- package/src/displaybox/demos/shared.ts +161 -0
- package/src/displaybox/demos/svgPathDemo.ts +71 -0
- package/src/displaybox/demos/textDemo.ts +62 -0
- package/src/displaybox/types.ts +66 -0
- package/src/examples/index.ts +21 -0
package/README.md
CHANGED
|
@@ -8,7 +8,7 @@ Diagram editor library with a Konva-backed editor (`createDiagramEditor`) and an
|
|
|
8
8
|
npm install orcasvn-react-diagrams
|
|
9
9
|
```
|
|
10
10
|
|
|
11
|
-
Node engine for this repository/toolchain: `>=
|
|
11
|
+
Node engine for this repository/toolchain: `>=20.17.0 <21.0.0`.
|
|
12
12
|
|
|
13
13
|
## Quick Start
|
|
14
14
|
|
|
@@ -30,6 +30,27 @@ editor.addElement({
|
|
|
30
30
|
});
|
|
31
31
|
```
|
|
32
32
|
|
|
33
|
+
## Release Highlights (v0.2.2)
|
|
34
|
+
|
|
35
|
+
- Includes all completed `v0.2.1` work plus `v0.2.2` additions in one release.
|
|
36
|
+
- Shape system upgrade:
|
|
37
|
+
- class-based built-in shape behaviors
|
|
38
|
+
- runtime removal of `boundaryKind` branching
|
|
39
|
+
- additive rotation (`baseRotation` + instance rotation style)
|
|
40
|
+
- Port movement enhancements:
|
|
41
|
+
- shape-aware border projection
|
|
42
|
+
- optional anchor-constrained movement (`portMovement.moveMode = 'anchors'`)
|
|
43
|
+
- orientation support with host-border normals and resize reprojection
|
|
44
|
+
- Shape hover controls:
|
|
45
|
+
- generic control definitions with `targetKind` (`edge`, `vertex`, `midpoint`, `ellipse-midpoint`)
|
|
46
|
+
- trigger modes (`element-hover`, `target-hover`)
|
|
47
|
+
- interaction callbacks for click and drag lifecycle
|
|
48
|
+
- Text layout improvements:
|
|
49
|
+
- owner/fixed bounds modes, wrap and overflow controls, and layout padding
|
|
50
|
+
- `textUpdated` lifecycle event with rendered display content
|
|
51
|
+
- Additional lifecycle events:
|
|
52
|
+
- `portDeleted`, `linkDeleted`, `textDeleted`
|
|
53
|
+
|
|
33
54
|
## API Docs
|
|
34
55
|
|
|
35
56
|
- Human-first docs index: `docs/INDEX.md`
|
package/ai/api-contract.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"schemaVersion": "1.
|
|
2
|
+
"schemaVersion": "1.2.0",
|
|
3
3
|
"typeSource": "src/api/types.ts",
|
|
4
4
|
"entrypoints": [
|
|
5
5
|
{
|
|
@@ -25,6 +25,9 @@
|
|
|
25
25
|
"elementShapes": "SimpleShape[]",
|
|
26
26
|
"portShapes": "SimpleShape[]",
|
|
27
27
|
"panKey": "'Control' | 'Shift' | 'Alt' | 'Meta'",
|
|
28
|
+
"elementShapeHoverControls": "ElementShapeHoverControls",
|
|
29
|
+
"onElementShapeHoverControlInteraction": "(event: ElementShapeHoverControlInteractionEvent) => void",
|
|
30
|
+
"onElementShapeHoverControlActivated": "(event: ElementShapeHoverControlActivationEvent) => void",
|
|
28
31
|
"onChange": "(event: EngineChangeEvent) => void",
|
|
29
32
|
"onSelection": "(event: EngineSelectionEvent) => void"
|
|
30
33
|
},
|
|
@@ -77,7 +80,8 @@
|
|
|
77
80
|
"parentId",
|
|
78
81
|
"moveMode",
|
|
79
82
|
"anchorCenter",
|
|
80
|
-
"layout"
|
|
83
|
+
"layout",
|
|
84
|
+
"portMovement"
|
|
81
85
|
],
|
|
82
86
|
"defaults": {
|
|
83
87
|
"portIds": [],
|
|
@@ -97,11 +101,14 @@
|
|
|
97
101
|
"style",
|
|
98
102
|
"textIds",
|
|
99
103
|
"moveMode",
|
|
100
|
-
"anchorCenter"
|
|
104
|
+
"anchorCenter",
|
|
105
|
+
"orientToHostBorder",
|
|
106
|
+
"currentAnchorId"
|
|
101
107
|
],
|
|
102
108
|
"defaults": {
|
|
103
109
|
"textIds": [],
|
|
104
|
-
"anchorCenter": true
|
|
110
|
+
"anchorCenter": true,
|
|
111
|
+
"orientToHostBorder": true
|
|
105
112
|
}
|
|
106
113
|
},
|
|
107
114
|
"linkData": {
|
|
@@ -130,7 +137,11 @@
|
|
|
130
137
|
"optional": [
|
|
131
138
|
"size",
|
|
132
139
|
"style",
|
|
133
|
-
"ownerId"
|
|
140
|
+
"ownerId",
|
|
141
|
+
"layout",
|
|
142
|
+
"displayContent",
|
|
143
|
+
"displayOffset",
|
|
144
|
+
"displayClipSize"
|
|
134
145
|
],
|
|
135
146
|
"defaults": {
|
|
136
147
|
"ownerId": null
|
|
@@ -142,6 +153,42 @@
|
|
|
142
153
|
"align": "center"
|
|
143
154
|
}
|
|
144
155
|
},
|
|
156
|
+
"additionalContracts": {
|
|
157
|
+
"portMovementPolicy": {
|
|
158
|
+
"moveMode": "'free' | 'inside' | 'border' | 'anchors'",
|
|
159
|
+
"anchorConstraint": "PortAnchorConstraint"
|
|
160
|
+
},
|
|
161
|
+
"portAnchorConstraint": {
|
|
162
|
+
"preset": "'vertices' | 'cardinal'",
|
|
163
|
+
"fallback": "'nearest'"
|
|
164
|
+
},
|
|
165
|
+
"textLayout": {
|
|
166
|
+
"boundsMode": "'owner-width' | 'owner-box' | 'fixed'",
|
|
167
|
+
"wrap": "'none' | 'word' | 'char'",
|
|
168
|
+
"overflow": "'clip' | 'ellipsis-end' | 'ellipsis-middle' | 'ellipsis-start'",
|
|
169
|
+
"padding": "number",
|
|
170
|
+
"maxLines": "number",
|
|
171
|
+
"fixedSize": "Size"
|
|
172
|
+
},
|
|
173
|
+
"shapeHoverControls": {
|
|
174
|
+
"targetKinds": [
|
|
175
|
+
"vertex",
|
|
176
|
+
"edge",
|
|
177
|
+
"midpoint",
|
|
178
|
+
"ellipse-midpoint"
|
|
179
|
+
],
|
|
180
|
+
"visibilityTriggers": [
|
|
181
|
+
"element-hover",
|
|
182
|
+
"target-hover"
|
|
183
|
+
],
|
|
184
|
+
"interactionEventTypes": [
|
|
185
|
+
"click",
|
|
186
|
+
"drag-start",
|
|
187
|
+
"drag-move",
|
|
188
|
+
"drag-end"
|
|
189
|
+
]
|
|
190
|
+
}
|
|
191
|
+
},
|
|
145
192
|
"handleMethods": {
|
|
146
193
|
"shared": [
|
|
147
194
|
"load",
|
|
@@ -177,6 +224,7 @@
|
|
|
177
224
|
],
|
|
178
225
|
"editorOnly": [
|
|
179
226
|
"resize",
|
|
227
|
+
"setElementShapeHoverControls",
|
|
180
228
|
"destroy"
|
|
181
229
|
]
|
|
182
230
|
},
|
|
@@ -196,6 +244,10 @@
|
|
|
196
244
|
"elementMoved": "ElementMovedEvent",
|
|
197
245
|
"elementResized": "ElementResizedEvent",
|
|
198
246
|
"elementDeleted": "ElementDeletedEvent",
|
|
247
|
+
"portDeleted": "PortDeletedEvent",
|
|
248
|
+
"linkDeleted": "LinkDeletedEvent",
|
|
249
|
+
"textDeleted": "TextDeletedEvent",
|
|
250
|
+
"textUpdated": "TextUpdatedEvent",
|
|
199
251
|
"elementSelected": "ElementSelectedEvent",
|
|
200
252
|
"elementLinkStarted": "ElementLinkStartedEvent",
|
|
201
253
|
"elementLinkConnecting": "ElementLinkConnectingEvent",
|
package/ai/invariants.json
CHANGED
|
@@ -7,6 +7,7 @@
|
|
|
7
7
|
],
|
|
8
8
|
"defaults": {
|
|
9
9
|
"port.anchorCenter": true,
|
|
10
|
+
"port.orientToHostBorder": true,
|
|
10
11
|
"link.routing": "auto"
|
|
11
12
|
},
|
|
12
13
|
"entityRules": {
|
|
@@ -16,7 +17,8 @@
|
|
|
16
17
|
],
|
|
17
18
|
"port": [
|
|
18
19
|
"port positions are relative to element",
|
|
19
|
-
"moving a port can be constrained by moveMode/moveAxis/moveBounds"
|
|
20
|
+
"moving a port can be constrained by moveMode/moveAxis/moveBounds",
|
|
21
|
+
"element portMovement policy can enforce anchor-constrained movement with discrete shape anchors"
|
|
20
22
|
],
|
|
21
23
|
"link": [
|
|
22
24
|
"manual routing preserves interior bend points on endpoint updates",
|
|
@@ -24,7 +26,8 @@
|
|
|
24
26
|
],
|
|
25
27
|
"text": [
|
|
26
28
|
"owner-bound text stores owner-relative position",
|
|
27
|
-
"orphan owner references are tolerated as standalone world text"
|
|
29
|
+
"orphan owner references are tolerated as standalone world text",
|
|
30
|
+
"displayContent/displayOffset/displayClipSize may be derived from text layout rules"
|
|
28
31
|
]
|
|
29
32
|
},
|
|
30
33
|
"eventRules": [
|
|
@@ -38,4 +41,3 @@
|
|
|
38
41
|
"src/renderer/konva/__tests__/KonvaInteraction.test.ts"
|
|
39
42
|
]
|
|
40
43
|
}
|
|
41
|
-
|
package/ai/manifest.json
CHANGED