orcasvn-react-diagrams 0.2.11 → 0.2.13

package/dist/cjs/types/api/createDiagramEditor.d.ts

@@ -1,4 +1,4 @@
-import { DiagramEngineHandle, Point, DiagramState, ElementShapeHoverControlActivationEvent, ElementShapeHoverControlInteractionEvent, ElementShapeHoverControls, EngineChangeEvent, EngineSelectionEvent, LinkColorPoolPolicy, LinkRouteRefreshPolicy, ViewportFitOptions } from './types';
+import { DiagramEngineHandle, Point, DiagramState, ElementShapeHoverControlActivationEvent, ElementShapeHoverControlInteractionEvent, ElementShapeHoverControls, EngineChangeEvent, EngineSelectionEvent, LinkTargetPortCreationHandler, LinkColorPoolPolicy, LinkRouteRefreshPolicy, FocusElementOptions, ViewportFitOptions } from './types';
 import { type BuiltInShapeKind } from '../shapes';
 export type SimpleShape = {
     id: string;
@@ -16,6 +16,7 @@ export type DiagramEditorConfig = {
     elementShapeHoverControls?: ElementShapeHoverControls;
     onElementShapeHoverControlInteraction?: (event: ElementShapeHoverControlInteractionEvent) => void;
     onElementShapeHoverControlActivated?: (event: ElementShapeHoverControlActivationEvent) => void;
+    onCreateLinkTargetPort?: LinkTargetPortCreationHandler;
     onChange?: (event: EngineChangeEvent) => void;
     onSelection?: (event: EngineSelectionEvent) => void;
     linkRouteRefreshPolicy?: LinkRouteRefreshPolicy;
@@ -40,6 +41,7 @@ export type DiagramEditorHandle = DiagramEngineHandle & {
     completeLinkToElement: (targetElementId: string, pointer: Point) => void;
     cancelLink: () => void;
     zoomToFitElements: (options?: ViewportFitOptions) => void;
+    focusElement: (elementId: string, options?: FocusElementOptions) => void;
     exportImage: (options?: DiagramImageExportOptions) => string;
     resize: (width: number, height: number) => void;
     setElementShapeHoverControls: (controls?: ElementShapeHoverControls) => void;

package/dist/cjs/types/api/types.d.ts

@@ -24,6 +24,9 @@ export type ViewportFitOptions = {
     minZoom?: number;
     maxZoom?: number;
 };
+export type FocusElementOptions = {
+    zoom?: number;
+};
 export type MoveConstraint = 'free' | 'inside' | 'border';
 export type TextInteractionPolicy = {
     movable?: boolean;
@@ -297,6 +300,20 @@ export type PortData = {
     rotationPivot?: Point;
     currentAnchorId?: string;
 };
+export type LinkTargetPortCreationPhase = 'preview' | 'commit';
+export type LinkTargetPortDraft = Omit<PortData, 'id' | 'elementId'>;
+export type LinkTargetPortCreationContext = {
+    phase: LinkTargetPortCreationPhase;
+    pointer: Point;
+    sourcePortId: string;
+    sourceElementId: string;
+    targetElementId: string;
+    sourcePort: PortData;
+    targetElement: ElementData;
+    defaultPort: LinkTargetPortDraft;
+};
+export type LinkTargetPortCreationResult = Partial<LinkTargetPortDraft> | void;
+export type LinkTargetPortCreationHandler = (context: LinkTargetPortCreationContext) => LinkTargetPortCreationResult;
 export type ShapeDrawContext = {
     ctx: CanvasRenderingContext2D;
     model: ElementData | PortData;
@@ -380,6 +397,11 @@ export type ElementPointerEvent = {
     pointer: EnginePointerInfo;
     isMulti: boolean;
 };
+export type ElementDoubleClickEvent = {
+    elementId: string;
+    pointer: EnginePointerInfo;
+    isMulti: boolean;
+};
 export type ElementMovedEvent = {
     elementId: string;
     oldWorld: Point;
@@ -404,18 +426,55 @@ export type GridLayoutChangedEvent = {
     beforeGridTemplate?: ElementLayoutGridRowTemplate[];
     afterGridTemplate: ElementLayoutGridRowTemplate[];
 };
+export type DeletionTrigger = 'direct' | 'selection' | 'cascade';
+export type DeletionRootRef = {
+    entity: 'element' | 'port' | 'link' | 'text';
+    id: string;
+};
+export type ElementDeletingEvent = {
+    elementId: string;
+    trigger: DeletionTrigger;
+    root: DeletionRootRef;
+    cancel: () => void;
+    cancelled: boolean;
+};
 export type ElementDeletedEvent = {
     elementId: string;
 };
+export type PortDeletingEvent = {
+    portId: string;
+    elementId: string;
+    trigger: DeletionTrigger;
+    root: DeletionRootRef;
+    cancel: () => void;
+    cancelled: boolean;
+};
 export type PortDeletedEvent = {
     portId: string;
     elementId: string;
 };
+export type LinkDeletingEvent = {
+    linkId: string;
+    sourcePortId: string;
+    targetPortId: string;
+    trigger: DeletionTrigger;
+    root: DeletionRootRef;
+    cancel: () => void;
+    cancelled: boolean;
+};
 export type LinkDeletedEvent = {
     linkId: string;
     sourcePortId: string;
     targetPortId: string;
 };
+export type TextDeletingEvent = {
+    textId: string;
+    ownerId?: string | null;
+    trigger: DeletionTrigger;
+    root: DeletionRootRef;
+    cancel: () => void;
+    cancelled: boolean;
+};
 export type TextDeletedEvent = {
     textId: string;
     ownerId?: string | null;
@@ -469,13 +528,18 @@ export type EngineEventMap = {
     portMoved: PortMovedEvent;
     portSelected: PortSelectedEvent;
     elementClick: ElementPointerEvent;
+    elementDoubleClick: ElementDoubleClickEvent;
     elementDragged: ElementDropEvent;
     elementMoved: ElementMovedEvent;
     elementResized: ElementResizedEvent;
     gridLayoutChanged: GridLayoutChangedEvent;
+    elementDeleting: ElementDeletingEvent;
     elementDeleted: ElementDeletedEvent;
+    portDeleting: PortDeletingEvent;
     portDeleted: PortDeletedEvent;
+    linkDeleting: LinkDeletingEvent;
     linkDeleted: LinkDeletedEvent;
+    textDeleting: TextDeletingEvent;
     textDeleted: TextDeletedEvent;
     textUpdated: TextUpdatedEvent;
     elementSelected: ElementSelectedEvent;

package/dist/cjs/types/displaybox/demos/LinkPortCreationDemoTab.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const LinkPortCreationDemo: () => React.JSX.Element;
+export default LinkPortCreationDemo;

package/dist/cjs/types/displaybox/demos/deletionEventsDemo.d.ts

@@ -1,2 +1,4 @@
+import type { DiagramState } from '../../api';
 import type { DemoConfig } from '../types';
+export declare const createDeletionEventsState: () => DiagramState;
 export declare const deletionEventsDemoConfig: DemoConfig;

package/dist/cjs/types/displaybox/demos/focusElementDemo.d.ts

@@ -0,0 +1,4 @@
+import type { DiagramState } from '../../api';
+import type { DemoConfig } from '../types';
+export declare const createFocusElementState: () => DiagramState;
+export declare const focusElementDemoConfig: DemoConfig;

package/dist/cjs/types/displaybox/demos/linkLabelsDemo.d.ts

@@ -0,0 +1,4 @@
+import type { DiagramState } from '../../api';
+import type { DemoConfig } from '../types';
+export declare const createLinkLabelsState: () => DiagramState;
+export declare const linkLabelsDemoConfig: DemoConfig;

package/dist/cjs/types/displaybox/types.d.ts

@@ -25,11 +25,14 @@ export type DemoConfig = {
     stageStyle?: CSSProperties;
     actions: DemoAction[];
 };
+export type DemoMenuGroup = 'basics' | 'layoutText' | 'shapes' | 'portsAnchors' | 'linksRouting' | 'eventsIntegration';
 export type DemoDefinition = {
     id: string;
     title: string;
     description: string;
     Component: React.ComponentType;
+    menuGroup: DemoMenuGroup;
+    menuOrder: number;
 };
 export type ToolboxItem = {
     id: string;

package/dist/cjs/types/displaybox/useDemoEditor.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { DiagramEditorHandle, DiagramState, ElementShapeHoverControlActivationEvent, ElementShapeHoverControlInteractionEvent, ElementShapeHoverControls, LinkColorPoolPolicy, LinkRouteRefreshPolicy, SimpleShape } from '../api';
+import type { DiagramEditorHandle, DiagramState, ElementShapeHoverControlActivationEvent, ElementShapeHoverControlInteractionEvent, ElementShapeHoverControls, LinkColorPoolPolicy, LinkTargetPortCreationHandler, LinkRouteRefreshPolicy, SimpleShape } from '../api';
 import type { RouterStrategy } from '../strategies/RouterStrategy';
 import type { ViewportSnapshot } from './types';
 type DemoEditorConfig = {
@@ -13,8 +13,9 @@ type DemoEditorConfig = {
     elementShapeHoverControls?: ElementShapeHoverControls;
     onElementShapeHoverControlInteraction?: (event: ElementShapeHoverControlInteractionEvent) => void;
     onElementShapeHoverControlActivated?: (event: ElementShapeHoverControlActivationEvent) => void;
+    onCreateLinkTargetPort?: LinkTargetPortCreationHandler;
 };
-declare const useDemoEditor: ({ createState, elementShapes, portShapes, router, snapDefault, linkRouteRefreshPolicy, linkColorPoolPolicy, elementShapeHoverControls, onElementShapeHoverControlInteraction, onElementShapeHoverControlActivated, }: DemoEditorConfig) => {
+declare const useDemoEditor: ({ createState, elementShapes, portShapes, router, snapDefault, linkRouteRefreshPolicy, linkColorPoolPolicy, elementShapeHoverControls, onElementShapeHoverControlInteraction, onElementShapeHoverControlActivated, onCreateLinkTargetPort, }: DemoEditorConfig) => {
     containerRef: import("react").MutableRefObject<HTMLDivElement | null>;
     editorRef: import("react").MutableRefObject<DiagramEditorHandle | null>;
     diagramState: DiagramState | null;

package/dist/cjs/types/engine/DiagramEngine.d.ts

@@ -1,4 +1,4 @@
-import { DiagramEngineHandle, DiagramState, ElementData, EngineEventMap, ElementDropEvent, EnginePointerInfo, LinkData, LinkColorPoolPolicy, ElementLinkConnectingEvent, LinkRoutingMode, LinkRouteRefreshPolicy, OverlayShapeConfig, OverlayShapeHandle, Point, PortData, RerouteLinksOptions, TextData, PortMouseEvent } from '../api/types';
+import { DiagramEngineHandle, DiagramState, ElementData, EngineEventMap, ElementDropEvent, EnginePointerInfo, LinkData, LinkColorPoolPolicy, ElementLinkConnectingEvent, LinkRoutingMode, LinkRouteRefreshPolicy, LinkTargetPortDraft, OverlayShapeConfig, OverlayShapeHandle, Point, PortData, RerouteLinksOptions, TextData, PortMouseEvent } from '../api/types';
 import { Renderer } from '../renderer/Renderer';
 import RenderScheduler from '../renderer/RenderScheduler';
 import { RouterStrategy } from '../strategies/RouterStrategy';
@@ -61,6 +61,7 @@ export default class DiagramEngine {
     setElementLayout(id: string, layout: ElementData['layout']): void;
     removeElement(id: string): void;
     addPortToElement(elementId: string, port: PortData): void;
+    normalizePortDraftForElement(elementId: string, draft: LinkTargetPortDraft): LinkTargetPortDraft | null;
     movePortTo(id: string, x: number, y: number): void;
     removePort(id: string): void;
     addLink(link: LinkData): void;
@@ -119,6 +120,7 @@ export default class DiagramEngine {
     emitPortMouseDown(event: PortMouseEvent): void;
     emitPortMouseUp(event: PortMouseEvent): void;
     emitElementClick(elementId: string, pointer: EnginePointerInfo, isMulti: boolean): void;
+    emitElementDoubleClick(elementId: string, pointer: EnginePointerInfo, isMulti: boolean): void;
     emitElementLinkStarted(event: {
         sourcePortId: string;
         sourceElementId: string;
@@ -171,6 +173,14 @@ export default class DiagramEngine {
     private refreshLinksForRenderCycle;
     private normalizePortsForHostPolicies;
     private computeRemovalDiff;
+    private resolveDeletionRoot;
+    private applyRemovalCommand;
+    private planRemoval;
+    private emitDeletionLifecycleEvents;
+    private emitElementDeleting;
+    private emitPortDeleting;
+    private emitLinkDeleting;
+    private emitTextDeleting;
     private emitEntityDeletionEvents;
 }
 export declare const createDiagramEngine: (config: DiagramEngineConfig) => DiagramEngineHandle;

package/dist/cjs/types/engine/TextLayoutService.d.ts

@@ -29,6 +29,7 @@ export default class TextLayoutService {
     private collectResizedElementIds;
     private shouldTrackOwnerBoundLayout;
     private resolveTextLayoutBounds;
+    private resolveDefaultBoundsMode;
     private wrapText;
     private wrapByWord;
     private wrapByChar;

package/dist/cjs/types/examples/index.d.ts

@@ -1,2 +1,2 @@
 export { demoTabs, baseElementShapes, basePortShapes, customGalleryShapes, defaultGhostSize, defaultSvgPath, defaultSvgPathSize, externalToolboxItems, } from '../displaybox/demos';
-export type { DemoAction, DemoActionHelpers, DemoConfig, DemoDefinition, ToolboxItem, DiagramCounts, ViewportSnapshot, DisplayBoxMetrics, } from '../displaybox/types';
+export type { DemoAction, DemoActionHelpers, DemoConfig, DemoDefinition, DemoMenuGroup, ToolboxItem, DiagramCounts, ViewportSnapshot, DisplayBoxMetrics, } from '../displaybox/types';

package/dist/cjs/types/renderer/konva/KonvaInteraction.d.ts

@@ -1,4 +1,4 @@
-import { ElementShapeHoverControlActivationEvent, ElementShapeHoverControlInteractionEvent, ElementShapeHoverControls, Point, PortData } from '../../api/types';
+import { ElementShapeHoverControlActivationEvent, ElementShapeHoverControlInteractionEvent, ElementShapeHoverControls, LinkTargetPortCreationHandler, Point, PortData } from '../../api/types';
 import DiagramEngine from '../../engine/DiagramEngine';
 import KonvaHitTester from './KonvaHitTester';
 import { KonvaStageLike, ShapeHoverControlRenderConfig } from './KonvaRenderer';
@@ -11,6 +11,7 @@ export type InteractionConfig = {
     shapeHoverControls?: ElementShapeHoverControls;
     onShapeHoverControlInteracted?: (event: ElementShapeHoverControlInteractionEvent) => void;
     onShapeHoverControlActivated?: (event: ElementShapeHoverControlActivationEvent) => void;
+    onCreateLinkTargetPort?: LinkTargetPortCreationHandler;
     renderer?: {
         renderResizeHandles: (elementId: string, position: Point, size: {
             width: number;
@@ -55,6 +56,7 @@ export default class KonvaInteraction {
     private shapeHoverControls?;
     private onShapeHoverControlInteracted?;
     private onShapeHoverControlActivated?;
+    private onCreateLinkTargetPort?;
     private linkDragContext;
     private programmaticLinkSession;
     private bound;
@@ -142,6 +144,13 @@ export default class KonvaInteraction {
     private tryCreateLinkToElement;
     private createPortForLink;
     private createPlaceholderPort;
+    private resolveLinkTargetPortDraft;
+    private buildDefaultLinkTargetPortDraft;
+    private mergeLinkTargetPortDraft;
+    private resolveLinkSourcePort;
+    private clonePortData;
+    private cloneLinkTargetPortDraft;
+    private cloneElementData;
     private getElementById;
     private getPortById;
     private getTextById;