UNPKG

@joint/core

Version:

JavaScript diagramming library

1,497 lines (1,031 loc) 156 kB
import { g } from './geometry'; import { Vectorizer } from './vectorizer'; export const version: string; export namespace config { var useCSSSelectors: boolean; var classNamePrefix: string; var defaultTheme: string; var doubleTapInterval: number; } type NativeEvent = Event; type _DeepRequired<T> = { [P in keyof T]-?: T[P] extends object ? _DeepRequired<T[P]> : T[P]; }; type _DeepPartial<T> = { [P in keyof T]?: T[P] extends object ? _DeepPartial<T[P]> : T[P]; }; type DeepPartial<T> = _DeepPartial<_DeepRequired<T>>; // We use `DOMElement` later in the code, to avoid conflicts with the `dia.Element` type. type DOMElement = Element; export namespace dia { type Event = mvc.TriggeredEvent; type ObjectHash = { [key: string]: any }; type Point = g.PlainPoint; type BBox = g.PlainRect; type Size = Pick<BBox, 'width' | 'height'>; type PaddingJSON = { left?: number; top?: number; right?: number; bottom?: number; }; type Padding = number | PaddingJSON; type SidesJSON = { left?: number; top?: number; right?: number; bottom?: number; horizontal?: number; vertical?: number; }; type LegacyPositionName = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'topMiddle' | 'bottomMiddle' | 'leftMiddle' | 'rightMiddle' | 'corner' | 'origin'; type PositionName = 'top' | 'left' | 'bottom' | 'right' | 'center' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | LegacyPositionName; type Sides = number | SidesJSON; type OrthogonalDirection = 'left' | 'top' | 'right' | 'bottom'; type DiagonalDirection = 'top-left' | 'top-right' | 'bottom-right' | 'bottom-left'; type Direction = OrthogonalDirection | DiagonalDirection; type LinkEnd = 'source' | 'target'; type MarkupNodeJSON = { tagName: string; selector?: string; groupSelector?: string | string[]; namespaceURI?: string; className?: string; attributes?: attributes.NativeSVGAttributes; style?: { [key: string]: any }; children?: MarkupJSON; textContent?: string; }; type MarkupJSON = Array<MarkupNodeJSON | string>; type Path = string | Array<string | number>; interface ModelSetOptions extends mvc.ModelSetOptions { dry?: boolean; isolate?: boolean; [key: string]: any; } interface CollectionAddOptions extends mvc.AddOptions { dry?: boolean; [key: string]: any; } interface SVGPatternJSON { id?: string; type: 'pattern'; attrs?: attributes.NativeSVGAttributes; markup: string | MarkupJSON; } interface SVGGradientJSON { id?: string; type: 'linearGradient' | 'radialGradient'; attrs?: attributes.NativeSVGAttributes; stops: Array<{ offset: number | string; color: string; opacity?: number; }>; } type SVGMarkerJSON = SVGComplexMarkerJSON | SVGSimpleMarkerJSON; interface SVGComplexMarkerJSON { id?: string; markup: string | MarkupJSON; attrs?: attributes.NativeSVGAttributes; } interface SVGSimpleMarkerJSON extends attributes.NativeSVGAttributes { id?: string; type?: string; /** * @deprecated use `attrs` instead */ markerUnits?: string; } type SVGFilterJSON = util.filter.FilterJSON<'outline'> | util.filter.FilterJSON<'highlight'> | util.filter.FilterJSON<'blur'> | util.filter.FilterJSON<'dropShadow'> | util.filter.FilterJSON<'grayscale'> | util.filter.FilterJSON<'sepia'> | util.filter.FilterJSON<'saturate'> | util.filter.FilterJSON<'hueRotate'> | util.filter.FilterJSON<'invert'> | util.filter.FilterJSON<'brightness'> | util.filter.FilterJSON<'contrast'>; export namespace Graph { interface Options { [key: string]: any; } interface ConnectionOptions extends Cell.EmbeddableOptions { inbound?: boolean; outbound?: boolean; } interface ExploreOptions extends ConnectionOptions { breadthFirst?: boolean; } interface FindAtPointOptions extends Options { strict?: boolean; } interface FindInAreaOptions extends Options { strict?: boolean; } type SearchByKey = 'bbox' | PositionName; interface FindUnderElementOptions extends FindInAreaOptions, FindAtPointOptions { searchBy?: SearchByKey; } class Cells extends mvc.Collection<Cell> { graph: Graph; cellNamespace: any; } interface Attributes { cells?: Cells; [key: string]: any; } } class Graph<A extends ObjectHash = Graph.Attributes, S = dia.ModelSetOptions> extends mvc.Model<A, S> { constructor(attributes?: Graph.Attributes, opt?: { cellNamespace?: any, cellModel?: typeof Cell }); addCell(cell: Cell.JSON | Cell, opt?: CollectionAddOptions): this; addCell(cell: Array<Cell | Cell.JSON>, opt?: CollectionAddOptions): this; addCells(cells: Array<Cell | Cell.JSON>, opt?: CollectionAddOptions): this; resetCells(cells: Array<Cell | Cell.JSON>, opt?: Graph.Options): this; getCell(id: Cell.ID | Cell): Cell; getElements(): Element[]; getLinks(): Link[]; getCells(): Cell[]; getFirstCell(): Cell | undefined; getLastCell(): Cell | undefined; getConnectedLinks(cell: Cell, opt?: Graph.ConnectionOptions): Link[]; disconnectLinks(cell: Cell, opt?: S): void; removeLinks(cell: Cell, opt?: Cell.DisconnectableOptions): void; translate(tx: number, ty?: number, opt?: Element.TranslateOptions): this; cloneCells(cells: Cell[]): { [id: string]: Cell }; getSubgraph(cells: Cell[], opt?: Cell.EmbeddableOptions): Cell[]; cloneSubgraph(cells: Cell[], opt?: Cell.EmbeddableOptions): { [id: string]: Cell }; dfs(element: Element, iteratee: (element: Element, distance: number) => boolean, opt?: Graph.ConnectionOptions): void; bfs(element: Element, iteratee: (element: Element, distance: number) => boolean, opt?: Graph.ConnectionOptions): void; search(element: Element, iteratee: (element: Element, distance: number) => boolean, opt?: Graph.ExploreOptions): void; getSuccessors(element: Element, opt?: Graph.ExploreOptions): Element[]; getPredecessors(element: Element, opt?: Graph.ExploreOptions): Element[]; isSuccessor(elementA: Element, elementB: Element): boolean; isPredecessor(elementA: Element, elementB: Element): boolean; isSource(element: Element): boolean; isSink(element: Element): boolean; getSources(): Element[]; getSinks(): Element[]; getNeighbors(element: Element, opt?: Graph.ConnectionOptions): Element[]; isNeighbor(elementA: Element, elementB: Element, opt?: Graph.ConnectionOptions): boolean; getCommonAncestor(...cells: Cell[]): Element | undefined; toJSON(opt?: { cellAttributes?: dia.Cell.ExportOptions }): any; fromJSON(json: any, opt?: S): this; clear(opt?: { [key: string]: any }): this; findElementsAtPoint(p: Point, opt?: Graph.FindAtPointOptions): Element[]; findElementsInArea(rect: BBox, opt?: Graph.FindInAreaOptions): Element[]; findElementsUnderElement(element: Element, opt?: Graph.FindUnderElementOptions): Element[]; findLinksAtPoint(p: Point, opt?: Graph.FindAtPointOptions): Link[]; findLinksInArea(rect: BBox, opt?: Graph.FindInAreaOptions): Link[]; findLinksUnderElement(element: Element, opt?: Graph.FindUnderElementOptions): Link[]; findCellsAtPoint(p: Point, opt?: Graph.FindAtPointOptions): Cell[]; findCellsInArea(rect: BBox, opt?: Graph.FindInAreaOptions): Cell[]; findCellsUnderElement(element: Element, opt?: Graph.FindUnderElementOptions): Cell[]; protected _getFindUnderElementGeometry(element: Element, searchBy: Graph.SearchByKey): g.Point | g.Rect; protected _validateCellsUnderElement<T extends Cell[]>(cells: T, element: Element): T; protected _isValidElementUnderElement(el1: Element, el2: Element): boolean; protected _isValidLinkUnderElement(link: Link, element: Element): boolean; protected _filterCellsUnderElement(cells: Cell[], element: Element, opt: Graph.FindUnderElementOptions): Cell[]; /** @deprecated use `findElementsAtPoint` instead */ findModelsFromPoint(p: Point): Element[]; /** @deprecated use `findElementsInArea` instead */ findModelsInArea(rect: BBox, opt?: Graph.FindInAreaOptions): Element[]; /** @deprecated use `findElementsUnderElement` instead */ findModelsUnderElement(element: Element, opt?: Graph.FindUnderElementOptions): Element[]; getBBox(): g.Rect | null; getCellsBBox(cells: Cell[], opt?: Cell.EmbeddableOptions): g.Rect | null; hasActiveBatch(name?: string | string[]): boolean; maxZIndex(): number; minZIndex(): number; removeCells(cells: Cell[], opt?: Cell.DisconnectableOptions): this; transferCellEmbeds(sourceCell: Cell, targetCell: Cell, opt?: S): void; transferCellConnectedLinks(sourceCell: Cell, targetCell: Cell, opt?: Graph.ConnectionOptions): void; resize(width: number, height: number, opt?: S): this; resizeCells(width: number, height: number, cells: Cell[], opt?: S): this; startBatch(name: string, data?: { [key: string]: any }): this; stopBatch(name: string, data?: { [key: string]: any }): this; } // dia.Cell export namespace Cell { type ID = string | number; interface GenericAttributes<T> { attrs?: T; z?: number; [key: string]: any; } interface Selectors { [selector: string]: attributes.SVGAttributes | undefined; } interface Attributes extends GenericAttributes<Selectors> { } type JSON<K extends Selectors = Selectors, T extends GenericAttributes<K> = GenericAttributes<K>> = T & { [attribute in keyof T]: T[attribute]; } & { id: ID; type: string; }; interface Constructor<T extends mvc.Model> { new(opt?: { id?: ID, [key: string]: any }): T; define(type: string, defaults?: any, protoProps?: any, staticProps?: any): dia.Cell.Constructor<T>; } interface Options { [key: string]: any; } interface EmbedOptions extends Options { reparent?: boolean; } interface EmbeddableOptions<T = boolean> extends Options { deep?: T; } interface DisconnectableOptions extends Options { disconnectLinks?: boolean; } interface GetEmbeddedCellsOptions extends EmbeddableOptions { breadthFirst?: boolean; sortSiblings?: boolean; } interface ToFrontAndBackOptions extends GetEmbeddedCellsOptions { foregroundEmbeds?: boolean; } interface TransitionOptions extends Options { delay?: number; duration?: number; timingFunction?: util.timing.TimingFunction; valueFunction?: util.interpolate.InterpolateFunction<any>; } interface ConstructorOptions extends Graph.Options { mergeArrays?: boolean; } interface ExportOptions { ignoreDefault?: boolean | string[]; ignoreEmptyAttributes?: boolean; } type UnsetCallback<V> = ( this: V, node: DOMElement, nodeAttributes: { [name: string]: any }, cellView: V ) => string | Array<string> | null | void; type SetCallback<V> = ( this: V, attributeValue: any, refBBox: g.Rect, node: DOMElement, nodeAttributes: { [name: string]: any }, cellView: V ) => { [key: string]: any } | string | number | void; type PositionCallback<V> = ( this: V, attributeValue: any, refBBox: g.Rect, node: DOMElement, nodeAttributes: { [name: string]: any }, cellView: V ) => dia.Point | null | void; type OffsetCallback<V> = ( this: V, attributeValue: any, nodeBBox: g.Rect, node: DOMElement, nodeAttributes: { [name: string]: any }, cellView: V ) => dia.Point | null | void; interface PresentationAttributeDefinition<V = dia.CellView> { set?: SetCallback<V> | string; unset?: UnsetCallback<V> | string | Array<string>; position?: PositionCallback<V>; offset?: OffsetCallback<V>; } } class Cell<A extends ObjectHash = Cell.Attributes, S extends mvc.ModelSetOptions = dia.ModelSetOptions> extends mvc.Model<A, S> { constructor(attributes?: DeepPartial<A>, opt?: Cell.ConstructorOptions); id: Cell.ID; graph: Graph; markup: string | MarkupJSON; useCSSSelectors: boolean; protected generateId(): string | number; protected stopPendingTransitions(path?: string, delim?: string): void; protected stopScheduledTransitions(path?: string, delim?: string): void; toJSON(opt?: dia.Cell.ExportOptions): Cell.JSON<any, A>; remove(opt?: Cell.DisconnectableOptions): this; toFront(opt?: Cell.ToFrontAndBackOptions): this; toBack(opt?: Cell.ToFrontAndBackOptions): this; parent(): string; getParentCell(): Cell | null; getAncestors(): Cell[]; getEmbeddedCells(opt?: Cell.GetEmbeddedCellsOptions): Cell[]; isEmbeddedIn(cell: Cell, opt?: Cell.EmbeddableOptions): boolean; isEmbedded(): boolean; prop(key: Path): any; prop(object: DeepPartial<A>, opt?: Cell.Options): this; prop(key: Path, value: any, opt?: Cell.Options): this; removeProp(path: Path, opt?: Cell.Options): this; attr(key?: Path): any; attr(object: Cell.Selectors, opt?: Cell.Options): this; attr(key: Path, value: any, opt?: Cell.Options): this; clone(): this; clone(opt: Cell.EmbeddableOptions<false>): this; clone(opt: Cell.EmbeddableOptions<true>): Cell[]; removeAttr(path: Path, opt?: Cell.Options): this; transition(path: string, value?: any, opt?: Cell.TransitionOptions, delim?: string): number; getTransitions(): string[]; stopTransitions(path?: string, delim?: string): this; embed(cell: Cell | Cell[], opt?: Cell.EmbedOptions): this; unembed(cell: Cell | Cell[], opt?: Graph.Options): this; canEmbed(cell: Cell | Cell[]): boolean; addTo(graph: Graph, opt?: Graph.Options): this; findView(paper: Paper): CellView; isLink(): this is Link; isElement(): this is Element; startBatch(name: string, opt?: Graph.Options): this; stopBatch(name: string, opt?: Graph.Options): this; position(): g.Point; z(): number; angle(): number; getBBox(): g.Rect; getPointFromConnectedLink(link: dia.Link, endType: dia.LinkEnd): g.Point; getPointRotatedAroundCenter(angle: number, x: number, y: number): g.Point; getPointRotatedAroundCenter(angle: number, point: dia.Point): g.Point; getRelativePointFromAbsolute(x: number, y: number): g.Point; getRelativePointFromAbsolute(absolutePoint: dia.Point): g.Point; getAbsolutePointFromRelative(x: number, y: number): g.Point; getAbsolutePointFromRelative(relativePoint: dia.Point): g.Point; getChangeFlag(attributes: { [key: string]: number }): number; static define(type: string, defaults?: any, protoProps?: any, staticProps?: any): Cell.Constructor<Cell>; /** * @deprecated */ protected processPorts(): void; } // dia.Element export namespace Element { interface GenericAttributes<T> extends Cell.GenericAttributes<T> { markup?: string | MarkupJSON; position?: Point; size?: Size; angle?: number; ports?: { groups?: { [key: string]: PortGroup }; items?: Port[]; }; } interface Attributes extends GenericAttributes<Cell.Selectors> { } type PortPositionCallback = (ports: Port[], bbox: g.Rect) => dia.Point[]; interface PortPositionJSON { name?: string; args?: { [key: string]: any }; } type PositionType = string | PortPositionCallback | PortPositionJSON; interface PortGroup { position?: PositionType; markup?: string | MarkupJSON; attrs?: Cell.Selectors; label?: { markup?: string | MarkupJSON; position?: PositionType; }; } interface Port { id?: string; markup?: string | MarkupJSON; group?: string; attrs?: Cell.Selectors; args?: { [key: string]: any }; label?: { markup?: string | MarkupJSON; position?: PositionType; }; z?: number | 'auto'; } interface PortPosition extends Point { angle: number; } interface TranslateOptions extends Cell.Options { restrictedArea?: BBox | Paper.PointConstraintCallback; transition?: Cell.TransitionOptions; } interface PositionOptions extends TranslateOptions { parentRelative?: boolean; deep?: boolean; } interface ResizeOptions extends Cell.Options { direction?: Direction; } interface BBoxOptions extends Cell.EmbeddableOptions { rotate?: boolean; } } class Element<A extends ObjectHash = Element.Attributes, S extends mvc.ModelSetOptions = dia.ModelSetOptions> extends Cell<A, S> { translate(tx: number, ty?: number, opt?: Element.TranslateOptions): this; position(opt?: Element.PositionOptions): g.Point; position(x: number, y: number, opt?: Element.PositionOptions): this; size(): Size; size(size: Partial<Size>, opt?: Element.ResizeOptions): this; size(width: number, height: number, opt?: Element.ResizeOptions): this; resize(width: number, height: number, opt?: Element.ResizeOptions): this; rotate(deg: number, absolute?: boolean, origin?: Point, opt?: { [key: string]: any }): this; angle(): number; scale(scaleX: number, scaleY: number, origin?: Point, opt?: { [key: string]: any }): this; fitEmbeds(opt?: { deep?: boolean, padding?: Padding, expandOnly?: boolean, shrinkOnly?: boolean }): this; fitToChildren(opt?: { deep?: boolean, padding?: Padding, expandOnly?: boolean, shrinkOnly?: boolean }): this; fitParent(opt?: { deep?: boolean, padding?: Padding, expandOnly?: boolean, shrinkOnly?: boolean, terminator?: Cell | Cell.ID }): this; getBBox(opt?: Element.BBoxOptions): g.Rect; addPort(port: Element.Port, opt?: S): this; addPorts(ports: Element.Port[], opt?: S): this; insertPort(before: number | string | Element.Port, port: Element.Port, opt?: S): this; removePort(port: string | Element.Port, opt?: S): this; removePorts(opt?: S): this; removePorts(ports: Array<Element.Port | string>, opt?: S): this; hasPorts(): boolean; hasPort(id: string): boolean; getPorts(): Element.Port[]; getGroupPorts(groupName: string): Element.Port[]; getPort(id: string): Element.Port; getPortsPositions(groupName: string): { [id: string]: Element.PortPosition }; getPortIndex(port: string | Element.Port): number; getPortGroupNames(): string[]; portProp(portId: string, path: dia.Path): any; portProp(portId: string, path: dia.Path, value?: any, opt?: S): Element; protected generatePortId(): string | number; static define(type: string, defaults?: any, protoProps?: any, staticProps?: any): Cell.Constructor<Element>; static attributes: { [attributeName: string]: Cell.PresentationAttributeDefinition<ElementView> }; } // dia.Link export namespace Link { interface EndCellArgs { magnet?: string; selector?: string; port?: string; anchor?: anchors.AnchorJSON; connectionPoint?: connectionPoints.ConnectionPointJSON; priority?: boolean; } interface EndJSON extends EndCellArgs { id?: Cell.ID; x?: number; y?: number; } interface GenericAttributes<T> extends Cell.GenericAttributes<T> { source?: EndJSON; target?: EndJSON; labels?: Label[]; vertices?: Point[]; router?: routers.Router | routers.RouterJSON; connector?: connectors.Connector | connectors.ConnectorJSON; } interface LinkSelectors extends Cell.Selectors { '.connection'?: attributes.SVGPathAttributes; '.connection-wrap'?: attributes.SVGPathAttributes; '.marker-source'?: attributes.SVGPathAttributes; '.marker-target'?: attributes.SVGPathAttributes; '.labels'?: attributes.SVGAttributes; '.marker-vertices'?: attributes.SVGAttributes; '.marker-arrowheads'?: attributes.SVGAttributes; '.link-tools'?: attributes.SVGAttributes; } interface Attributes extends Cell.GenericAttributes<LinkSelectors> { } interface LabelPosition { distance?: number; // optional for default labels offset?: number | { x: number, y: number }; angle?: number; args?: LinkView.LabelOptions; } interface Label { markup?: string | MarkupJSON; position?: LabelPosition | number; // optional for default labels attrs?: Cell.Selectors; size?: Size; } interface Vertex extends Point { [key: string]: any; } } class Link<A extends ObjectHash = Link.Attributes, S extends mvc.ModelSetOptions = dia.ModelSetOptions> extends Cell<A, S> { toolMarkup: string; doubleToolMarkup?: string; vertexMarkup: string; arrowHeadMarkup: string; defaultLabel?: Link.Label; // default label props /** * @deprecated use `defaultLabel.markup` instead */ labelMarkup?: string | MarkupJSON; // default label markup disconnect(): this; source(): Link.EndJSON; source(source: Link.EndJSON, opt?: S): this; source(source: Cell, args?: Link.EndCellArgs, opt?: S): this; target(): Link.EndJSON; target(target: Link.EndJSON, opt?: S): this; target(target: Cell, args?: Link.EndCellArgs, opt?: S): this; router(): routers.Router | routers.RouterJSON | null; router(router: routers.Router | routers.RouterJSON, opt?: S): this; router(name: routers.RouterType, args?: routers.RouterArguments, opt?: S): this; connector(): connectors.Connector | connectors.ConnectorJSON | null; connector(connector: connectors.Connector | connectors.ConnectorJSON, opt?: S): this; connector(name: connectors.ConnectorType, args?: connectors.ConnectorArguments, opt?: S): this; label(index?: number): Link.Label; label(index: number, label: Link.Label, opt?: S): this; labels(): Link.Label[]; labels(labels: Link.Label[], opt?: S): this; hasLabels(): boolean; insertLabel(index: number, label: Link.Label, opt?: S): Link.Label[]; appendLabel(label: Link.Label, opt?: S): Link.Label[]; removeLabel(index?: number, opt?: S): Link.Label[]; vertex(index?: number): Link.Vertex; vertex(index: number, vertex: Link.Vertex, opt?: S): this; vertices(): Link.Vertex[]; vertices(vertices: Link.Vertex[], opt?: S): this; insertVertex(index: number, vertex: Link.Vertex, opt?: S): Link.Vertex[]; removeVertex(index?: number, opt?: S): Link.Vertex[]; reparent(opt?: S): Element; getSourceElement(): null | Element; getTargetElement(): null | Element; getSourceCell(): null | Cell; getTargetCell(): null | Cell; getPolyline(): g.Polyline; getSourcePoint(): g.Point; getTargetPoint(): g.Point; getBBox(): g.Rect; hasLoop(opt?: Cell.EmbeddableOptions): boolean; getRelationshipAncestor(): undefined | Element; isRelationshipEmbeddedIn(cell: Cell): boolean; applyToPoints(fn: (p: Point) => Point, opt?: S): this; scale(sx: number, sy: number, origin?: Point, opt?: S): this; translate(tx: number, ty: number, opt?: S): this; static define(type: string, defaults?: any, protoProps?: any, staticProps?: any): Cell.Constructor<Link>; static attributes: { [attributeName: string]: Cell.PresentationAttributeDefinition<LinkView> }; } // dia.CellView export namespace CellView { enum Highlighting { DEFAULT = 'default', EMBEDDING = 'embedding', CONNECTING = 'connecting', MAGNET_AVAILABILITY = 'magnetAvailability', ELEMENT_AVAILABILITY = 'elementAvailability' } interface EventHighlightOptions { partial: boolean; type: Highlighting; [key: string]: any; } interface Options<T extends Cell> extends mvc.ViewOptions<T, SVGElement> { id?: string; } interface InteractivityOptions extends ElementView.InteractivityOptions, LinkView.InteractivityOptions { } type FlagLabel = string | string[]; type PresentationAttributes = { [key: string]: FlagLabel }; type NodeData = { [key: string]: any }; type NodeMetrics = { data: NodeData; boundingRect: g.Rect; magnetMatrix: SVGMatrix; geometryShape: g.Shape; }; } abstract class CellViewGeneric<T extends Cell> extends mvc.View<T, SVGElement> { constructor(opt?: CellView.Options<T>); paper: Paper | null; initFlag(): CellView.FlagLabel; presentationAttributes(): CellView.PresentationAttributes; highlight(el?: mvc.$SVGElement, opt?: { [key: string]: any }): this; unhighlight(el?: mvc.$SVGElement, opt?: { [key: string]: any }): this; can(feature: string): boolean; findMagnet(el: mvc.$SVGElement): SVGElement | undefined; findNode(selector: string): SVGElement | HTMLElement | null; findNodes(groupSelector: string): Array<SVGElement | HTMLElement>; findProxyNode(el: SVGElement | null, type: string): SVGElement; getSelector(el: SVGElement, prevSelector?: string): string; notify(eventName: string, ...eventArguments: any[]): void; addTools(tools: dia.ToolsView): this; hasTools(name?: string): boolean; removeTools(): this; showTools(): this; hideTools(): this; updateTools(opt?: { [key: string]: any }): this; mountTools(): this; unmountTools(): this; getNodeMatrix(node: SVGElement): SVGMatrix; getNodeRotateMatrix(node: SVGElement): SVGMatrix; getNodeBoundingRect(node: SVGElement): g.Rect; getBBox(opt?: { useModelGeometry?: boolean }): g.Rect; getNodeBBox(node: SVGElement): g.Rect; getNodeUnrotatedBBox(node: SVGElement): g.Rect; isNodeConnection(node: SVGElement): boolean; getEventTarget(evt: dia.Event, opt?: { fromPoint?: boolean }): DOMElement; checkMouseleave(evt: dia.Event): void; getFlag(label: CellView.FlagLabel): number; requestUpdate(flags: number, opt?: { [key: string]: any }): void; dragLinkStart(evt: dia.Event, magnet: SVGElement, x: number, y: number): void; dragLink(evt: dia.Event, x: number, y: number): void; dragLinkEnd(evt: dia.Event, x: number, y: number): void; preventDefaultInteraction(evt: dia.Event): void; isDefaultInteractionPrevented(evt: dia.Event): boolean; isIntersecting(geometryShape: g.Shape, geometryData?: g.SegmentSubdivisionsOpt | null): boolean; protected isEnclosedIn(area: g.Rect): boolean; protected isInArea(area: g.Rect, options: g.StrictOpt): boolean; protected isAtPoint(point: g.Point, options: g.StrictOpt): boolean; protected findBySelector(selector: string, root?: SVGElement): SVGElement[]; protected removeHighlighters(): void; protected updateHighlighters(): void; protected transformHighlighters(): void; protected hasFlag(flags: number, label: CellView.FlagLabel): boolean; protected removeFlag(flags: number, label: CellView.FlagLabel): number; protected setFlags(): void; protected onToolEvent(eventName: string): void; protected pointerdblclick(evt: dia.Event, x: number, y: number): void; protected pointerclick(evt: dia.Event, x: number, y: number): void; protected contextmenu(evt: dia.Event, x: number, y: number): void; protected pointerdown(evt: dia.Event, x: number, y: number): void; protected pointermove(evt: dia.Event, x: number, y: number): void; protected pointerup(evt: dia.Event, x: number, y: number): void; protected mouseover(evt: dia.Event): void; protected mouseout(evt: dia.Event): void; protected mouseenter(evt: dia.Event): void; protected mouseleave(evt: dia.Event): void; protected mousewheel(evt: dia.Event, x: number, y: number, delta: number): void; protected onevent(evt: dia.Event, eventName: string, x: number, y: number): void; protected onmagnet(evt: dia.Event, x: number, y: number): void; protected getLinkEnd(magnet: SVGElement, x: number, y: number, link: dia.Link, endType: dia.LinkEnd): dia.Link.EndJSON; protected getMagnetFromLinkEnd(end: dia.Link.EndJSON): SVGElement; protected customizeLinkEnd(end: dia.Link.EndJSON, magnet: SVGElement, x: number, y: number, link: dia.Link, endType: dia.LinkEnd): dia.Link.EndJSON; protected addLinkFromMagnet(magnet: SVGElement, x: number, y: number): LinkView; protected cleanNodesCache(): void; protected nodeCache(magnet: SVGElement): CellView.NodeMetrics; protected getNodeData(magnet: SVGElement): CellView.NodeData; protected getNodeShape(magnet: SVGElement): g.Shape; protected onMount(isInitialMount: boolean): void; protected onDetach(): void; static addPresentationAttributes(attributes: CellView.PresentationAttributes): CellView.PresentationAttributes; static evalAttribute(attrName: string, attrValue: any, refBBox: dia.BBox): any; } class CellView extends CellViewGeneric<Cell> { } // dia.ElementView export namespace ElementView { enum Flags { UPDATE = 'UPDATE', TRANSLATE = 'TRANSLATE', TOOLS = 'TOOLS', RESIZE = 'RESIZE', PORTS = 'PORTS', ROTATE = 'ROTATE', RENDER = 'RENDER' } interface InteractivityOptions { elementMove?: boolean; addLinkFromMagnet?: boolean; stopDelegation?: boolean; } } class ElementView<E extends Element = Element> extends CellViewGeneric<E> { update(element?: DOMElement, renderingOnlyAttrs?: { [key: string]: any }): void; setInteractivity(value: boolean | ElementView.InteractivityOptions): void; getDelegatedView(): ElementView | null; getTargetParentView(evt: dia.Event): CellView | null; findPortNode(portId: string | number): SVGElement | null; findPortNode(portId: string | number, selector: string): DOMElement | null; findPortNodes(portId: string | number, groupSelector: string): DOMElement[]; protected renderMarkup(): void; protected renderJSONMarkup(markup: MarkupJSON): void; protected renderStringMarkup(markup: string): void; protected updateTransformation(): void; protected resize(): void; protected translate(): void; protected rotate(): void; protected getTranslateString(): string; protected getRotateString(): string; protected dragStart(evt: dia.Event, x: number, y: number): void; protected dragMagnetStart(evt: dia.Event, x: number, y: number): void; protected drag(evt: dia.Event, x: number, y: number): void; protected dragMagnet(evt: dia.Event, x: number, y: number): void; protected dragEnd(evt: dia.Event, x: number, y: number): void; protected dragMagnetEnd(evt: dia.Event, x: number, y: number): void; protected snapToGrid(evt: dia.Event, x: number, y: number): dia.Point; protected prepareEmbedding(data: any): void; protected processEmbedding(data: any, evt: dia.Event, x: number, y: number): void; protected clearEmbedding(data: any): void; protected finalizeEmbedding(data: any): void; } // dia.LinkView export namespace LinkView { enum Flags { RENDER = 'RENDER', UPDATE = 'UPDATE', TOOLS = 'TOOLS', LEGACY_TOOLS = 'LEGACY_TOOLS', LABELS = 'LABELS', VERTICES = 'VERTICES', SOURCE = 'SOURCE', TARGET = 'TARGET', CONNECTOR = 'CONNECTOR' } interface InteractivityOptions { labelMove?: boolean; linkMove?: boolean; } interface LabelOptions extends Cell.Options { absoluteDistance?: boolean; reverseDistance?: boolean; absoluteOffset?: boolean; keepGradient?: boolean; ensureLegibility?: boolean; } interface VertexOptions extends Cell.Options { } interface Options<L extends Link = Link> extends mvc.ViewOptions<L, SVGElement> { labelsLayer?: Paper.Layers | string | false; } } class LinkView<L extends Link = Link> extends CellViewGeneric<L> { options: LinkView.Options<L>; sourceAnchor: g.Point; targetAnchor: g.Point; sourcePoint: g.Point; targetPoint: g.Point; sourceBBox: g.Rect; targetBBox: g.Rect; route: g.Point[]; sendToken(token: SVGElement, duration?: number, callback?: () => void): void; sendToken(token: SVGElement, opt?: { duration?: number, direction?: string, connection?: string }, callback?: () => void): void; addLabel(coordinates: Point, opt?: LinkView.LabelOptions): number; addLabel(coordinates: Point, angle: number, opt?: LinkView.LabelOptions): number; addLabel(x: number, y: number, opt?: LinkView.LabelOptions): number; addLabel(x: number, y: number, angle: number, opt?: LinkView.LabelOptions): number; addVertex(coordinates: Point, opt?: LinkView.VertexOptions): number; addVertex(x: number, y: number, opt?: LinkView.VertexOptions): number; getConnection(): g.Path; getSerializedConnection(): string; getConnectionSubdivisions(): g.Curve[][]; getConnectionLength(): number; getPointAtLength(length: number): g.Point; getPointAtRatio(ratio: number): g.Point; getTangentAtLength(length: number): g.Line; getTangentAtRatio(ratio: number): g.Line; getClosestPoint(point: Point): g.Point; getClosestPointLength(point: Point): number; getClosestPointRatio(point: Point): number; getLabelPosition(x: number, y: number, opt?: LinkView.LabelOptions): Link.LabelPosition; getLabelPosition(x: number, y: number, angle: number, opt?: LinkView.LabelOptions): Link.LabelPosition; getLabelCoordinates(labelPosition: Link.LabelPosition): g.Point; getVertexIndex(x: number, y: number): number; getVertexIndex(point: Point): number; update(): this; translate(tx: number, ty: number): void; requestConnectionUpdate(opt?: { [key: string]: any }): void; setInteractivity(value: boolean | LinkView.InteractivityOptions): void; getEndView(endType: dia.LinkEnd): dia.CellView | null; getEndAnchor(endType: dia.LinkEnd): g.Point; getEndConnectionPoint(endType: dia.LinkEnd): g.Point; getEndMagnet(endType: dia.LinkEnd): SVGElement | null; findLabelNode(labelIndex: string | number): SVGElement | null; findLabelNode(labelIndex: string | number, selector: string): DOMElement | null; findLabelNodes(labelIndex: string | number, groupSelector: string): DOMElement[]; removeRedundantLinearVertices(opt?: dia.ModelSetOptions): number; startArrowheadMove(end: dia.LinkEnd, options?: any): unknown; protected updateRoute(): void; protected updatePath(): void; protected updateDOM(): void; protected onLabelsChange(link: Link, labels: Link.Label[], opt: { [key: string]: any }): void; protected onToolsChange(link: Link, toolsMarkup: string, opt: { [key: string]: any }): void; protected onVerticesChange(link: Link, vertices: Point[], opt: { [key: string]: any }): void; protected onSourceChange(element: Element, sourceEnd: any, opt: { [key: string]: any }): void; protected onTargetChange(element: Element, targetEnd: any, opt: { [key: string]: any }): void; protected onlabel(evt: dia.Event, x: number, y: number): void; protected dragLabelStart(evt: dia.Event, x: number, y: number): void; protected dragArrowheadStart(evt: dia.Event, x: number, y: number): void; protected dragStart(evt: dia.Event, x: number, y: number): void; protected dragLabel(evt: dia.Event, x: number, y: number): void; protected dragArrowhead(evt: dia.Event, x: number, y: number): void; protected drag(evt: dia.Event, x: number, y: number): void; protected dragLabelEnd(evt: dia.Event, x: number, y: number): void; protected dragArrowheadEnd(evt: dia.Event, x: number, y: number): void; protected dragEnd(evt: dia.Event, x: number, y: number): void; protected findPath(route: Point[], sourcePoint: Point, targetPoint: Point): g.Path; protected notifyPointerdown(evt: dia.Event, x: number, y: number): void; protected notifyPointermove(evt: dia.Event, x: number, y: number): void; protected notifyPointerup(evt: dia.Event, x: number, y: number): void; protected mountLabels(): void; protected unmountLabels(): void; } // dia.Paper export namespace Paper { interface GradientOptions { id?: string; type: 'linearGradient' | 'radialGradient'; stops: Array<{ offset: string; color: string; opacity?: number; }>; } interface FilterOptions { [key: string]: any; } interface PatternOptions { [key: string]: any; } interface MarkerOptions { [key: string]: any; } interface GridOptions { color?: string; thickness?: number; name?: 'dot' | 'fixedDot' | 'mesh' | 'doubleMesh'; args?: Array<{ [key: string]: any }> | { [key: string]: any }; } interface BackgroundOptions { color?: string; image?: string; quality?: number; position?: Point | string; size?: Size | string; repeat?: string; opacity?: number; waterMarkAngle?: number; } type Dimension = number | string | null; enum sorting { EXACT = 'sorting-exact', APPROX = 'sorting-approximate', NONE = 'sorting-none' } enum Layers { CELLS = 'cells', LABELS = 'labels', BACK = 'back', FRONT = 'front', TOOLS = 'tools', GRID = 'grid', } type UpdateStats = { priority: number; updated: number; empty?: boolean; postponed?: number; unmounted?: number; mounted?: number; batches?: number; }; type ViewportCallback = (view: mvc.View<any, any>, isMounted: boolean, paper: Paper) => boolean; type ProgressCallback = (done: boolean, processed: number, total: number, stats: UpdateStats, paper: Paper) => void; type BeforeRenderCallback = (opt: { [key: string]: any }, paper: Paper) => void; type AfterRenderCallback = (stats: UpdateStats, opt: { [key: string]: any }, paper: Paper) => void; interface FreezeOptions { key?: string; } interface UnfreezeOptions { key?: string; mountBatchSize?: number; unmountBatchSize?: number; batchSize?: number; viewport?: ViewportCallback; progress?: ProgressCallback; beforeRender?: BeforeRenderCallback; afterRender?: AfterRenderCallback; } interface SnapLinksOptions { radius?: number; findInAreaOptions?: FindInAreaOptions; } type PointConstraintCallback = (x: number, y: number, opt: any) => Point; type RestrictTranslateCallback = (elementView: ElementView, x0: number, y0: number) => BBox | boolean | PointConstraintCallback; type FindParentByType = 'bbox' | 'pointer' | PositionName; type FindParentByCallback = ((this: dia.Graph, elementView: ElementView, evt: dia.Event, x: number, y: number) => Cell[]); interface Options extends mvc.ViewOptions<Graph> { // appearance width?: Dimension; height?: Dimension; drawGrid?: boolean | GridOptions | GridOptions[]; drawGridSize?: number | null; background?: BackgroundOptions; labelsLayer?: boolean | Paper.Layers | string; // interactions gridSize?: number; highlighting?: boolean | Record<string | dia.CellView.Highlighting, highlighters.HighlighterJSON | boolean>; interactive?: ((cellView: CellView, event: string) => boolean | CellView.InteractivityOptions) | boolean | CellView.InteractivityOptions; snapLabels?: boolean; snapLinks?: boolean | SnapLinksOptions; snapLinksSelf?: boolean | { distance: number }; markAvailable?: boolean; // validations validateMagnet?: (cellView: CellView, magnet: SVGElement, evt: dia.Event) => boolean; validateConnection?: (cellViewS: CellView, magnetS: SVGElement, cellViewT: CellView, magnetT: SVGElement, end: LinkEnd, linkView: LinkView) => boolean; restrictTranslate?: RestrictTranslateCallback | boolean | BBox; multiLinks?: boolean; linkPinning?: boolean; allowLink?: ((linkView: LinkView, paper: Paper) => boolean) | null; // events guard?: (evt: dia.Event, view: CellView) => boolean; preventContextMenu?: boolean; preventDefaultViewAction?: boolean; preventDefaultBlankAction?: boolean; clickThreshold?: number; moveThreshold?: number; magnetThreshold?: number | string; // views elementView?: typeof ElementView | ((element: Element) => typeof ElementView); linkView?: typeof LinkView | ((link: Link) => typeof LinkView); // embedding embeddingMode?: boolean; frontParentOnly?: boolean; findParentBy?: FindParentByType | FindParentByCallback; validateEmbedding?: (this: Paper, childView: ElementView, parentView: ElementView) => boolean; validateUnembedding?: (this: Paper, childView: ElementView) => boolean; // default views, models & attributes cellViewNamespace?: any; routerNamespace?: any; connectorNamespace?: any; highlighterNamespace?: any; anchorNamespace?: any; linkAnchorNamespace?: any; connectionPointNamespace?: any; defaultLink?: ((cellView: CellView, magnet: SVGElement) => Link) | Link; defaultRouter?: routers.Router | routers.RouterJSON; defaultConnector?: connectors.Connector | connectors.ConnectorJSON; defaultAnchor?: anchors.AnchorJSON | anchors.Anchor; defaultLinkAnchor?: anchors.AnchorJSON | anchors.Anchor; defaultConnectionPoint?: connectionPoints.ConnectionPointJSON | connectionPoints.ConnectionPoint | ((...args: any[]) => connectionPoints.ConnectionPoint); // connecting connectionStrategy?: connectionStrategies.ConnectionStrategy; // rendering async?: boolean; sorting?: sorting; frozen?: boolean; autoFreeze?: boolean; viewport?: ViewportCallback | null; onViewUpdate?: (view: mvc.View<any, any>, flag: number, priority: number, opt: { [key: string]: any }, paper: Paper) => void; onViewPostponed?: (view: mvc.View<any, any>, flag: number, paper: Paper) => boolean; beforeRender?: Paper.BeforeRenderCallback; afterRender?: Paper.AfterRenderCallback; overflow?: boolean; } interface TransformToFitContentOptions { padding?: Padding; preserveAspectRatio?: boolean; minScale?: number; minScaleX?: number; minScaleY?: number; maxScale?: number; maxScaleX?: number; maxScaleY?: number; scaleGrid?: number; useModelGeometry?: boolean; fittingBBox?: BBox; contentArea?: BBox; verticalAlign?: 'top' | 'middle' | 'bottom'; horizontalAlign?: 'left' | 'middle' | 'right'; } /** * @deprecated */ type ScaleContentOptions = TransformToFitContentOptions; interface FitToContentOptions { gridWidth?: number; gridHeight?: number; padding?: Padding; allowNewOrigin?: false | 'negative' | 'positive' | 'any'; allowNegativeBottomRight?: boolean; minWidth?: number; minHeight?: number; maxWidth?: number; maxHeight?: number; useModelGeometry?: boolean; contentArea?: BBox; } interface EventMap { // pointerclick 'cell:pointerclick': (cellView: dia.CellView, evt: dia.Event, x: number, y: number) => void; 'element:pointerclick': (elementView: dia.ElementView, evt: dia.Event, x: number, y: number) => void; 'link:pointerclick': (linkView: dia.LinkView, evt: dia.Event, x: number, y: number) => void; 'blank:pointerclick': (evt: dia.Event, x: number, y: number) => void; // pointerdblclick 'cell:pointerdblclick': (cellView: dia.CellView, evt: dia.Event, x: number, y: number) => void; 'element:pointerdblclick': (elementView: dia.ElementView, evt: dia.Event, x: number, y: number) => void; 'link:pointerdblclick': (linkView: dia.LinkView, evt: dia.Event, x: number, y: number) => void; 'blank:pointerdblclick': (evt: dia.Event, x: number, y: number) => void; // contextmenu 'cell:contextmenu': (cellView: dia.CellView, evt: dia.Event, x: number, y: number) => void; 'element:contextmenu': (elementView: dia.ElementView, evt: dia.Event, x: number, y: number) => void; 'link:contextmenu': (linkView: dia.LinkView, evt: dia.Event, x: number, y: number) => void; 'blank:contextmenu': (evt: dia.Event, x: number, y: number) => void; // pointerdown 'cell:pointerdown': (cellView: dia.CellView, evt: dia.Event, x: number, y: number) => void; 'element:pointerdown': (elementView: dia.ElementView, evt: dia.Event, x: number, y: number) => void; 'link:pointerdown': (linkView: dia.LinkView, evt: dia.Event, x: number, y: number) => void; 'blank:pointerdown': (evt: dia.Event, x: number, y: number) => void; // pointerdown 'cell:pointermove': (cellView: dia.CellView, evt: dia.Event, x: number, y: number) => void;