@particle-academy/react-fancy 2.9.0 → 2.10.0
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/dist/index.cjs +752 -104
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +27 -3
- package/dist/index.d.ts +27 -3
- package/dist/index.js +752 -104
- package/dist/index.js.map +1 -1
- package/docs/Diagram.md +34 -2
- package/package.json +1 -1
package/docs/Diagram.md
CHANGED
|
@@ -90,10 +90,42 @@ const schema = {
|
|
|
90
90
|
| to | `string` | - | Target entity id (required) |
|
|
91
91
|
| fromField | `string` | - | Source field name |
|
|
92
92
|
| toField | `string` | - | Target field name |
|
|
93
|
-
| type | `RelationType` | - |
|
|
94
|
-
|
|
|
93
|
+
| type | `RelationType` | - | Shorthand that sets `fromMarker` / `toMarker` / `lineStyle`. See **Relation types** below |
|
|
94
|
+
| fromMarker | `MarkerType` | depends on `type` | Marker shape at the source end |
|
|
95
|
+
| toMarker | `MarkerType` | depends on `type` | Marker shape at the target end |
|
|
96
|
+
| lineStyle | `'solid' \| 'dashed' \| 'dotted'` | from `type` | Line stroke style |
|
|
97
|
+
| routing | `'manhattan' \| 'bezier' \| 'straight'` | `'manhattan'` | Path routing algorithm |
|
|
98
|
+
| color | `string` | `'#71717a'` | Stroke color |
|
|
99
|
+
| strokeWidth | `number` | `2` | Stroke width |
|
|
100
|
+
| label | `string` | - | Edge label rendered at the path midpoint |
|
|
95
101
|
| className | `string` | - | Additional CSS classes |
|
|
96
102
|
|
|
103
|
+
### Relation types (`type` shorthand)
|
|
104
|
+
|
|
105
|
+
| Type | fromMarker | toMarker | lineStyle |
|
|
106
|
+
|------|-----------|----------|-----------|
|
|
107
|
+
| `one-to-one` | one | one | solid |
|
|
108
|
+
| `one-to-many` | one | many | solid |
|
|
109
|
+
| `many-to-one` | many | one | solid |
|
|
110
|
+
| `many-to-many` | many | many | solid |
|
|
111
|
+
| `association` | none | arrow | solid |
|
|
112
|
+
| `aggregation` | diamond-open | none | solid |
|
|
113
|
+
| `composition` | diamond | none | solid |
|
|
114
|
+
| `inheritance` | none | triangle-open | solid |
|
|
115
|
+
| `implementation` | none | triangle-open | dashed |
|
|
116
|
+
| `dependency` | none | arrow | dashed |
|
|
117
|
+
| `custom` | (caller's `fromMarker`) | (caller's `toMarker`) | solid |
|
|
118
|
+
|
|
119
|
+
### MarkerType
|
|
120
|
+
|
|
121
|
+
`'none'`, `'arrow'`, `'arrow-open'`, `'circle'`, `'circle-open'`, `'square'`, `'square-open'`, `'diamond'`, `'diamond-open'`, `'triangle'`, `'triangle-open'`, `'one'`, `'many'`, `'optional-one'`, `'optional-many'`, `'cross'`, or any string starting with `emoji:` (e.g. `'emoji:🎯'`) for an emoji/text marker.
|
|
122
|
+
|
|
123
|
+
### Routing
|
|
124
|
+
|
|
125
|
+
- **manhattan** (default) — right-angle elbows. Picks the side of each entity that faces the other, with a vertical (or horizontal) mid-line that automatically dodges entities lying along the path. Best for ERD/UML.
|
|
126
|
+
- **bezier** — smooth cubic curve with horizontal/vertical control points perpendicular to each side.
|
|
127
|
+
- **straight** — direct line between the two anchor points.
|
|
128
|
+
|
|
97
129
|
### Diagram.Toolbar
|
|
98
130
|
|
|
99
131
|
| Prop | Type | Default | Description |
|