@memberjunction/ng-entity-relationship-diagram 0.0.1 → 2.130.0

package/dist/lib/components/mj-entity-erd.component.js

@@ -0,0 +1,416 @@
+import { Component, Input, Output, EventEmitter, ViewChild, ChangeDetectionStrategy } from '@angular/core';
+import { Metadata } from '@memberjunction/core';
+import { ERDDiagramComponent } from './erd-diagram.component';
+import { buildERDDataFromEntities, getOriginalEntityFromERDNode } from '../utils/entity-to-erd-adapter';
+import * as i0 from "@angular/core";
+import * as i1 from "./erd-diagram.component";
+/**
+ * Higher-level MemberJunction Entity ERD component that provides a simplified API
+ * for displaying entity relationship diagrams using EntityInfo objects.
+ *
+ * This component wraps the generic `ERDDiagramComponent` and handles the transformation
+ * of MemberJunction EntityInfo objects to the generic ERD format automatically.
+ *
+ * ## Key Features
+ *
+ * - **Simple Input**: Just pass `EntityInfo[]` - no manual transformation needed
+ * - **Auto-Discovery**: Automatically discovers and displays relationships
+ * - **Configurable Depth**: Control how many relationship hops to include
+ * - **State Control**: Parent controls selection/state - component doesn't persist
+ *
+ * ## Usage Modes
+ *
+ * ### Single Entity Mode (Entity Form)
+ * Show one entity and its immediate relationships:
+ *
+ * ```html
+ * <mj-entity-erd
+ *   [entities]="[currentEntity]"
+ *   [selectedEntityId]="currentEntity.ID"
+ *   [depth]="1"
+ *   (openRecord)="onOpenRecord($event)">
+ * </mj-entity-erd>
+ * ```
+ *
+ * ### Multi-Entity Mode (Schema Explorer)
+ * Show multiple entities with persistence handled by parent:
+ *
+ * ```html
+ * <mj-entity-erd
+ *   [entities]="filteredEntities"
+ *   [selectedEntityId]="savedSelectedId"
+ *   [depth]="savedDepth"
+ *   (entitySelected)="onEntitySelected($event); saveState()"
+ *   (stateChange)="onStateChange($event); saveState()"
+ *   (openRecord)="onOpenRecord($event)">
+ * </mj-entity-erd>
+ * ```
+ *
+ * ## Important Design Decisions
+ *
+ * - **No State Persistence**: This component does NOT persist user state (selection, zoom, etc.).
+ *   The parent is responsible for saving/restoring state via the inputs and events.
+ * - **No Filtering**: The caller filters entities before passing them. This keeps the component simple.
+ * - **Controlled Selection**: Selection is controlled via `selectedEntityId` input. The component
+ *   emits `entitySelected` when user clicks, but parent decides what to do.
+ *
+ * @see ERDDiagramComponent for the underlying generic component
+ */
+export class MJEntityERDComponent {
+    erdDiagram;
+    // ============================================================================
+    // INPUTS - Data
+    // ============================================================================
+    /**
+     * The entities to display in the ERD.
+     * Pass one or more EntityInfo objects. The component will automatically
+     * discover and display related entities based on the `depth` setting.
+     *
+     * @example
+     * ```typescript
+     * // Single entity
+     * [entities]="[currentEntity]"
+     *
+     * // Multiple entities (schema view)
+     * [entities]="filteredEntities"
+     * ```
+     */
+    entities = [];
+    /**
+     * All entities in the system for relationship discovery.
+     * If not provided, uses Metadata.Entities automatically.
+     * This is used to look up related entities when building the ERD.
+     */
+    allEntities;
+    /**
+     * ID of the currently selected entity.
+     * Controlled by parent - the component emits selection events but doesn't
+     * manage selection state internally.
+     */
+    selectedEntityId = null;
+    /**
+     * IDs of entities to highlight (in addition to selected).
+     */
+    highlightedEntityIds = [];
+    /**
+     * ID of entity to focus on (shows only this entity and related up to depth).
+     * If null, shows all provided entities.
+     */
+    focusEntityId = null;
+    /**
+     * Focus depth when focusEntityId is set.
+     */
+    focusDepth = 1;
+    // ============================================================================
+    // INPUTS - Relationship Options
+    // ============================================================================
+    /**
+     * Number of relationship hops to include when auto-discovering related entities.
+     * - `0`: Show only the provided entities (no auto-discovery)
+     * - `1`: Show provided entities + directly related entities (default)
+     * - `2+`: Show entities within N relationship hops
+     *
+     * @default 1
+     */
+    depth = 1;
+    /**
+     * Include incoming relationships (entities that reference these entities).
+     * @default true
+     */
+    includeIncoming = true;
+    /**
+     * Include outgoing relationships (entities these reference via FK).
+     * @default true
+     */
+    includeOutgoing = true;
+    // ============================================================================
+    // INPUTS - Configuration
+    // ============================================================================
+    /**
+     * Configuration options passed to the underlying ERD component.
+     */
+    config = {};
+    /**
+     * Whether to show the header bar with controls.
+     * @default true
+     */
+    showHeader = true;
+    /**
+     * Title for the header bar.
+     */
+    headerTitle = 'Entity Relationship Diagram';
+    /**
+     * Whether the diagram is in a loading/refreshing state.
+     */
+    isRefreshing = false;
+    /**
+     * Whether the diagram is read-only (no selection/dragging).
+     */
+    readOnly = false;
+    // ============================================================================
+    // OUTPUTS
+    // ============================================================================
+    /**
+     * Emitted when an entity is selected by clicking.
+     * The parent should update `selectedEntityId` in response.
+     */
+    entitySelected = new EventEmitter();
+    /**
+     * Emitted when the selection is cleared.
+     */
+    entityDeselected = new EventEmitter();
+    /**
+     * Emitted when an entity is double-clicked.
+     * Typically used to open the entity record.
+     */
+    entityDoubleClick = new EventEmitter();
+    /**
+     * Emitted when requesting to open an entity record.
+     * This is the standard MJ pattern for navigation.
+     */
+    openRecord = new EventEmitter();
+    /**
+     * Emitted when zoom/pan changes.
+     * Parent can use this for state persistence.
+     */
+    zoomChange = new EventEmitter();
+    /**
+     * Emitted when diagram state changes (selection, zoom, etc.).
+     * Parent can use this for state persistence.
+     */
+    stateChange = new EventEmitter();
+    /**
+     * Emitted when user requests a refresh via the header button.
+     */
+    refreshRequested = new EventEmitter();
+    // ============================================================================
+    // INTERNAL STATE
+    // ============================================================================
+    /** Computed ERD nodes */
+    erdNodes = [];
+    _metadata = new Metadata();
+    // ============================================================================
+    // LIFECYCLE
+    // ============================================================================
+    ngOnChanges(changes) {
+        // Rebuild ERD data when entities or relationship options change
+        if (changes['entities'] ||
+            changes['allEntities'] ||
+            changes['depth'] ||
+            changes['includeIncoming'] ||
+            changes['includeOutgoing']) {
+            this.buildERDData();
+        }
+    }
+    // ============================================================================
+    // ERD DATA BUILDING
+    // ============================================================================
+    buildERDData() {
+        if (!this.entities || this.entities.length === 0) {
+            this.erdNodes = [];
+            return;
+        }
+        // Use provided allEntities or fall back to Metadata
+        const allEntities = this.allEntities || this._metadata.Entities;
+        const result = buildERDDataFromEntities(this.entities, {
+            allEntities,
+            includeIncoming: this.includeIncoming,
+            includeOutgoing: this.includeOutgoing,
+            depth: this.depth
+        });
+        // DEBUG: Log node count for debugging depth issues
+        console.log(`[mj-entity-erd] buildERDData called with depth=${this.depth}, entities=${this.entities.length}, allEntities=${allEntities.length}, resultNodes=${result.nodes.length}, resultLinks=${result.links.length}`);
+        // Note: Links are derived automatically by the ERD diagram component
+        // from the node field relationships (relatedNodeId)
+        this.erdNodes = result.nodes;
+    }
+    // ============================================================================
+    // EVENT HANDLERS
+    // ============================================================================
+    onNodeClick(_event) {
+        // Let the base component handle the click
+        // Selection is handled via nodeSelected
+    }
+    onNodeDoubleClick(event) {
+        const entity = getOriginalEntityFromERDNode(event.node);
+        if (entity) {
+            this.entityDoubleClick.emit({ entity, node: event.node });
+            // Also emit openRecord for convenience - container handles navigation
+            this.openRecord.emit({
+                EntityName: 'Entities',
+                RecordID: entity.ID,
+                entity
+            });
+        }
+    }
+    onNodeSelected(node) {
+        const entity = getOriginalEntityFromERDNode(node);
+        if (entity) {
+            this.entitySelected.emit({ entity, node });
+        }
+    }
+    onNodeDeselected() {
+        this.entityDeselected.emit();
+    }
+    onZoomChange(event) {
+        this.zoomChange.emit(event);
+    }
+    onStateChange(state) {
+        this.stateChange.emit(state);
+    }
+    onRefreshRequested() {
+        this.refreshRequested.emit();
+    }
+    // ============================================================================
+    // PUBLIC API (Delegates to underlying component)
+    // ============================================================================
+    /**
+     * Zoom in on the diagram.
+     */
+    zoomIn() {
+        this.erdDiagram?.zoomIn();
+    }
+    /**
+     * Zoom out on the diagram.
+     */
+    zoomOut() {
+        this.erdDiagram?.zoomOut();
+    }
+    /**
+     * Reset zoom to default.
+     */
+    resetZoom() {
+        this.erdDiagram?.resetZoom();
+    }
+    /**
+     * Fit all nodes in view.
+     */
+    zoomToFit(padding) {
+        this.erdDiagram?.zoomToFit(padding);
+    }
+    /**
+     * Zoom to a specific entity.
+     */
+    zoomToEntity(entityId, scale) {
+        this.erdDiagram?.zoomToNode(entityId, scale);
+    }
+    /**
+     * Get current diagram state for persistence.
+     */
+    getState() {
+        return this.erdDiagram?.getState() || null;
+    }
+    /**
+     * Restore diagram state.
+     */
+    setState(state, restorePositions) {
+        this.erdDiagram?.setState(state, restorePositions);
+    }
+    /**
+     * Refresh the diagram.
+     */
+    refresh() {
+        this.buildERDData();
+        this.erdDiagram?.refresh();
+    }
+    /**
+     * Export diagram as SVG.
+     */
+    exportAsSVG() {
+        return this.erdDiagram?.exportAsSVG() || '';
+    }
+    /**
+     * Trigger a resize recalculation. Call this when the container size changes.
+     */
+    triggerResize() {
+        this.erdDiagram?.triggerResize();
+    }
+    static ɵfac = function MJEntityERDComponent_Factory(t) { return new (t || MJEntityERDComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJEntityERDComponent, selectors: [["mj-entity-erd"]], viewQuery: function MJEntityERDComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(ERDDiagramComponent, 5);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.erdDiagram = _t.first);
+        } }, inputs: { entities: "entities", allEntities: "allEntities", selectedEntityId: "selectedEntityId", highlightedEntityIds: "highlightedEntityIds", focusEntityId: "focusEntityId", focusDepth: "focusDepth", depth: "depth", includeIncoming: "includeIncoming", includeOutgoing: "includeOutgoing", config: "config", showHeader: "showHeader", headerTitle: "headerTitle", isRefreshing: "isRefreshing", readOnly: "readOnly" }, outputs: { entitySelected: "entitySelected", entityDeselected: "entityDeselected", entityDoubleClick: "entityDoubleClick", openRecord: "openRecord", zoomChange: "zoomChange", stateChange: "stateChange", refreshRequested: "refreshRequested" }, features: [i0.ɵɵNgOnChangesFeature], decls: 1, vars: 10, consts: [[3, "nodeClick", "nodeDoubleClick", "nodeSelected", "nodeDeselected", "zoomChange", "stateChange", "refreshRequested", "nodes", "selectedNodeId", "highlightedNodeIds", "focusNodeId", "focusDepth", "config", "showHeader", "headerTitle", "isRefreshing", "readOnly"]], template: function MJEntityERDComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "mj-erd-diagram", 0);
+            i0.ɵɵlistener("nodeClick", function MJEntityERDComponent_Template_mj_erd_diagram_nodeClick_0_listener($event) { return ctx.onNodeClick($event); })("nodeDoubleClick", function MJEntityERDComponent_Template_mj_erd_diagram_nodeDoubleClick_0_listener($event) { return ctx.onNodeDoubleClick($event); })("nodeSelected", function MJEntityERDComponent_Template_mj_erd_diagram_nodeSelected_0_listener($event) { return ctx.onNodeSelected($event); })("nodeDeselected", function MJEntityERDComponent_Template_mj_erd_diagram_nodeDeselected_0_listener() { return ctx.onNodeDeselected(); })("zoomChange", function MJEntityERDComponent_Template_mj_erd_diagram_zoomChange_0_listener($event) { return ctx.onZoomChange($event); })("stateChange", function MJEntityERDComponent_Template_mj_erd_diagram_stateChange_0_listener($event) { return ctx.onStateChange($event); })("refreshRequested", function MJEntityERDComponent_Template_mj_erd_diagram_refreshRequested_0_listener() { return ctx.onRefreshRequested(); });
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵproperty("nodes", ctx.erdNodes)("selectedNodeId", ctx.selectedEntityId)("highlightedNodeIds", ctx.highlightedEntityIds)("focusNodeId", ctx.focusEntityId)("focusDepth", ctx.focusDepth)("config", ctx.config)("showHeader", ctx.showHeader)("headerTitle", ctx.headerTitle)("isRefreshing", ctx.isRefreshing)("readOnly", ctx.readOnly);
+        } }, dependencies: [i1.ERDDiagramComponent], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJEntityERDComponent, [{
+        type: Component,
+        args: [{
+                selector: 'mj-entity-erd',
+                template: `
+    <mj-erd-diagram
+      [nodes]="erdNodes"
+      [selectedNodeId]="selectedEntityId"
+      [highlightedNodeIds]="highlightedEntityIds"
+      [focusNodeId]="focusEntityId"
+      [focusDepth]="focusDepth"
+      [config]="config"
+      [showHeader]="showHeader"
+      [headerTitle]="headerTitle"
+      [isRefreshing]="isRefreshing"
+      [readOnly]="readOnly"
+      (nodeClick)="onNodeClick($event)"
+      (nodeDoubleClick)="onNodeDoubleClick($event)"
+      (nodeSelected)="onNodeSelected($event)"
+      (nodeDeselected)="onNodeDeselected()"
+      (zoomChange)="onZoomChange($event)"
+      (stateChange)="onStateChange($event)"
+      (refreshRequested)="onRefreshRequested()">
+    </mj-erd-diagram>
+  `,
+                changeDetection: ChangeDetectionStrategy.OnPush
+            }]
+    }], null, { erdDiagram: [{
+            type: ViewChild,
+            args: [ERDDiagramComponent]
+        }], entities: [{
+            type: Input
+        }], allEntities: [{
+            type: Input
+        }], selectedEntityId: [{
+            type: Input
+        }], highlightedEntityIds: [{
+            type: Input
+        }], focusEntityId: [{
+            type: Input
+        }], focusDepth: [{
+            type: Input
+        }], depth: [{
+            type: Input
+        }], includeIncoming: [{
+            type: Input
+        }], includeOutgoing: [{
+            type: Input
+        }], config: [{
+            type: Input
+        }], showHeader: [{
+            type: Input
+        }], headerTitle: [{
+            type: Input
+        }], isRefreshing: [{
+            type: Input
+        }], readOnly: [{
+            type: Input
+        }], entitySelected: [{
+            type: Output
+        }], entityDeselected: [{
+            type: Output
+        }], entityDoubleClick: [{
+            type: Output
+        }], openRecord: [{
+            type: Output
+        }], zoomChange: [{
+            type: Output
+        }], stateChange: [{
+            type: Output
+        }], refreshRequested: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJEntityERDComponent, { className: "MJEntityERDComponent", filePath: "src/lib/components/mj-entity-erd.component.ts", lineNumber: 138 }); })();
+//# sourceMappingURL=mj-entity-erd.component.js.map

package/dist/lib/components/mj-entity-erd.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mj-entity-erd.component.js","sourceRoot":"","sources":["../../../src/lib/components/mj-entity-erd.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/entity-relationship-diagram.module.d.ts

@@ -0,0 +1,83 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./components/erd-diagram.component";
+import * as i2 from "./components/mj-entity-erd.component";
+import * as i3 from "./components/entity-details/entity-details.component";
+import * as i4 from "./components/entity-filter-panel/entity-filter-panel.component";
+import * as i5 from "./components/erd-composite/erd-composite.component";
+import * as i6 from "@angular/common";
+import * as i7 from "@angular/forms";
+import * as i8 from "@progress/kendo-angular-layout";
+/**
+ * Module for the Entity Relationship Diagram (ERD) visualization components.
+ *
+ * This module provides a complete suite of components for visualizing and
+ * exploring entity relationships:
+ *
+ * ## Components
+ *
+ * ### 1. ERDDiagramComponent (`<mj-erd-diagram>`)
+ * A generic, reusable ERD component that visualizes entity relationships using
+ * D3.js force-directed graphs. It works with any data conforming to the `ERDNode`
+ * interface and is completely decoupled from MemberJunction-specific types.
+ *
+ * ### 2. MJEntityERDComponent (`<mj-entity-erd>`)
+ * A higher-level wrapper specifically for MemberJunction. It accepts `EntityInfo[]`
+ * directly and handles all the transformation to ERD format automatically.
+ *
+ * ### 3. EntityDetailsComponent (`<mj-entity-details>`)
+ * A detail panel that shows entity information, fields, and relationships when
+ * an entity is selected. Designed to work alongside the ERD diagram.
+ *
+ * ### 4. EntityFilterPanelComponent (`<mj-entity-filter-panel>`)
+ * A filter panel for filtering entities by schema, name, status, and base table.
+ *
+ * ### 5. ERDCompositeComponent (`<mj-erd-composite>`)
+ * A complete, ready-to-use ERD exploration interface that combines:
+ * - Left panel: Entity filter controls
+ * - Center: Interactive ERD diagram
+ * - Right panel: Entity details (shown when an entity is selected)
+ *
+ * ### Choosing Which Component to Use
+ *
+ * | Use Case | Component |
+ * |----------|-----------|
+ * | Complete ERD exploration UI | `<mj-erd-composite>` |
+ * | ERD diagram with MJ EntityInfo | `<mj-entity-erd>` |
+ * | Custom data sources (non-MJ) | `<mj-erd-diagram>` |
+ * | Entity detail panel standalone | `<mj-entity-details>` |
+ * | Entity filter panel standalone | `<mj-entity-filter-panel>` |
+ *
+ * @example Using the composite (recommended for dashboards)
+ * ```html
+ * <mj-erd-composite
+ *   (userStateChange)="saveUserPreferences($event)"
+ *   (openRecord)="navigateToRecord($event)">
+ * </mj-erd-composite>
+ * ```
+ *
+ * @example Using the MJ wrapper
+ * ```html
+ * <mj-entity-erd
+ *   [entities]="[currentEntity]"
+ *   [selectedEntityId]="currentEntity.ID"
+ *   [depth]="1"
+ *   (entitySelected)="onEntitySelected($event)"
+ *   (openRecord)="onOpenRecord($event)">
+ * </mj-entity-erd>
+ * ```
+ *
+ * @example Using the generic component
+ * ```html
+ * <mj-erd-diagram
+ *   [nodes]="myNodes"
+ *   [selectedNodeId]="selectedId"
+ *   (nodeSelected)="onNodeSelected($event)">
+ * </mj-erd-diagram>
+ * ```
+ */
+export declare class EntityRelationshipDiagramModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<EntityRelationshipDiagramModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<EntityRelationshipDiagramModule, [typeof i1.ERDDiagramComponent, typeof i2.MJEntityERDComponent, typeof i3.EntityDetailsComponent, typeof i4.EntityFilterPanelComponent, typeof i5.ERDCompositeComponent], [typeof i6.CommonModule, typeof i7.FormsModule, typeof i8.LayoutModule], [typeof i1.ERDDiagramComponent, typeof i2.MJEntityERDComponent, typeof i3.EntityDetailsComponent, typeof i4.EntityFilterPanelComponent, typeof i5.ERDCompositeComponent]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<EntityRelationshipDiagramModule>;
+}
+//# sourceMappingURL=entity-relationship-diagram.module.d.ts.map

package/dist/lib/entity-relationship-diagram.module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"entity-relationship-diagram.module.d.ts","sourceRoot":"","sources":["../../src/lib/entity-relationship-diagram.module.ts"],"names":[],"mappings":";;;;;;;;;AAWA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AACH,qBAqBa,+BAA+B;yCAA/B,+BAA+B;0CAA/B,+BAA+B;0CAA/B,+BAA+B;CAAG"}

package/dist/lib/entity-relationship-diagram.module.js

@@ -0,0 +1,121 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { LayoutModule } from '@progress/kendo-angular-layout';
+import { ERDDiagramComponent } from './components/erd-diagram.component';
+import { MJEntityERDComponent } from './components/mj-entity-erd.component';
+import { EntityDetailsComponent } from './components/entity-details/entity-details.component';
+import { EntityFilterPanelComponent } from './components/entity-filter-panel/entity-filter-panel.component';
+import { ERDCompositeComponent } from './components/erd-composite/erd-composite.component';
+import * as i0 from "@angular/core";
+/**
+ * Module for the Entity Relationship Diagram (ERD) visualization components.
+ *
+ * This module provides a complete suite of components for visualizing and
+ * exploring entity relationships:
+ *
+ * ## Components
+ *
+ * ### 1. ERDDiagramComponent (`<mj-erd-diagram>`)
+ * A generic, reusable ERD component that visualizes entity relationships using
+ * D3.js force-directed graphs. It works with any data conforming to the `ERDNode`
+ * interface and is completely decoupled from MemberJunction-specific types.
+ *
+ * ### 2. MJEntityERDComponent (`<mj-entity-erd>`)
+ * A higher-level wrapper specifically for MemberJunction. It accepts `EntityInfo[]`
+ * directly and handles all the transformation to ERD format automatically.
+ *
+ * ### 3. EntityDetailsComponent (`<mj-entity-details>`)
+ * A detail panel that shows entity information, fields, and relationships when
+ * an entity is selected. Designed to work alongside the ERD diagram.
+ *
+ * ### 4. EntityFilterPanelComponent (`<mj-entity-filter-panel>`)
+ * A filter panel for filtering entities by schema, name, status, and base table.
+ *
+ * ### 5. ERDCompositeComponent (`<mj-erd-composite>`)
+ * A complete, ready-to-use ERD exploration interface that combines:
+ * - Left panel: Entity filter controls
+ * - Center: Interactive ERD diagram
+ * - Right panel: Entity details (shown when an entity is selected)
+ *
+ * ### Choosing Which Component to Use
+ *
+ * | Use Case | Component |
+ * |----------|-----------|
+ * | Complete ERD exploration UI | `<mj-erd-composite>` |
+ * | ERD diagram with MJ EntityInfo | `<mj-entity-erd>` |
+ * | Custom data sources (non-MJ) | `<mj-erd-diagram>` |
+ * | Entity detail panel standalone | `<mj-entity-details>` |
+ * | Entity filter panel standalone | `<mj-entity-filter-panel>` |
+ *
+ * @example Using the composite (recommended for dashboards)
+ * ```html
+ * <mj-erd-composite
+ *   (userStateChange)="saveUserPreferences($event)"
+ *   (openRecord)="navigateToRecord($event)">
+ * </mj-erd-composite>
+ * ```
+ *
+ * @example Using the MJ wrapper
+ * ```html
+ * <mj-entity-erd
+ *   [entities]="[currentEntity]"
+ *   [selectedEntityId]="currentEntity.ID"
+ *   [depth]="1"
+ *   (entitySelected)="onEntitySelected($event)"
+ *   (openRecord)="onOpenRecord($event)">
+ * </mj-entity-erd>
+ * ```
+ *
+ * @example Using the generic component
+ * ```html
+ * <mj-erd-diagram
+ *   [nodes]="myNodes"
+ *   [selectedNodeId]="selectedId"
+ *   (nodeSelected)="onNodeSelected($event)">
+ * </mj-erd-diagram>
+ * ```
+ */
+export class EntityRelationshipDiagramModule {
+    static ɵfac = function EntityRelationshipDiagramModule_Factory(t) { return new (t || EntityRelationshipDiagramModule)(); };
+    static ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: EntityRelationshipDiagramModule });
+    static ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule,
+            FormsModule,
+            LayoutModule] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EntityRelationshipDiagramModule, [{
+        type: NgModule,
+        args: [{
+                declarations: [
+                    ERDDiagramComponent,
+                    MJEntityERDComponent,
+                    EntityDetailsComponent,
+                    EntityFilterPanelComponent,
+                    ERDCompositeComponent
+                ],
+                imports: [
+                    CommonModule,
+                    FormsModule,
+                    LayoutModule
+                ],
+                exports: [
+                    ERDDiagramComponent,
+                    MJEntityERDComponent,
+                    EntityDetailsComponent,
+                    EntityFilterPanelComponent,
+                    ERDCompositeComponent
+                ]
+            }]
+    }], null, null); })();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(EntityRelationshipDiagramModule, { declarations: [ERDDiagramComponent,
+        MJEntityERDComponent,
+        EntityDetailsComponent,
+        EntityFilterPanelComponent,
+        ERDCompositeComponent], imports: [CommonModule,
+        FormsModule,
+        LayoutModule], exports: [ERDDiagramComponent,
+        MJEntityERDComponent,
+        EntityDetailsComponent,
+        EntityFilterPanelComponent,
+        ERDCompositeComponent] }); })();
+//# sourceMappingURL=entity-relationship-diagram.module.js.map

package/dist/lib/entity-relationship-diagram.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entity-relationship-diagram.module.js","sourceRoot":"","sources":["../../src/lib/entity-relationship-diagram.module.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAE9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAC5E,OAAO,EAAE,sBAAsB,EAAE,MAAM,sDAAsD,CAAC;AAC9F,OAAO,EAAE,0BAA0B,EAAE,MAAM,gEAAgE,CAAC;AAC5G,OAAO,EAAE,qBAAqB,EAAE,MAAM,oDAAoD,CAAC;;AAE3F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AAsBH,MAAM,OAAO,+BAA+B;yFAA/B,+BAA+B;4DAA/B,+BAA+B;gEAZxC,YAAY;YACZ,WAAW;YACX,YAAY;;iFAUH,+BAA+B;cArB3C,QAAQ;eAAC;gBACR,YAAY,EAAE;oBACZ,mBAAmB;oBACnB,oBAAoB;oBACpB,sBAAsB;oBACtB,0BAA0B;oBAC1B,qBAAqB;iBACtB;gBACD,OAAO,EAAE;oBACP,YAAY;oBACZ,WAAW;oBACX,YAAY;iBACb;gBACD,OAAO,EAAE;oBACP,mBAAmB;oBACnB,oBAAoB;oBACpB,sBAAsB;oBACtB,0BAA0B;oBAC1B,qBAAqB;iBACtB;aACF;;wFACY,+BAA+B,mBAnBxC,mBAAmB;QACnB,oBAAoB;QACpB,sBAAsB;QACtB,0BAA0B;QAC1B,qBAAqB,aAGrB,YAAY;QACZ,WAAW;QACX,YAAY,aAGZ,mBAAmB;QACnB,oBAAoB;QACpB,sBAAsB;QACtB,0BAA0B;QAC1B,qBAAqB"}