/** Angular2 */ import * as ng from "@angular/core"; /** Core */ import { CoreComponent } from "cmf.core/src/core"; /** Joint */ import "graphlib"; import "dagre"; /** Model */ import { GenericDiagramModel, GenericDiagramLink, GenericDiagramNode, GenericDiagramPoint, GenericDiagramNodeThumbnail } from "./genericDiagramModel"; export { GenericDiagramModel, GenericDiagramLink, GenericDiagramNode, GenericDiagramPoint }; /** * @whatItDoes * Diagram component * Used to represent a diagram that can be editable or not. StateModels, Protocols, flowcharts, datamodels, etc... * * @howToUse * This component is used with the inputs and outputs mentioned below. * Note that Diagram component grows to fill all available space defined by the parent. It does not have a default size. * * ### Inputs * `GenericDiagramModel` : **model** - The diagram data model * `boolean` : **orthogonalLinks** - if links are orthogonal * `boolean` : **interactive** - if diagram is interactive * `function` : **validateLink** - Callback to validate a link before create it * `function` : **retrieveNodeThumbnail** - Callback to retrieve a node thumbnail to be used to render the navigation map * * * ### Outputs * `GenericDiagramModel` : **modelChanged** - Triggered when the Diagram model change . * `GenericDiagramNode` : **nodeSelected** - On node selected * * * ### Example * To use the component, assume this HTML Template as an example: * * ```HTML * * * ``` * */ export declare class GenericDiagram extends CoreComponent implements ng.OnChanges, ng.AfterViewInit { private _elementRef; private _loader; private _ngZone; private _changeDetector; /** * Diagram holder div */ private _diagramHolder; /** * Diagram div element ref, used */ private _diagram; /** * Zoom and Pan directive */ private _zoomAndPan; /** * Diagram holder element query */ private _elementQuery; /** * Diagram Graph Paper */ private _paper; /** * Internal data model */ private _data; /** * Link current being grabbed */ private _grabbedLink; /** * MouseOperationMode */ private _mouseOperationMode; /** * Local mouse point */ private _localMousePoint; /** * Selected node */ private _selectedNode; /** * Highlighted node */ private _highlightedNode; /** * Debounced emit changes */ private debouncedEmitChanges; /** * Paper dimensions */ private paperWidth; private paperHeight; /** * ThumbnailGraph */ private thumbnailGraph; /** * Data model */ model: GenericDiagramModel; /** * if links are orthogonal */ orthogonalLinks: boolean; /** * if user can interact with diagram */ interactive: boolean; /** * Validate link callback */ validateLink: (newLinkId: string, source: any, target: any) => boolean; /** * Validate node removal */ validateRemoveNode: (node: GenericDiagramNode) => boolean; /** * Get thumbnail of node */ retrieveNodeThumbnail: (node: GenericDiagramNode) => GenericDiagramNodeThumbnail; /** * Data changed event */ modelChanged: ng.EventEmitter; /** * Node selected */ nodeSelected: ng.EventEmitter; /** * Constructor */ constructor(_elementRef: ng.ElementRef, _loader: ng.NgModuleFactoryLoader, _ngZone: ng.NgZone, _changeDetector: ng.ChangeDetectorRef); /** * Local mouse point change * @param point point */ localMousePointChange(point: any): void; /** * Get node under mouse */ private getNodeUnderMouse; /** * Highlight node */ private highlightNode; /** * On mouse move */ private onMouseMove; /** * On mouse up */ onMouseUp(event: any): void; /** * On mouse down on "new link" tool of any node */ private onNewLinkNodeToolMousedown; /** * On graph model changed */ private onModelChanged; /** * On element remove */ private onModelRemoveElement; /** * On element add */ private onModelAddElement; /** * Emit changes */ private emitChanges; /** * Get element of the data model by id */ private getDiagramElementById; /** * New Node */ private newNode; /** * New link */ private newLink; /** * Remove element from graph */ private removeElement; /** * On node select */ private onNodeSelect; /** * On node remove */ private onNodeRemove; /** * On node object updated */ private onNodeObjectUpdated; /** * Build diagram content using a data model */ private buildDiagramFromDataModel; /** * Get Marker SVG */ private getMarkerSVG; /** * Set Cell property value */ private setCellPropertyValue; /** * Get local mouse point coordinates */ getLocalMouseCoordinates(event: any): { x: number; y: number; }; /** * Update node inputs */ updateNodeInputs(node: GenericDiagramNode, inputs: any): void; /** * Get links connected to */ getLinksConnectedToByTag(nodeTag: string, linkToIgnoreId?: string): GenericDiagramLink[]; /** * Get links connected to */ getLinksConnectedTo(node: GenericDiagramNode, linkToIgnoreId?: string): GenericDiagramLink[]; /** * Get links connected from */ getLinksConnectedFromByTag(nodeTag: string, linkToIgnoreId?: string): GenericDiagramLink[]; /** * Get links connected from */ getLinksConnectedFrom(node: GenericDiagramNode, linkToIgnoreId?: string): GenericDiagramLink[]; /** * Add a new node to the diagram * @param node the new node definition * @returns the modified data model after the operation */ addNode(node: GenericDiagramNode): string; /** * Add a new link to the diagram * @param node the new link definition * @returns the modified data model after the operation */ addLink(link: GenericDiagramLink): string; /** * Removes a node from the diagram * @param id the id of the node to remove * @returns the modified data model after the operation */ removeNode(id: string): boolean; /** * Removes a link from the diagram * @param id the id of the link to remove * @returns the modified data model after the operation */ removeLink(id: string): boolean; /** * Zoom in */ zoomIn(): void; /** * Zoom out */ zoomOut(): void; /** * Fit to viewport */ fitToViewport(): void; /** * After view init */ ngAfterViewInit(): void; /** * On changes */ ngOnChanges(changes: any): void; } /** * Module declaration */ export declare class GenericDiagramModule { }