@next-bricks/diagram 0.19.0 → 0.20.0

package/dist/types.json

@@ -1,71 +1,4 @@
 {
-  "diagram.editable-label": {
-    "properties": [
-      {
-        "name": "label",
-        "annotation": {
-          "type": "keyword",
-          "value": "string"
-        }
-      },
-      {
-        "name": "type",
-        "annotation": {
-          "type": "reference",
-          "typeName": {
-            "type": "identifier",
-            "name": "LabelType"
-          }
-        }
-      }
-    ],
-    "events": [
-      {
-        "name": "label.editing.change",
-        "detail": {
-          "annotation": {
-            "type": "keyword",
-            "value": "boolean"
-          }
-        }
-      },
-      {
-        "name": "label.change",
-        "detail": {
-          "annotation": {
-            "type": "keyword",
-            "value": "string"
-          }
-        }
-      }
-    ],
-    "methods": [
-      {
-        "name": "enableEditing",
-        "params": [],
-        "returns": {}
-      }
-    ],
-    "types": [
-      {
-        "type": "typeAlias",
-        "name": "LabelType",
-        "annotation": {
-          "type": "union",
-          "types": [
-            {
-              "type": "jsLiteral",
-              "value": "line"
-            },
-            {
-              "type": "jsLiteral",
-              "value": "default"
-            }
-          ]
-        }
-      }
-    ]
-  },
   "diagram.experimental-node": {
     "properties": [
       {
@@ -227,6 +160,73 @@
       }
     ]
   },
+  "diagram.editable-label": {
+    "properties": [
+      {
+        "name": "label",
+        "annotation": {
+          "type": "keyword",
+          "value": "string"
+        }
+      },
+      {
+        "name": "type",
+        "annotation": {
+          "type": "reference",
+          "typeName": {
+            "type": "identifier",
+            "name": "LabelType"
+          }
+        }
+      }
+    ],
+    "events": [
+      {
+        "name": "label.editing.change",
+        "detail": {
+          "annotation": {
+            "type": "keyword",
+            "value": "boolean"
+          }
+        }
+      },
+      {
+        "name": "label.change",
+        "detail": {
+          "annotation": {
+            "type": "keyword",
+            "value": "string"
+          }
+        }
+      }
+    ],
+    "methods": [
+      {
+        "name": "enableEditing",
+        "params": [],
+        "returns": {}
+      }
+    ],
+    "types": [
+      {
+        "type": "typeAlias",
+        "name": "LabelType",
+        "annotation": {
+          "type": "union",
+          "types": [
+            {
+              "type": "jsLiteral",
+              "value": "line"
+            },
+            {
+              "type": "jsLiteral",
+              "value": "default"
+            }
+          ]
+        }
+      }
+    ]
+  },
   "eo-diagram": {
     "properties": [
       {
@@ -2083,6 +2083,37 @@
             }
           ]
         }
+      },
+      {
+        "name": "zoomable",
+        "annotation": {
+          "type": "keyword",
+          "value": "boolean"
+        }
+      },
+      {
+        "name": "scrollable",
+        "annotation": {
+          "type": "keyword",
+          "value": "boolean"
+        }
+      },
+      {
+        "name": "pannable",
+        "annotation": {
+          "type": "keyword",
+          "value": "boolean"
+        }
+      },
+      {
+        "name": "scaleRange",
+        "annotation": {
+          "type": "reference",
+          "typeName": {
+            "type": "identifier",
+            "name": "RangeTuple"
+          }
+        }
       }
     ],
     "events": [
@@ -2178,6 +2209,15 @@
             }
           }
         }
+      },
+      {
+        "name": "scale.change",
+        "detail": {
+          "annotation": {
+            "type": "keyword",
+            "value": "number"
+          }
+        }
       }
     ],
     "methods": [
@@ -3178,6 +3218,33 @@
           }
         ]
       },
+      {
+        "type": "typeAlias",
+        "name": "RangeTuple",
+        "annotation": {
+          "type": "tuple",
+          "elementTypes": [
+            {
+              "type": "namedTupleMember",
+              "label": "min",
+              "optional": false,
+              "elementType": {
+                "type": "keyword",
+                "value": "number"
+              }
+            },
+            {
+              "type": "namedTupleMember",
+              "label": "max",
+              "optional": false,
+              "elementType": {
+                "type": "keyword",
+                "value": "number"
+              }
+            }
+          ]
+        }
+      },
       {
         "type": "interface",
         "name": "MoveCellPayload",

package/dist-types/draw-canvas/CellComponent.d.ts

@@ -1,10 +1,12 @@
 /// <reference types="react" />
 import type { ActiveTarget, Cell, CellContextMenuDetail, NodeBrickConf } from "./interfaces";
 import type { MoveCellPayload, ResizeCellPayload } from "./reducers/interfaces";
+import type { TransformLiteral } from "../diagram/interfaces";
 export interface CellComponentProps {
     cell: Cell;
     cells: Cell[];
     defaultNodeBricks?: NodeBrickConf[];
+    transform: TransformLiteral;
     markerEnd: string;
     active: boolean;
     onCellMoving(info: MoveCellPayload): void;
@@ -14,4 +16,4 @@ export interface CellComponentProps {
     onSwitchActiveTarget(target: ActiveTarget | null): void;
     onCellContextMenu(detail: CellContextMenuDetail): void;
 }
-export declare function CellComponent({ cell, cells, defaultNodeBricks, markerEnd, active, onCellMoving, onCellMoved, onCellResizing, onCellResized, onSwitchActiveTarget, onCellContextMenu, }: CellComponentProps): JSX.Element | null;
+export declare function CellComponent({ cell, cells, defaultNodeBricks, markerEnd, active, transform, onCellMoving, onCellMoved, onCellResizing, onCellResized, onSwitchActiveTarget, onCellContextMenu, }: CellComponentProps): JSX.Element | null;

package/dist-types/draw-canvas/ConnectLineComponent.d.ts

@@ -1,9 +1,10 @@
 /// <reference types="react" />
 import type { ConnectLineState } from "./interfaces";
-import type { PositionTuple } from "../diagram/interfaces";
+import type { PositionTuple, TransformLiteral } from "../diagram/interfaces";
 export interface ConnectLineComponentProps {
     connectLineState: ConnectLineState | null;
+    transform: TransformLiteral;
     markerEnd: string;
     onConnect(state: ConnectLineState, to: PositionTuple): void;
 }
-export declare function ConnectLineComponent({ connectLineState, markerEnd, onConnect, }: ConnectLineComponentProps): JSX.Element;
+export declare function ConnectLineComponent({ connectLineState, transform, markerEnd, onConnect, }: ConnectLineComponentProps): JSX.Element;

package/dist-types/draw-canvas/decorators/DecoratorArea.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import type { BasicDecoratorProps } from "../interfaces";
-export declare function DecoratorArea({ cell, onCellResizing, onCellResized, onSwitchActiveTarget, }: BasicDecoratorProps): JSX.Element;
+export declare function DecoratorArea({ cell, transform, onCellResizing, onCellResized, onSwitchActiveTarget, }: BasicDecoratorProps): JSX.Element;

package/dist-types/draw-canvas/decorators/index.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import type { BasicDecoratorProps } from "../interfaces";
-export declare function DecoratorComponent({ cell, onCellResizing, onCellResized, onSwitchActiveTarget, }: BasicDecoratorProps): JSX.Element | null;
+export declare function DecoratorComponent({ cell, transform, onCellResizing, onCellResized, onSwitchActiveTarget, }: BasicDecoratorProps): JSX.Element | null;

package/dist-types/draw-canvas/index.d.ts

@@ -2,7 +2,7 @@ import React from "react";
 import { ReactNextElement } from "@next-core/react-element";
 import type { UseSingleBrickConf } from "@next-core/react-runtime";
 import "@next-core/theme";
-import type { PositionTuple, SizeTuple } from "../diagram/interfaces";
+import type { PositionTuple, RangeTuple, SizeTuple, TransformLiteral } from "../diagram/interfaces";
 import type { ActiveTarget, Cell, EdgeCell, InitialCell, NodeBrickConf, NodeCell, NodeId, DecoratorCell, DecoratorType, CellContextMenuDetail, ConnectNodesDetail } from "./interfaces";
 import type { MoveCellPayload, ResizeCellPayload } from "./reducers/interfaces";
 export interface EoDrawCanvasProps {
@@ -10,6 +10,10 @@ export interface EoDrawCanvasProps {
     defaultNodeSize?: SizeTuple;
     defaultNodeBricks?: NodeBrickConf[];
     activeTarget?: ActiveTarget | null;
+    zoomable?: boolean;
+    scrollable?: boolean;
+    pannable?: boolean;
+    scaleRange?: RangeTuple;
 }
 export interface DropNodeInfo extends AddNodeInfo {
     /** [PointerEvent::clientX, PointerEvent::clientY] */
@@ -46,6 +50,10 @@ export declare class EoDrawCanvas extends ReactNextElement implements EoDrawCanv
     accessor defaultNodeSize: SizeTuple | undefined;
     accessor defaultNodeBricks: NodeBrickConf[] | undefined;
     accessor activeTarget: ActiveTarget | null | undefined;
+    accessor zoomable: boolean | undefined;
+    accessor scrollable: boolean | undefined;
+    accessor pannable: boolean | undefined;
+    accessor scaleRange: RangeTuple | undefined;
     dropNode({ id, position, size, data, useBrick, }: DropNodeInfo): Promise<NodeCell | null>;
     dropDecorator({ position, decorator, }: DropDecoratorInfo): Promise<DecoratorCell | null>;
     addNodes(nodes: AddNodeInfo[]): Promise<NodeCell[]>;
@@ -63,6 +71,7 @@ export interface EoDrawCanvasComponentProps extends EoDrawCanvasProps {
     onCellResize(cell: ResizeCellPayload): void;
     onCellDelete(cell: Cell): void;
     onCellContextMenu(detail: CellContextMenuDetail): void;
+    onScaleChange(scale: number): void;
 }
 export interface DrawCanvasRef {
     dropNode(node: NodeCell): void;
@@ -71,4 +80,5 @@ export interface DrawCanvasRef {
     addEdge(edge: EdgeCell): void;
     manuallyConnectNodes(source: NodeId): Promise<ConnectNodesDetail>;
     updateCells(cells: InitialCell[]): void;
+    getTransform(): TransformLiteral;
 }

package/dist-types/draw-canvas/interfaces.d.ts

@@ -1,6 +1,6 @@
 import type { UseSingleBrickConf } from "@next-core/react-runtime";
 import type { ResizeCellPayload } from "./reducers/interfaces";
-import type { PositionTuple } from "../diagram/interfaces";
+import type { PositionTuple, TransformLiteral } from "../diagram/interfaces";
 export type Cell = NodeCell | EdgeCell | DecoratorCell;
 export type BrickCell = NodeBrickCell;
 export type NodeCell = NodeBrickCell;
@@ -69,6 +69,7 @@ export interface ActiveTargetOfDecorator {
 }
 export interface BasicDecoratorProps {
     cell: DecoratorCell;
+    transform: TransformLiteral;
     onCellResizing(info: ResizeCellPayload): void;
     onCellResized(info: ResizeCellPayload): void;
     onSwitchActiveTarget(activeTarget: ActiveTarget | null): void;

package/dist-types/draw-canvas/processors/handleMouseDown.d.ts

@@ -1,8 +1,9 @@
 import type { ActiveTarget, Cell } from "../interfaces";
 import type { MoveCellPayload, ResizeCellPayload } from "../reducers/interfaces";
-export declare function handleMouseDown(event: MouseEvent, { action, cell, onCellMoving, onCellMoved, onCellResizing, onCellResized, onSwitchActiveTarget, }: {
+export declare function handleMouseDown(event: MouseEvent, { action, cell, scale, onCellMoving, onCellMoved, onCellResizing, onCellResized, onSwitchActiveTarget, }: {
     action: "move" | "resize";
     cell: Cell;
+    scale: number;
     onCellMoving?(info: MoveCellPayload): void;
     onCellMoved?(info: MoveCellPayload): void;
     onCellResizing?(info: ResizeCellPayload): void;

package/dist-types/draw-canvas/processors/transformToCenter.d.ts

@@ -0,0 +1,8 @@
+import type { TransformLiteral } from "../../diagram/interfaces";
+import type { Cell } from "../interfaces";
+export interface TransformToCenterOptions {
+    canvasWidth: number;
+    canvasHeight: number;
+    scaleRange?: [min: number, max: number];
+}
+export declare function transformToCenter(cells: Cell[], { canvasWidth, canvasHeight, scaleRange }: TransformToCenterOptions): TransformLiteral;

package/dist-types/draw-canvas/processors/transformToCenter.spec.d.ts

@@ -0,0 +1 @@
+export {};