@memberjunction/ng-entity-relationship-diagram 5.30.1 → 5.32.0

package/dist/lib/components/erd-diagram.component.d.ts

@@ -1,488 +1,214 @@
-import { EventEmitter, ElementRef, AfterViewInit, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
-import { ERDNode, ERDLink, ERDConfig, ERDNodeClickEvent, ERDNodeDoubleClickEvent, ERDLinkClickEvent, ERDZoomEvent, ERDState, ERDNodeHoverEvent, ERDLinkHoverEvent, ERDNodeContextMenuEvent, ERDLinkContextMenuEvent, ERDDiagramContextMenuEvent, ERDNodeDragEvent, ERDRelationshipInfo } from '../interfaces/erd-types';
-import * as i0 from "@angular/core";
 /**
- * Entity Relationship Diagram component using D3.js force-directed graph.
- *
- * This is a **generic, reusable Angular component** that can visualize any data
- * that conforms to the `ERDNode` interface. It is completely decoupled from
- * MemberJunction-specific types and can be used in any Angular project.
- *
- * ## Features
- *
- * - **Interactive Force-Directed Layout**: Nodes automatically arrange themselves
- *   using physics-based simulation with customizable forces
- * - **Zoom and Pan**: Mouse wheel zoom and drag-to-pan with configurable limits
- * - **Node Selection**: Click to select nodes with visual highlighting
- * - **Focus Mode**: Show a single node with its N-hop related entities
- * - **Relationship Visualization**: Arrows show foreign key relationships
- * - **Customizable Styling**: Full control over colors, sizes, and appearance
- * - **Rich Event System**: Comprehensive events for integration with parent components
- * - **State Persistence**: Save and restore diagram state (zoom, pan, selection, positions)
- *
- * ## Basic Usage
- *
- * ```html
- * <mj-erd-diagram
- *   [nodes]="entityNodes"
- *   [selectedNodeId]="selectedId"
- *   [config]="erdConfig"
- *   (nodeClick)="onNodeClick($event)"
- *   (nodeSelected)="onNodeSelected($event)"
- *   (zoomChange)="onZoomChange($event)">
- * </mj-erd-diagram>
- * ```
- *
- * ## Focus Mode Example
- *
- * Show a single entity with its immediate relationships:
- *
- * ```html
- * <mj-erd-diagram
- *   [nodes]="allNodes"
- *   [focusNodeId]="'user-entity-id'"
- *   [focusDepth]="1"
- *   (nodeSelected)="onNodeSelected($event)">
- * </mj-erd-diagram>
- * ```
- *
- * ## State Persistence Example
+ * @module erd-diagram.component
+ * @description
+ * Schema-grouped Entity Relationship Diagram.  Each schema becomes a rounded
+ * rectangular band; entities tile in a grid within the band.  Click a node to
+ * enter focus mode (neighbours highlighted, everything else dimmed) and see a
+ * floating details card with its inbound and outbound FKs.
  *
- * ```typescript
- * // Save state
- * const state = this.erdDiagram.getState();
- * localStorage.setItem('erd-state', JSON.stringify(state));
+ * The component is pure Angular + SVG (no D3, no Dagre).  Layout is computed
+ * by a pure function in `../layout/compute-erd-layout.ts` that is easily
+ * unit-tested.
  *
- * // Restore state
- * const savedState = JSON.parse(localStorage.getItem('erd-state'));
- * this.erdDiagram.setState(savedState);
- * ```
- *
- * @see ERDNode for the node data structure
- * @see ERDConfig for configuration options
- * @see ERDState for state persistence
+ * Public API is preserved from the previous D3-based implementation so
+ * existing consumers (Database Designer wizard preview, admin ERD dashboard,
+ * Entity Record view) continue to work without changes.
  */
+import { EventEmitter, AfterViewInit, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
+import { ERDNode, ERDField, ERDLink, ERDConfig, ERDNodeClickEvent, ERDNodeDoubleClickEvent, ERDLinkClickEvent, ERDZoomEvent, ERDState, ERDNodeHoverEvent, ERDLinkHoverEvent, ERDNodeContextMenuEvent, ERDLinkContextMenuEvent, ERDDiagramContextMenuEvent, ERDNodeDragEvent } from '../interfaces/erd-types';
+import { type ErdLayout, type LaidOutNode, type LaidOutEdge, type LaidOutBand } from '../layout/compute-erd-layout';
+import * as i0 from "@angular/core";
+interface SchemaChip {
+    name: string;
+    count: number;
+    active: boolean;
+}
+/** 2D transform (pan x/y + zoom scale) for the SVG stage. */
+interface Transform {
+    x: number;
+    y: number;
+    k: number;
+}
 export declare class ERDDiagramComponent implements AfterViewInit, OnDestroy, OnChanges {
-    erdContainer: ElementRef;
-    /**
-     * The nodes (entities) to display in the diagram.
-     * Each node should conform to the `ERDNode` interface.
-     *
-     * @example
-     * ```typescript
-     * nodes: ERDNode[] = [
-     *   {
-     *     id: 'user-1',
-     *     name: 'Users',
-     *     fields: [
-     *       { id: 'id', name: 'ID', isPrimaryKey: true },
-     *       { id: 'email', name: 'Email', isPrimaryKey: false }
-     *     ]
-     *   }
-     * ];
-     * ```
-     */
+    private readonly cdr;
+    private readonly host;
     nodes: ERDNode[];
-    /**
-     * ID of the currently selected node.
-     * Use this for external control of selection state.
-     * The component will highlight this node and emit selection events accordingly.
-     *
-     * @example `[selectedNodeId]="'entity-123'"`
-     */
     selectedNodeId: string | null;
-    /**
-     * IDs of nodes to highlight (in addition to selected node).
-     * Highlighted nodes receive a distinct visual style (orange border by default).
-     * Useful for showing search results or related items.
-     *
-     * @example `[highlightedNodeIds]="['entity-1', 'entity-2']"`
-     */
     highlightedNodeIds: string[];
-    /**
-     * ID of the node to focus on.
-     * When set, the diagram will only show this node and its related nodes
-     * up to `focusDepth` hops away. This is useful for entity-centric views.
-     *
-     * Set to `null` to show all nodes.
-     *
-     * @example `[focusNodeId]="'user-entity-id'"`
-     */
     focusNodeId: string | null;
-    /**
-     * Number of relationship hops to include when in focus mode.
-     * - `0`: Show only the focus node
-     * - `1`: Show focus node + directly related nodes
-     * - `2`: Show focus node + nodes within 2 relationship hops
-     *
-     * Only applies when `focusNodeId` is set.
-     *
-     * @default 1
-     * @example `[focusDepth]="2"`
-     */
     focusDepth: number;
-    /**
-     * Whether the diagram is currently refreshing/loading.
-     * When `true`, displays a loading overlay on the diagram.
-     *
-     * @example `[isRefreshing]="isLoadingData"`
-     */
     isRefreshing: boolean;
-    /**
-     * Whether the diagram is in read-only mode.
-     * When `true`, disables dragging and selection (zoom/pan still work).
-     *
-     * @default false
-     */
     readOnly: boolean;
-    /**
-     * Configuration options for the diagram.
-     * All options are optional with sensible defaults.
-     *
-     * @see ERDConfig for all available options
-     * @example
-     * ```typescript
-     * config: ERDConfig = {
-     *   nodeWidth: 200,
-     *   chargeStrength: -1000,
-     *   colors: {
-     *     nodeHeader: '#0066cc'
-     *   }
-     * };
-     * ```
-     */
     config: ERDConfig;
-    /**
-     * Whether to show the header bar with zoom controls.
-     * Set to `false` to hide the header and use programmatic control instead.
-     *
-     * @default true
-     */
     showHeader: boolean;
-    /**
-     * Title to display in the header bar.
-     * Only visible when `showHeader` is `true`.
-     *
-     * @default 'Entity Relationship Diagram'
-     */
     headerTitle: string;
-    /**
-     * Emitted when a node is clicked.
-     * Set `event.cancel = true` to prevent the default selection behavior.
-     *
-     * @example
-     * ```typescript
-     * onNodeClick(event: ERDNodeClickEvent) {
-     *   console.log('Clicked:', event.node.name);
-     *   // Prevent selection for certain nodes
-     *   if (event.node.customData?.['locked']) {
-     *     event.cancel = true;
-     *   }
-     * }
-     * ```
-     */
     nodeClick: EventEmitter<ERDNodeClickEvent>;
-    /**
-     * Emitted when a node is double-clicked.
-     * Useful for opening detail views or triggering actions.
-     *
-     * @example
-     * ```typescript
-     * onNodeDoubleClick(event: ERDNodeDoubleClickEvent) {
-     *   this.openEntityDetail(event.node.id);
-     * }
-     * ```
-     */
     nodeDoubleClick: EventEmitter<ERDNodeDoubleClickEvent>;
-    /**
-     * Emitted when a node is selected (after click, unless cancelled).
-     * The node parameter contains the full `ERDNode` data.
-     */
     nodeSelected: EventEmitter<ERDNode>;
-    /**
-     * Emitted when the current node is deselected.
-     * This happens when clicking the background or selecting a different node.
-     */
     nodeDeselected: EventEmitter<void>;
-    /**
-     * Emitted when a relationship link is clicked.
-     * The event includes both source and target nodes for context.
-     */
     linkClick: EventEmitter<ERDLinkClickEvent>;
-    /**
-     * Emitted when the mouse enters a node.
-     * Includes related nodes and position for tooltip display.
-     *
-     * @example
-     * ```typescript
-     * onNodeHover(event: ERDNodeHoverEvent) {
-     *   this.showTooltip(event.node, event.position);
-     * }
-     * ```
-     */
     nodeHover: EventEmitter<ERDNodeHoverEvent>;
-    /**
-     * Emitted when the mouse leaves a node.
-     */
     nodeHoverEnd: EventEmitter<ERDNode>;
-    /**
-     * Emitted when the mouse enters a relationship link.
-     */
     linkHover: EventEmitter<ERDLinkHoverEvent>;
-    /**
-     * Emitted when the mouse leaves a relationship link.
-     */
     linkHoverEnd: EventEmitter<ERDLink>;
-    /**
-     * Emitted when a node is right-clicked.
-     * Set `event.cancel = true` to prevent the default browser context menu.
-     *
-     * @example
-     * ```typescript
-     * onNodeContextMenu(event: ERDNodeContextMenuEvent) {
-     *   event.cancel = true;
-     *   this.showContextMenu(event.node, event.position);
-     * }
-     * ```
-     */
     nodeContextMenu: EventEmitter<ERDNodeContextMenuEvent>;
-    /**
-     * Emitted when a relationship link is right-clicked.
-     */
     linkContextMenu: EventEmitter<ERDLinkContextMenuEvent>;
-    /**
-     * Emitted when the diagram background is right-clicked.
-     * Includes diagram coordinates for adding new nodes at click position.
-     */
     diagramContextMenu: EventEmitter<ERDDiagramContextMenuEvent>;
-    /**
-     * Emitted when a node drag operation starts.
-     * Set `event.cancel = true` to prevent the drag.
-     */
     nodeDragStart: EventEmitter<ERDNodeDragEvent>;
-    /**
-     * Emitted when a node drag operation ends.
-     */
     nodeDragEnd: EventEmitter<ERDNodeDragEvent>;
-    /**
-     * Emitted when zoom level or pan position changes.
-     * Useful for synchronizing zoom controls or saving view state.
-     */
     zoomChange: EventEmitter<ERDZoomEvent>;
-    /**
-     * Emitted when the diagram requests a refresh.
-     * Triggered by the refresh button in the header.
-     */
     refreshRequested: EventEmitter<void>;
-    /**
-     * Emitted when the force simulation completes initial layout.
-     * Useful for performing actions after nodes have settled.
-     */
     layoutComplete: EventEmitter<void>;
-    /**
-     * Emitted when diagram state changes (selection, zoom, highlights).
-     * Useful for auto-saving state or syncing with other components.
-     */
     stateChange: EventEmitter<ERDState>;
-    private svg;
-    private simulation;
-    private internalNodes;
-    private internalLinks;
-    private visibleNodes;
-    private visibleLinks;
-    private zoom;
+    private canvasRef?;
+    /** Current pan + zoom. */
+    transform: Transform;
+    /** Set of schema names the user has filtered IN.  Null means "all". */
+    activeSchemas: Set<string> | null;
+    /** Search query string. */
+    searchQuery: string;
+    /** Node IDs the user has clicked "+N more fields" on. */
+    expandedNodeIds: Set<string>;
+    /** Node currently being hovered (for highlight preview). */
+    hoverNodeId: string | null;
+    /** Cached layout — recomputed when nodes, filter, search or expansion changes. */
+    layout: ErdLayout;
+    /**
+     * Active layout algorithm.  Starts from `config.layoutAlgorithm` (default
+     * `schema-grid`) but can be toggled at runtime via `setLayoutAlgorithm`.
+     * Exposed so the chrome toggle + saved user state can drive it.
+     */
+    activeLayout: 'schema-grid' | 'dagre';
+    /** Derived schema summary for the chip row. */
+    schemaChips: SchemaChip[];
+    /** Derived — number of entities currently visible. */
+    visibleCount: number;
+    /** Derived — total entities in the input, before any filtering. */
+    totalCount: number;
+    /** Derived — the Set of IDs in the focus/hover neighbourhood (null when no highlight active). */
+    highlightSet: Set<string> | null;
+    /** Derived — the single selected entity, if any. */
+    selectedEntity: ERDNode | null;
+    panning: boolean;
+    private panStart;
+    /** Raw mousedown coords — used to compute drag distance for the
+     *  pan-vs-click threshold. */
+    private dragOrigin;
+    /** True once movement crossed the drag threshold — used to suppress
+     *  the synthetic click that follows the mouseup. */
+    private dragMoved;
+    /** Pixels of movement before mousedown is treated as a drag. */
+    private static readonly DRAG_THRESHOLD;
+    /** Bound window listeners — kept on the instance so we can detach. */
+    private boundWindowMove?;
+    private boundWindowUp?;
     private resizeObserver?;
-    private lastKnownSize;
-    private resizeTimeout?;
-    private mergedConfig;
-    private layoutCompleted;
-    private isLayoutFrozen;
-    ngAfterViewInit(): void;
+    readonly rootClass = true;
     ngOnChanges(changes: SimpleChanges): void;
+    /** True iff any config field that influences the cached layout changed. */
+    private configAffectsLayout;
+    ngAfterViewInit(): void;
     ngOnDestroy(): void;
-    /**
-     * Zoom in on the diagram by a fixed factor (1.2x).
-     * Uses smooth animation transition.
-     */
+    /** Rebuild the layout + derived view-model from current inputs/state. */
+    private recompute;
+    /**
+     * Switch between the schema-grid and dagre hierarchical layouts at
+     * runtime.  Emits a state change so the consumer can persist the
+     * user's preference (via `userStateChange` on `mj-erd-composite`).
+     *
+     * Also clears the current focus/selection — switching layouts moves
+     * cards to entirely new positions, so the previously-selected entity
+     * would otherwise stay highlighted in a different spot with the side
+     * panel still open, which is jarring.  A clean slate is better.
+     */
+    setLayoutAlgorithm(algo: 'schema-grid' | 'dagre'): void;
+    private buildSchemaChips;
+    private updateHighlightSet;
+    private updateSelectedEntity;
+    private watchResize;
+    /**
+     * Mousedown anywhere on the SVG (background OR a node card).  We
+     * arm a potential pan and attach window-level move/up listeners so
+     * the drag continues even if the cursor leaves the canvas (passes
+     * over the focus card, scrollbars, the chrome, etc.).
+     *
+     * The actual `panning = true` flip happens in the move handler once
+     * the cursor crosses `DRAG_THRESHOLD` — that way short clicks still
+     * register as clicks on cards (no accidental selection-toggle from
+     * a tiny mouse jitter).
+     */
+    onBackgroundMouseDown(e: MouseEvent): void;
+    private onWindowMouseMove;
+    private onWindowMouseUp;
+    onWheel(e: WheelEvent): void;
+    zoomBy(factor: number): void;
+    fitToView(): void;
+    private centerOn;
+    private emitZoom;
+    onNodeClick(node: LaidOutNode, e: MouseEvent): void;
+    onNodeMouseEnter(node: LaidOutNode, e: MouseEvent): void;
+    onNodeMouseLeave(node: LaidOutNode): void;
+    onToggleExpand(nodeId: string, e: Event): void;
+    onSearchChange(value: string): void;
+    onClearSearch(): void;
+    onSchemaChipToggle(schemaName: string): void;
+    onRequestRefresh(): void;
+    /** Path string for an edge — uses the orthogonal polyline from layout. */
+    edgePath(edge: LaidOutEdge): string;
+    /**
+     * Whether to render FK field labels along edges.  Defaults to ON in
+     * both layouts — the zoom-gate (>=0.55x) keeps the labels off when
+     * the user is zoomed out far enough to see hundreds of entities, so
+     * "noise on dense views" isn't a real concern.  Consumers can still
+     * force off via `config.showRelationshipLabels: false`.
+     */
+    get showEdgeLabels(): boolean;
+    /**
+     * Pick a point along the edge polyline for a label and approximate
+     * its width.  Returns null for self-loops (no good place to put text).
+     * Uses the longest horizontal segment when one exists; falls back to
+     * the segment midpoint otherwise.
+     */
+    edgeLabelPosition(edge: LaidOutEdge): {
+        x: number;
+        y: number;
+        w: number;
+    } | null;
+    /** Whether a node should appear dimmed (highlight mode active, node not in set). */
+    isDimmed(nodeId: string): boolean;
+    /** Whether a node is the current focus (strong border). */
+    isFocus(nodeId: string): boolean;
+    /** Whether a node is a 1-hop neighbour of the focus (medium border). */
+    isNeighbour(nodeId: string): boolean;
+    /** Whether an edge is part of the active highlight subgraph. */
+    isEdgeActive(edge: LaidOutEdge): boolean;
+    /** Whether an edge should appear dimmed. */
+    isEdgeDimmed(edge: LaidOutEdge): boolean;
+    /** Zoom percentage string for the toolbar readout. */
+    get zoomPercent(): string;
+    /** Short friendly row-count string (e.g. 1248 → "1.2k"). */
+    formatCount(n: number | undefined): string;
+    /** Number of PK fields — handy aggregate (kept for external API parity). */
+    pkCount(entity: ERDNode): number;
+    /** Number of FK fields — handy aggregate (kept for external API parity). */
+    fkCount(entity: ERDNode): number;
     zoomIn(): void;
-    /**
-     * Zoom out on the diagram by a fixed factor (0.83x).
-     * Uses smooth animation transition.
-     */
     zoomOut(): void;
-    /**
-     * Reset zoom to default level (1x) and center the diagram.
-     * Uses smooth animation transition.
-     */
     resetZoom(): void;
-    /**
-     * Zoom and pan to center on a specific node.
-     *
-     * @param nodeId - ID of the node to center on
-     * @param scale - Optional zoom scale (default: 1.5)
-     *
-     * @example
-     * ```typescript
-     * // Center on node with default zoom
-     * this.erdDiagram.zoomToNode('user-entity-id');
-     *
-     * // Center with custom zoom level
-     * this.erdDiagram.zoomToNode('user-entity-id', 2.0);
-     * ```
-     */
-    zoomToNode(nodeId: string, scale?: number): void;
-    /**
-     * Fit all visible nodes within the viewport.
-     * Calculates optimal zoom level and position to show all nodes.
-     *
-     * @param padding - Padding around nodes (default: 50px)
-     */
-    zoomToFit(padding?: number): void;
-    /**
-     * Programmatically select a node by ID.
-     *
-     * @param nodeId - ID of the node to select
-     * @returns `true` if node was found and selected, `false` otherwise
-     */
-    selectNode(nodeId: string): boolean;
-    /**
-     * Clear all selections.
-     */
-    deselectAll(): void;
-    /**
-     * Highlight a specific node.
-     *
-     * @param nodeId - ID of the node to highlight
-     */
-    highlightNode(nodeId: string): void;
-    /**
-     * Clear all highlights.
-     */
-    clearHighlights(): void;
-    /**
-     * Highlight a node and all its directly related nodes.
-     *
-     * @param nodeId - ID of the center node
-     * @param depth - Number of relationship hops to highlight (default: 1)
-     */
-    highlightRelated(nodeId: string, depth?: number): void;
-    /**
-     * Get nodes that are related to a specific node.
-     *
-     * @param nodeId - ID of the node to find relationships for
-     * @param depth - Number of relationship hops (default: 1)
-     * @returns Array of relationship information
-     */
-    getRelatedNodes(nodeId: string, depth?: number): ERDRelationshipInfo[];
-    /**
-     * Get the current state of the diagram for persistence.
-     * Includes selection, highlights, zoom, pan, and node positions.
-     *
-     * @returns Current diagram state
-     *
-     * @example
-     * ```typescript
-     * // Save to localStorage
-     * const state = erdDiagram.getState();
-     * localStorage.setItem('erd-state', JSON.stringify(state));
-     * ```
-     */
-    getState(): ERDState;
-    /**
-     * Restore a previously saved diagram state.
-     *
-     * @param state - State object from `getState()`
-     * @param restorePositions - Whether to restore node positions (default: true)
-     *
-     * @example
-     * ```typescript
-     * // Restore from localStorage
-     * const savedState = JSON.parse(localStorage.getItem('erd-state'));
-     * if (savedState) {
-     *   erdDiagram.setState(savedState);
-     * }
-     * ```
-     */
-    setState(state: Partial<ERDState>, restorePositions?: boolean): void;
-    /**
-     * Freeze the layout simulation.
-     * Nodes will stay in their current positions and won't move.
-     */
-    freezeLayout(): void;
-    /**
-     * Unfreeze the layout simulation.
-     * Nodes will resume natural movement based on forces.
-     */
-    unfreezeLayout(): void;
-    /**
-     * Center the diagram without changing zoom level.
-     */
-    centerDiagram(): void;
-    /**
-     * Rebuild the entire ERD visualization.
-     */
-    refresh(): void;
-    /**
-     * Trigger a resize recalculation.
-     * Call this when the container size changes.
-     */
+    zoomToFit(_padding?: number): void;
+    zoomToNode(nodeId: string, _scale?: number): void;
     triggerResize(): void;
-    /**
-     * Get current zoom state.
-     *
-     * @returns Current zoom level and translation
-     */
-    getZoomState(): ERDZoomEvent;
-    /**
-     * Export the diagram as an SVG string.
-     *
-     * @returns SVG markup string
-     */
+    refresh(): void;
+    getState(): ERDState;
+    setState(state: Partial<ERDState>, _restorePositions?: boolean): void;
     exportAsSVG(): string;
-    private setupERD;
-    private mergeConfig;
-    private resizeSVG;
-    private setupResizeObserver;
-    private clearVisualization;
-    private applyFocusMode;
-    private getRelatedNodeIds;
-    private createInternalNodes;
-    private createInternalLinks;
-    /**
-     * Applies dagre hierarchical layout to position nodes and compute edge paths.
-     * This provides clean, orthogonal edge routing.
-     */
-    private applyDagreLayout;
-    /**
-     * Checks if the current layout algorithm uses dagre.
-     */
-    private usesDagreLayout;
-    private createVisualization;
-    private renderNodeFields;
-    /** Truncate an SVG text element to fit within maxWidth, adding "…" if needed */
-    private truncateTextElement;
-    private attachNodeEventHandlers;
-    private attachLinkEventHandlers;
-    private updatePositions;
-    private getSourceConnectionPoint;
-    private getTargetConnectionPoint;
-    private createOrthogonalPath;
-    /**
-     * Creates an SVG path string from dagre's edge points.
-     * Dagre provides an array of points for each edge that forms a clean orthogonal path.
-     * @param points Array of {x, y} coordinates from dagre layout
-     * @returns SVG path string
-     */
-    private createPathFromDagrePoints;
-    private screenToDiagramCoords;
-    private clearAllHighlighting;
-    private updateSelectionHighlighting;
-    private updateHighlighting;
-    private emitStateChange;
-    private dragstarted;
-    private dragged;
-    private dragended;
+    trackByBand: (_: number, b: LaidOutBand) => string;
+    trackByEdge: (_: number, e: LaidOutEdge) => string;
+    trackByNode: (_: number, n: LaidOutNode) => string;
+    trackByField: (_: number, f: ERDField) => string;
+    trackByChip: (_: number, c: SchemaChip) => string;
     static ɵfac: i0.ɵɵFactoryDeclaration<ERDDiagramComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ERDDiagramComponent, "mj-erd-diagram", never, { "nodes": { "alias": "nodes"; "required": false; }; "selectedNodeId": { "alias": "selectedNodeId"; "required": false; }; "highlightedNodeIds": { "alias": "highlightedNodeIds"; "required": false; }; "focusNodeId": { "alias": "focusNodeId"; "required": false; }; "focusDepth": { "alias": "focusDepth"; "required": false; }; "isRefreshing": { "alias": "isRefreshing"; "required": false; }; "readOnly": { "alias": "readOnly"; "required": false; }; "config": { "alias": "config"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "headerTitle": { "alias": "headerTitle"; "required": false; }; }, { "nodeClick": "nodeClick"; "nodeDoubleClick": "nodeDoubleClick"; "nodeSelected": "nodeSelected"; "nodeDeselected": "nodeDeselected"; "linkClick": "linkClick"; "nodeHover": "nodeHover"; "nodeHoverEnd": "nodeHoverEnd"; "linkHover": "linkHover"; "linkHoverEnd": "linkHoverEnd"; "nodeContextMenu": "nodeContextMenu"; "linkContextMenu": "linkContextMenu"; "diagramContextMenu": "diagramContextMenu"; "nodeDragStart": "nodeDragStart"; "nodeDragEnd": "nodeDragEnd"; "zoomChange": "zoomChange"; "refreshRequested": "refreshRequested"; "layoutComplete": "layoutComplete"; "stateChange": "stateChange"; }, never, never, false, never>;
 }
+export {};
 //# sourceMappingURL=erd-diagram.component.d.ts.map