@particle-academy/react-fancy 2.9.0 → 2.10.0

package/dist/index.d.cts

@@ -2333,7 +2333,13 @@ declare const Canvas: typeof CanvasRoot & {
 declare function useCanvas(): CanvasContextValue;
 
 type DiagramType = "erd" | "flowchart" | "general";
-type RelationType = "one-to-one" | "one-to-many" | "many-to-many";
+/** ERD/UML shorthand — sets fromMarker/toMarker (and lineStyle for some). */
+type RelationType = "one-to-one" | "one-to-many" | "many-to-one" | "many-to-many" | "association" | "aggregation" | "composition" | "inheritance" | "implementation" | "dependency" | "custom";
+/** Shape painted at each line endpoint. Strings prefixed `emoji:` render the
+ *  rest of the string as text at the endpoint (e.g. `emoji:🎯`). */
+type MarkerType = "none" | "arrow" | "arrow-open" | "circle" | "circle-open" | "square" | "square-open" | "diamond" | "diamond-open" | "triangle" | "triangle-open" | "one" | "many" | "optional-one" | "optional-many" | "cross" | (string & {});
+type LineStyle = "solid" | "dashed" | "dotted";
+type RoutingMode = "manhattan" | "bezier" | "straight";
 type ExportFormat = "erd" | "uml" | "dfd";
 interface DiagramFieldData {
     name: string;
@@ -2358,6 +2364,11 @@ interface DiagramRelationData {
     fromField?: string;
     toField?: string;
     type: RelationType;
+    fromMarker?: MarkerType;
+    toMarker?: MarkerType;
+    lineStyle?: LineStyle;
+    routing?: RoutingMode;
+    color?: string;
     label?: string;
 }
 interface DiagramSchema {
@@ -2413,7 +2424,20 @@ interface DiagramRelationProps {
     to: string;
     fromField?: string;
     toField?: string;
-    type: RelationType;
+    /** ERD/UML shorthand. Provides defaults for fromMarker/toMarker/lineStyle. */
+    type?: RelationType;
+    /** Override start endpoint marker. */
+    fromMarker?: MarkerType;
+    /** Override end endpoint marker. */
+    toMarker?: MarkerType;
+    /** Line style — solid (default), dashed, dotted. */
+    lineStyle?: LineStyle;
+    /** Routing algorithm — manhattan (default), bezier, straight. */
+    routing?: RoutingMode;
+    /** Stroke color. Defaults to a zinc gray. */
+    color?: string;
+    /** Stroke width. Default 2. */
+    strokeWidth?: number;
     label?: string;
     className?: string;
 }
@@ -2431,7 +2455,7 @@ declare namespace DiagramField {
     var displayName: string;
 }
 
-declare function DiagramRelation({ from, to, fromField: fromFieldProp, toField: toFieldProp, type, label, }: DiagramRelationProps): react_jsx_runtime.JSX.Element | null;
+declare function DiagramRelation({ from, to, fromField: fromFieldProp, toField: toFieldProp, type, fromMarker: fromMarkerProp, toMarker: toMarkerProp, lineStyle: lineStyleProp, routing, color, strokeWidth, label, }: DiagramRelationProps): react_jsx_runtime.JSX.Element | null;
 declare namespace DiagramRelation {
     var _isCanvasEdge: boolean;
     var displayName: string;

package/dist/index.d.ts

@@ -2333,7 +2333,13 @@ declare const Canvas: typeof CanvasRoot & {
 declare function useCanvas(): CanvasContextValue;
 
 type DiagramType = "erd" | "flowchart" | "general";
-type RelationType = "one-to-one" | "one-to-many" | "many-to-many";
+/** ERD/UML shorthand — sets fromMarker/toMarker (and lineStyle for some). */
+type RelationType = "one-to-one" | "one-to-many" | "many-to-one" | "many-to-many" | "association" | "aggregation" | "composition" | "inheritance" | "implementation" | "dependency" | "custom";
+/** Shape painted at each line endpoint. Strings prefixed `emoji:` render the
+ *  rest of the string as text at the endpoint (e.g. `emoji:🎯`). */
+type MarkerType = "none" | "arrow" | "arrow-open" | "circle" | "circle-open" | "square" | "square-open" | "diamond" | "diamond-open" | "triangle" | "triangle-open" | "one" | "many" | "optional-one" | "optional-many" | "cross" | (string & {});
+type LineStyle = "solid" | "dashed" | "dotted";
+type RoutingMode = "manhattan" | "bezier" | "straight";
 type ExportFormat = "erd" | "uml" | "dfd";
 interface DiagramFieldData {
     name: string;
@@ -2358,6 +2364,11 @@ interface DiagramRelationData {
     fromField?: string;
     toField?: string;
     type: RelationType;
+    fromMarker?: MarkerType;
+    toMarker?: MarkerType;
+    lineStyle?: LineStyle;
+    routing?: RoutingMode;
+    color?: string;
     label?: string;
 }
 interface DiagramSchema {
@@ -2413,7 +2424,20 @@ interface DiagramRelationProps {
     to: string;
     fromField?: string;
     toField?: string;
-    type: RelationType;
+    /** ERD/UML shorthand. Provides defaults for fromMarker/toMarker/lineStyle. */
+    type?: RelationType;
+    /** Override start endpoint marker. */
+    fromMarker?: MarkerType;
+    /** Override end endpoint marker. */
+    toMarker?: MarkerType;
+    /** Line style — solid (default), dashed, dotted. */
+    lineStyle?: LineStyle;
+    /** Routing algorithm — manhattan (default), bezier, straight. */
+    routing?: RoutingMode;
+    /** Stroke color. Defaults to a zinc gray. */
+    color?: string;
+    /** Stroke width. Default 2. */
+    strokeWidth?: number;
     label?: string;
     className?: string;
 }
@@ -2431,7 +2455,7 @@ declare namespace DiagramField {
     var displayName: string;
 }
 
-declare function DiagramRelation({ from, to, fromField: fromFieldProp, toField: toFieldProp, type, label, }: DiagramRelationProps): react_jsx_runtime.JSX.Element | null;
+declare function DiagramRelation({ from, to, fromField: fromFieldProp, toField: toFieldProp, type, fromMarker: fromMarkerProp, toMarker: toMarkerProp, lineStyle: lineStyleProp, routing, color, strokeWidth, label, }: DiagramRelationProps): react_jsx_runtime.JSX.Element | null;
 declare namespace DiagramRelation {
     var _isCanvasEdge: boolean;
     var displayName: string;