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

package/dist/lib/components/erd-composite/erd-composite.component.js

@@ -0,0 +1,391 @@
+import { Component, Input, Output, EventEmitter, ViewChild } from '@angular/core';
+import { Subject } from 'rxjs';
+import { debounceTime } from 'rxjs/operators';
+import { Metadata } from '@memberjunction/core';
+import { MJEntityERDComponent } from '../mj-entity-erd.component';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-layout";
+import * as i2 from "../mj-entity-erd.component";
+import * as i3 from "../entity-details/entity-details.component";
+import * as i4 from "../entity-filter-panel/entity-filter-panel.component";
+/**
+ * ERD Composite component that combines the ERD diagram with filter and details panels.
+ *
+ * This is a complete, ready-to-use ERD exploration interface that includes:
+ * - Left panel: Entity filter controls (schema, name, status, etc.)
+ * - Center: Interactive ERD diagram
+ * - Right panel: Entity details (shown when an entity is selected)
+ *
+ * The component handles all internal state but emits events for:
+ * - State changes (for parent to persist user preferences)
+ * - Open record requests (for parent to handle navigation)
+ *
+ * ## Usage
+ *
+ * ```html
+ * <mj-erd-composite
+ *   (stateChange)="onStateChange($event)"
+ *   (userStateChange)="saveUserPreferences($event)"
+ *   (openRecord)="navigateToRecord($event)">
+ * </mj-erd-composite>
+ * ```
+ *
+ * ## State Persistence
+ *
+ * The component emits `userStateChange` events (debounced 1s) when user changes
+ * any settings. The parent should save this state and restore it using `loadUserState()`:
+ *
+ * ```typescript
+ * @ViewChild(ERDCompositeComponent) erdComposite!: ERDCompositeComponent;
+ *
+ * ngAfterViewInit() {
+ *   const savedState = await this.loadSavedState();
+ *   if (savedState) {
+ *     this.erdComposite.loadUserState(savedState);
+ *   }
+ * }
+ *
+ * onUserStateChange(state: ERDCompositeState) {
+ *   await this.saveState(state);
+ * }
+ * ```
+ */
+export class ERDCompositeComponent {
+    mjEntityErd;
+    /** Whether the ERD is in a refreshing state */
+    isRefreshingERD = false;
+    /**
+     * Optional: Focus entities to display in the ERD.
+     * When provided, only these entities will be shown (useful for single-entity views).
+     * When not provided, all entities from metadata are loaded.
+     */
+    focusEntities = null;
+    /**
+     * Whether to show the filter panel on the left.
+     * Set to false for focused/single-entity views.
+     */
+    showFilterPanel = true;
+    /**
+     * Depth of relationships to display.
+     * 1 = only direct relationships, 2 = relationships of relationships, etc.
+     */
+    depth = 1;
+    /**
+     * Whether to show the ERD header bar.
+     */
+    showHeader = true;
+    /** All entities loaded from metadata */
+    entities = [];
+    /** All entity fields (flattened from all entities) */
+    allEntityFields = [];
+    /** Emitted on any state change (debounced 50ms) */
+    stateChange = new EventEmitter();
+    /** Emitted on user-initiated state changes (debounced 1s) for persistence */
+    userStateChange = new EventEmitter();
+    /** Emitted when an entity is opened (e.g., double-clicked in details panel) */
+    entityOpened = new EventEmitter();
+    /** Emitted when requesting to open an entity record (for navigation) */
+    openRecord = new EventEmitter();
+    // Panel visibility and configuration
+    filterPanelVisible = true;
+    fieldsSectionExpanded = true;
+    relationshipsSectionExpanded = true;
+    /** ERD configuration - skip animation for faster rendering */
+    erdConfig = { skipAnimation: true };
+    // Entity state
+    selectedEntity = null;
+    filteredEntities = [];
+    isDataLoaded = false;
+    // Filters
+    filters = {
+        schemaName: null,
+        entityName: '',
+        entityStatus: null,
+        baseTable: '',
+    };
+    // State management
+    stateChangeSubject = new Subject();
+    userStateChangeSubject = new Subject();
+    filterChangeSubject = new Subject();
+    async ngOnInit() {
+        // Initialize filter panel visibility based on input
+        this.filterPanelVisible = this.showFilterPanel;
+        this.setupStateManagement();
+        await this.loadData();
+        // Use focusEntities if provided, otherwise use all entities
+        if (this.focusEntities && this.focusEntities.length > 0) {
+            this.filteredEntities = [...this.focusEntities];
+        }
+        else {
+            this.filteredEntities = [...this.entities];
+            this.applyFilters();
+        }
+        this.isDataLoaded = true;
+        // Notify parent that data is loaded and ready for state loading
+        this.emitStateChange();
+    }
+    ngOnDestroy() {
+        this.stateChangeSubject.complete();
+        this.userStateChangeSubject.complete();
+        this.filterChangeSubject.complete();
+    }
+    async loadData() {
+        // Load entities from metadata (always needed for allEntityFields and relationship lookups)
+        const md = new Metadata();
+        this.entities = md.Entities;
+        // Load all entity fields from entities
+        this.allEntityFields = this.entities
+            .map((entity) => {
+            return entity.Fields;
+        })
+            .flat();
+    }
+    setupStateManagement() {
+        // State change emissions with debouncing
+        this.stateChangeSubject.pipe(debounceTime(50)).subscribe(state => {
+            this.stateChange.emit(state);
+        });
+        this.userStateChangeSubject.pipe(debounceTime(1000)).subscribe(state => {
+            this.userStateChange.emit(state);
+        });
+        // Filter changes with debouncing
+        this.filterChangeSubject.pipe(debounceTime(300)).subscribe(() => {
+            this.applyFilters();
+            this.emitStateChange();
+            this.emitUserStateChange();
+        });
+    }
+    onFilterChange() {
+        this.filterChangeSubject.next();
+    }
+    onFiltersChange(newFilters) {
+        this.filters = { ...newFilters };
+        this.onFilterChange();
+    }
+    onResetFilters() {
+        this.filters = {
+            schemaName: null,
+            entityName: '',
+            entityStatus: null,
+            baseTable: '',
+        };
+        this.onFilterChange();
+    }
+    onToggleFilterPanel() {
+        this.filterPanelVisible = !this.filterPanelVisible;
+        // Trigger ERD resize when filter panel is toggled
+        if (this.mjEntityErd) {
+            this.mjEntityErd.triggerResize();
+        }
+        this.emitStateChange();
+        this.emitUserStateChange();
+    }
+    onEntityDeselected() {
+        this.selectedEntity = null;
+        this.emitStateChange();
+        this.emitUserStateChange();
+    }
+    onEntitySelected(entity) {
+        this.selectedEntity = entity;
+        this.emitStateChange();
+        this.emitUserStateChange();
+    }
+    /**
+     * Handle entity selection from the mj-entity-erd wrapper.
+     * Updates internal state.
+     */
+    onERDEntitySelected(event) {
+        this.selectedEntity = event.entity;
+        this.emitStateChange();
+        this.emitUserStateChange();
+    }
+    /**
+     * Handle open record from the mj-entity-erd wrapper (double-click).
+     * Opens the entity record using the entity form.
+     */
+    onERDOpenRecord(event) {
+        this.openRecord.emit({ EntityName: event.EntityName, RecordID: event.RecordID });
+    }
+    /**
+     * Handle state changes from the ERD component.
+     */
+    onERDStateChange(_state) {
+        // State changes are tracked for user preference persistence
+        this.emitUserStateChange();
+    }
+    onEntityOpened(entity) {
+        this.entityOpened.emit(entity);
+    }
+    onFieldsSectionToggle() {
+        this.fieldsSectionExpanded = !this.fieldsSectionExpanded;
+        this.emitUserStateChange();
+    }
+    onRelationshipsSectionToggle() {
+        this.relationshipsSectionExpanded = !this.relationshipsSectionExpanded;
+        this.emitUserStateChange();
+    }
+    onOpenRecord(event) {
+        this.openRecord.emit(event);
+    }
+    onSplitterLayoutChange(_event) {
+        // Trigger ERD diagram resize when splitter layout changes
+        if (this.mjEntityErd) {
+            this.mjEntityErd.triggerResize();
+        }
+        this.emitStateChange();
+        this.emitUserStateChange();
+    }
+    applyFilters() {
+        this.filteredEntities = this.entities.filter(entity => {
+            // Schema filter
+            if (this.filters.schemaName && entity.SchemaName !== this.filters.schemaName) {
+                return false;
+            }
+            // Entity name filter
+            if (this.filters.entityName) {
+                const searchTerm = this.filters.entityName.toLowerCase();
+                const entityName = (entity.Name || entity.SchemaName || '').toLowerCase();
+                if (!entityName.includes(searchTerm)) {
+                    return false;
+                }
+            }
+            // Base table filter
+            if (this.filters.baseTable) {
+                const searchTerm = this.filters.baseTable.toLowerCase();
+                const baseTable = (entity.BaseTable || '').toLowerCase();
+                if (!baseTable.includes(searchTerm)) {
+                    return false;
+                }
+            }
+            // Status filter
+            if (this.filters.entityStatus && entity.Status !== this.filters.entityStatus) {
+                return false;
+            }
+            return true;
+        });
+    }
+    emitStateChange() {
+        const state = this.buildState();
+        this.stateChangeSubject.next(state);
+    }
+    emitUserStateChange() {
+        const state = this.buildState();
+        this.userStateChangeSubject.next(state);
+    }
+    buildState() {
+        return {
+            filterPanelVisible: this.filterPanelVisible,
+            filterPanelWidth: 320,
+            filters: { ...this.filters },
+            selectedEntityId: this.selectedEntity?.ID || null,
+            zoomLevel: 1,
+            panPosition: { x: 0, y: 0 },
+            fieldsSectionExpanded: this.fieldsSectionExpanded,
+            relationshipsSectionExpanded: this.relationshipsSectionExpanded,
+        };
+    }
+    // ============================================================================
+    // PUBLIC API
+    // ============================================================================
+    /**
+     * Load user state from a previously saved state object.
+     * Call this after the component is initialized to restore user preferences.
+     */
+    loadUserState(state) {
+        if (state.filterPanelVisible !== undefined) {
+            this.filterPanelVisible = state.filterPanelVisible;
+        }
+        if (state.filters) {
+            this.filters = { ...state.filters };
+        }
+        if (state.fieldsSectionExpanded !== undefined) {
+            this.fieldsSectionExpanded = state.fieldsSectionExpanded;
+        }
+        if (state.relationshipsSectionExpanded !== undefined) {
+            this.relationshipsSectionExpanded = state.relationshipsSectionExpanded;
+        }
+        if (state.selectedEntityId && this.entities.length > 0) {
+            const entity = this.entities.find(e => e.ID === state.selectedEntityId);
+            if (entity) {
+                this.selectedEntity = entity;
+            }
+        }
+        else {
+            this.selectedEntity = null;
+        }
+        this.applyFilters();
+    }
+    /**
+     * Refresh the ERD diagram.
+     */
+    refreshERD() {
+        if (this.mjEntityErd) {
+            this.mjEntityErd.refresh();
+        }
+    }
+    /**
+     * Get the current state for external use.
+     */
+    getState() {
+        return this.buildState();
+    }
+    static ɵfac = function ERDCompositeComponent_Factory(t) { return new (t || ERDCompositeComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ERDCompositeComponent, selectors: [["mj-erd-composite"]], viewQuery: function ERDCompositeComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(MJEntityERDComponent, 5);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.mjEntityErd = _t.first);
+        } }, inputs: { isRefreshingERD: "isRefreshingERD", focusEntities: "focusEntities", showFilterPanel: "showFilterPanel", depth: "depth", showHeader: "showHeader" }, outputs: { stateChange: "stateChange", userStateChange: "userStateChange", entityOpened: "entityOpened", openRecord: "openRecord" }, decls: 9, vars: 28, consts: [[1, "erd-composite"], ["orientation", "horizontal", 1, "main-splitter", 3, "layoutChange"], [3, "size", "collapsible", "resizable", "scrollable", "hidden"], [3, "filtersChange", "filterChange", "resetFilters", "closePanel", "entities", "filteredEntities", "filters"], [3, "resizable", "scrollable"], [1, "erd-pane-container"], ["headerTitle", "Entity Relationship Diagram", 3, "entitySelected", "entityDeselected", "openRecord", "stateChange", "entities", "allEntities", "selectedEntityId", "isRefreshing", "depth", "includeIncoming", "includeOutgoing", "showHeader", "config"], [3, "openEntity", "closePanel", "fieldsSectionToggle", "relationshipsSectionToggle", "entitySelected", "openRecord", "selectedEntity", "allEntityFields", "fieldsSectionExpanded", "relationshipsSectionExpanded"]], template: function ERDCompositeComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "kendo-splitter", 1);
+            i0.ɵɵlistener("layoutChange", function ERDCompositeComponent_Template_kendo_splitter_layoutChange_1_listener($event) { return ctx.onSplitterLayoutChange($event); });
+            i0.ɵɵelementStart(2, "kendo-splitter-pane", 2)(3, "mj-entity-filter-panel", 3);
+            i0.ɵɵlistener("filtersChange", function ERDCompositeComponent_Template_mj_entity_filter_panel_filtersChange_3_listener($event) { return ctx.onFiltersChange($event); })("filterChange", function ERDCompositeComponent_Template_mj_entity_filter_panel_filterChange_3_listener() { return ctx.onFilterChange(); })("resetFilters", function ERDCompositeComponent_Template_mj_entity_filter_panel_resetFilters_3_listener() { return ctx.onResetFilters(); })("closePanel", function ERDCompositeComponent_Template_mj_entity_filter_panel_closePanel_3_listener() { return ctx.onToggleFilterPanel(); });
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(4, "kendo-splitter-pane", 4)(5, "div", 5)(6, "mj-entity-erd", 6);
+            i0.ɵɵlistener("entitySelected", function ERDCompositeComponent_Template_mj_entity_erd_entitySelected_6_listener($event) { return ctx.onERDEntitySelected($event); })("entityDeselected", function ERDCompositeComponent_Template_mj_entity_erd_entityDeselected_6_listener() { return ctx.onEntityDeselected(); })("openRecord", function ERDCompositeComponent_Template_mj_entity_erd_openRecord_6_listener($event) { return ctx.onERDOpenRecord($event); })("stateChange", function ERDCompositeComponent_Template_mj_entity_erd_stateChange_6_listener($event) { return ctx.onERDStateChange($event); });
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(7, "kendo-splitter-pane", 2)(8, "mj-entity-details", 7);
+            i0.ɵɵlistener("openEntity", function ERDCompositeComponent_Template_mj_entity_details_openEntity_8_listener($event) { return ctx.onEntityOpened($event); })("closePanel", function ERDCompositeComponent_Template_mj_entity_details_closePanel_8_listener() { return ctx.onEntityDeselected(); })("fieldsSectionToggle", function ERDCompositeComponent_Template_mj_entity_details_fieldsSectionToggle_8_listener() { return ctx.onFieldsSectionToggle(); })("relationshipsSectionToggle", function ERDCompositeComponent_Template_mj_entity_details_relationshipsSectionToggle_8_listener() { return ctx.onRelationshipsSectionToggle(); })("entitySelected", function ERDCompositeComponent_Template_mj_entity_details_entitySelected_8_listener($event) { return ctx.onEntitySelected($event); })("openRecord", function ERDCompositeComponent_Template_mj_entity_details_openRecord_8_listener($event) { return ctx.onOpenRecord($event); });
+            i0.ɵɵelementEnd()()()();
+        } if (rf & 2) {
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("size", ctx.filterPanelVisible ? "320px" : "0px")("collapsible", false)("resizable", ctx.filterPanelVisible)("scrollable", false)("hidden", !ctx.filterPanelVisible);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("entities", ctx.entities)("filteredEntities", ctx.filteredEntities)("filters", ctx.filters);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("resizable", true)("scrollable", false);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("entities", ctx.filteredEntities)("allEntities", ctx.entities)("selectedEntityId", (ctx.selectedEntity == null ? null : ctx.selectedEntity.ID) || null)("isRefreshing", ctx.isRefreshingERD)("depth", ctx.depth)("includeIncoming", true)("includeOutgoing", true)("showHeader", ctx.showHeader)("config", ctx.erdConfig);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("size", ctx.selectedEntity ? "320px" : "0px")("collapsible", false)("resizable", !!ctx.selectedEntity)("scrollable", false)("hidden", !ctx.selectedEntity);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("selectedEntity", ctx.selectedEntity)("allEntityFields", ctx.allEntityFields)("fieldsSectionExpanded", ctx.fieldsSectionExpanded)("relationshipsSectionExpanded", ctx.relationshipsSectionExpanded);
+        } }, dependencies: [i1.SplitterComponent, i1.SplitterPaneComponent, i2.MJEntityERDComponent, i3.EntityDetailsComponent, i4.EntityFilterPanelComponent], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n  width: 100%;\n}\n\n.erd-composite[_ngcontent-%COMP%] {\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n\n.main-splitter[_ngcontent-%COMP%] {\n  height: 100%;\n  width: 100%;\n}\n.main-splitter[_ngcontent-%COMP%]   .k-pane[_ngcontent-%COMP%] {\n  overflow: hidden;\n}\n\n.erd-pane-container[_ngcontent-%COMP%] {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n\n.floating-details-panel[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 50%;\n  right: 20px;\n  width: 380px;\n  max-height: calc(100% - 40px);\n  background: white;\n  border: 1px solid #ddd;\n  border-radius: 8px;\n  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);\n  z-index: 1000;\n  overflow: hidden;\n  transform: translateY(-50%);\n  animation: _ngcontent-%COMP%_slideInFromRight 0.3s ease-out;\n}\n@media (max-width: 768px) {\n  .floating-details-panel[_ngcontent-%COMP%] {\n    right: 10px;\n    left: 10px;\n    width: auto;\n    max-width: none;\n  }\n}\n@media (max-height: 600px) {\n  .floating-details-panel[_ngcontent-%COMP%] {\n    top: 20px;\n    transform: none;\n    max-height: calc(100vh - 40px);\n  }\n}\n\n@keyframes _ngcontent-%COMP%_slideInFromRight {\n  from {\n    transform: translateY(-50%) translateX(100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(-50%) translateX(0);\n    opacity: 1;\n  }\n}\n\n\n\n.explorer-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n}\n\n.explorer-header-bar[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  padding: 8px 16px;\n  background: #f8fafc;\n  border-bottom: 1px solid #e2e8f0;\n  flex-shrink: 0;\n}\n\n.back-btn[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 16px;\n  background: #ffffff;\n  border: 1px solid #e2e8f0;\n  border-radius: 6px;\n  color: #64748b;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.back-btn[_ngcontent-%COMP%]:hover {\n  background: #f1f5f9;\n  border-color: #cbd5e1;\n  color: #1e293b;\n}\n\n.back-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n.explorer-container[_ngcontent-%COMP%]   mj-entity-explorer[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n}"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ERDCompositeComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-erd-composite', template: "<div class=\"erd-composite\">\n  <kendo-splitter\n      class=\"main-splitter\"\n      orientation=\"horizontal\"\n      (layoutChange)=\"onSplitterLayoutChange($event)\">\n\n      <!-- Filter Panel (Left) -->\n      <kendo-splitter-pane\n        [size]=\"filterPanelVisible ? '320px' : '0px'\"\n        [collapsible]=\"false\"\n        [resizable]=\"filterPanelVisible\"\n        [scrollable]=\"false\"\n        [hidden]=\"!filterPanelVisible\">\n        <mj-entity-filter-panel\n          [entities]=\"entities\"\n          [filteredEntities]=\"filteredEntities\"\n          [filters]=\"filters\"\n          (filtersChange)=\"onFiltersChange($event)\"\n          (filterChange)=\"onFilterChange()\"\n          (resetFilters)=\"onResetFilters()\"\n          (closePanel)=\"onToggleFilterPanel()\">\n        </mj-entity-filter-panel>\n      </kendo-splitter-pane>\n\n      <!-- ERD Diagram (Center) -->\n      <kendo-splitter-pane\n        [resizable]=\"true\"\n        [scrollable]=\"false\">\n        <div class=\"erd-pane-container\">\n          <mj-entity-erd\n            [entities]=\"filteredEntities\"\n            [allEntities]=\"entities\"\n            [selectedEntityId]=\"selectedEntity?.ID || null\"\n            [isRefreshing]=\"isRefreshingERD\"\n            [depth]=\"depth\"\n            [includeIncoming]=\"true\"\n            [includeOutgoing]=\"true\"\n            [showHeader]=\"showHeader\"\n            [config]=\"erdConfig\"\n            headerTitle=\"Entity Relationship Diagram\"\n            (entitySelected)=\"onERDEntitySelected($event)\"\n            (entityDeselected)=\"onEntityDeselected()\"\n            (openRecord)=\"onERDOpenRecord($event)\"\n            (stateChange)=\"onERDStateChange($event)\">\n          </mj-entity-erd>\n        </div>\n      </kendo-splitter-pane>\n\n      <!-- Entity Details Panel (Right) -->\n      <kendo-splitter-pane\n        [size]=\"selectedEntity ? '320px' : '0px'\"\n        [collapsible]=\"false\"\n        [resizable]=\"!!selectedEntity\"\n        [scrollable]=\"false\"\n        [hidden]=\"!selectedEntity\">\n        <mj-entity-details\n          [selectedEntity]=\"selectedEntity\"\n          [allEntityFields]=\"allEntityFields\"\n          [fieldsSectionExpanded]=\"fieldsSectionExpanded\"\n          [relationshipsSectionExpanded]=\"relationshipsSectionExpanded\"\n          (openEntity)=\"onEntityOpened($event)\"\n          (closePanel)=\"onEntityDeselected()\"\n          (fieldsSectionToggle)=\"onFieldsSectionToggle()\"\n          (relationshipsSectionToggle)=\"onRelationshipsSectionToggle()\"\n          (entitySelected)=\"onEntitySelected($event)\"\n          (openRecord)=\"onOpenRecord($event)\">\n        </mj-entity-details>\n      </kendo-splitter-pane>\n  </kendo-splitter>\n</div>\n", styles: [":host {\n  display: block;\n  height: 100%;\n  width: 100%;\n}\n\n.erd-composite {\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n}\n\n.main-splitter {\n  height: 100%;\n  width: 100%;\n}\n.main-splitter .k-pane {\n  overflow: hidden;\n}\n\n.erd-pane-container {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n\n.floating-details-panel {\n  position: absolute;\n  top: 50%;\n  right: 20px;\n  width: 380px;\n  max-height: calc(100% - 40px);\n  background: white;\n  border: 1px solid #ddd;\n  border-radius: 8px;\n  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);\n  z-index: 1000;\n  overflow: hidden;\n  transform: translateY(-50%);\n  animation: slideInFromRight 0.3s ease-out;\n}\n@media (max-width: 768px) {\n  .floating-details-panel {\n    right: 10px;\n    left: 10px;\n    width: auto;\n    max-width: none;\n  }\n}\n@media (max-height: 600px) {\n  .floating-details-panel {\n    top: 20px;\n    transform: none;\n    max-height: calc(100vh - 40px);\n  }\n}\n\n@keyframes slideInFromRight {\n  from {\n    transform: translateY(-50%) translateX(100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(-50%) translateX(0);\n    opacity: 1;\n  }\n}\n\n/* Entity Explorer Container */\n.explorer-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n}\n\n.explorer-header-bar {\n  display: flex;\n  align-items: center;\n  padding: 8px 16px;\n  background: #f8fafc;\n  border-bottom: 1px solid #e2e8f0;\n  flex-shrink: 0;\n}\n\n.back-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 16px;\n  background: #ffffff;\n  border: 1px solid #e2e8f0;\n  border-radius: 6px;\n  color: #64748b;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.back-btn:hover {\n  background: #f1f5f9;\n  border-color: #cbd5e1;\n  color: #1e293b;\n}\n\n.back-btn i {\n  font-size: 12px;\n}\n\n.explorer-container mj-entity-explorer {\n  flex: 1;\n  overflow: hidden;\n}\n"] }]
+    }], null, { mjEntityErd: [{
+            type: ViewChild,
+            args: [MJEntityERDComponent]
+        }], isRefreshingERD: [{
+            type: Input
+        }], focusEntities: [{
+            type: Input
+        }], showFilterPanel: [{
+            type: Input
+        }], depth: [{
+            type: Input
+        }], showHeader: [{
+            type: Input
+        }], stateChange: [{
+            type: Output
+        }], userStateChange: [{
+            type: Output
+        }], entityOpened: [{
+            type: Output
+        }], openRecord: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ERDCompositeComponent, { className: "ERDCompositeComponent", filePath: "src/lib/components/erd-composite/erd-composite.component.ts", lineNumber: 72 }); })();
+//# sourceMappingURL=erd-composite.component.js.map

package/dist/lib/components/erd-composite/erd-composite.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"erd-composite.component.js","sourceRoot":"","sources":["../../../../src/lib/components/erd-composite/erd-composite.component.ts","../../../../src/lib/components/erd-composite/erd-composite.component.html"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,YAAY,EAAqB,SAAS,EAAE,MAAM,eAAe,CAAC;AACrG,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAA+B,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;;;;;;AAoBlE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AAMH,MAAM,OAAO,qBAAqB;IACC,WAAW,CAAwB;IAEpE,+CAA+C;IACtC,eAAe,GAAG,KAAK,CAAC;IAEjC;;;;OAIG;IACM,aAAa,GAAwB,IAAI,CAAC;IAEnD;;;OAGG;IACM,eAAe,GAAG,IAAI,CAAC;IAEhC;;;OAGG;IACM,KAAK,GAAG,CAAC,CAAC;IAEnB;;OAEG;IACM,UAAU,GAAG,IAAI,CAAC;IAE3B,wCAAwC;IACjC,QAAQ,GAAiB,EAAE,CAAC;IAEnC,sDAAsD;IAC/C,eAAe,GAAsB,EAAE,CAAC;IAE/C,mDAAmD;IACzC,WAAW,GAAG,IAAI,YAAY,EAAqB,CAAC;IAE9D,6EAA6E;IACnE,eAAe,GAAG,IAAI,YAAY,EAAqB,CAAC;IAElE,+EAA+E;IACrE,YAAY,GAAG,IAAI,YAAY,EAAc,CAAC;IAExD,wEAAwE;IAC9D,UAAU,GAAG,IAAI,YAAY,EAA0C,CAAC;IAElF,qCAAqC;IAC9B,kBAAkB,GAAG,IAAI,CAAC;IAC1B,qBAAqB,GAAG,IAAI,CAAC;IAC7B,4BAA4B,GAAG,IAAI,CAAC;IAE3C,8DAA8D;IACvD,SAAS,GAAc,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC;IAEtD,eAAe;IACR,cAAc,GAAsB,IAAI,CAAC;IACzC,gBAAgB,GAAiB,EAAE,CAAC;IACpC,YAAY,GAAG,KAAK,CAAC;IAE5B,UAAU;IACH,OAAO,GAAiB;QAC7B,UAAU,EAAE,IAAI;QAChB,UAAU,EAAE,EAAE;QACd,YAAY,EAAE,IAAI;QAClB,SAAS,EAAE,EAAE;KACd,CAAC;IAEF,mBAAmB;IACX,kBAAkB,GAAG,IAAI,OAAO,EAAqB,CAAC;IACtD,sBAAsB,GAAG,IAAI,OAAO,EAAqB,CAAC;IAC1D,mBAAmB,GAAG,IAAI,OAAO,EAAQ,CAAC;IAElD,KAAK,CAAC,QAAQ;QACZ,oDAAoD;QACpD,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,eAAe,CAAC;QAE/C,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC;QAEtB,4DAA4D;QAC5D,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACxD,IAAI,CAAC,gBAAgB,GAAG,CAAC,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC;QAClD,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,gBAAgB,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;YAC3C,IAAI,CAAC,YAAY,EAAE,CAAC;QACtB,CAAC;QAED,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QAEzB,gEAAgE;QAChE,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAED,WAAW;QACT,IAAI,CAAC,kBAAkB,CAAC,QAAQ,EAAE,CAAC;QACnC,IAAI,CAAC,sBAAsB,CAAC,QAAQ,EAAE,CAAC;QACvC,IAAI,CAAC,mBAAmB,CAAC,QAAQ,EAAE,CAAC;IACtC,CAAC;IAEO,KAAK,CAAC,QAAQ;QACpB,2FAA2F;QAC3F,MAAM,EAAE,GAAG,IAAI,QAAQ,EAAE,CAAC;QAC1B,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC;QAE5B,uCAAuC;QACvC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,QAAQ;aACjC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;YACd,OAAO,MAAM,CAAC,MAAM,CAAC;QACvB,CAAC,CAAC;aACD,IAAI,EAAE,CAAC;IACZ,CAAC;IAEO,oBAAoB;QAC1B,yCAAyC;QACzC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAC1B,YAAY,CAAC,EAAE,CAAC,CACjB,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;YAClB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/B,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAC9B,YAAY,CAAC,IAAI,CAAC,CACnB,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE;YAClB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC,CAAC,CAAC;QAEH,iCAAiC;QACjC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAC3B,YAAY,CAAC,GAAG,CAAC,CAClB,CAAC,SAAS,CAAC,GAAG,EAAE;YACf,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,IAAI,CAAC,eAAe,EAAE,CAAC;YACvB,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAC7B,CAAC,CAAC,CAAC;IACL,CAAC;IAEM,cAAc;QACnB,IAAI,CAAC,mBAAmB,CAAC,IAAI,EAAE,CAAC;IAClC,CAAC;IAEM,eAAe,CAAC,UAAwB;QAC7C,IAAI,CAAC,OAAO,GAAG,EAAE,GAAG,UAAU,EAAE,CAAC;QACjC,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAEM,cAAc;QACnB,IAAI,CAAC,OAAO,GAAG;YACb,UAAU,EAAE,IAAI;YAChB,UAAU,EAAE,EAAE;YACd,YAAY,EAAE,IAAI;YAClB,SAAS,EAAE,EAAE;SACd,CAAC;QACF,IAAI,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAEM,mBAAmB;QACxB,IAAI,CAAC,kBAAkB,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC;QAEnD,kDAAkD;QAClD,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE,CAAC;QACnC,CAAC;QAED,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAEM,kBAAkB;QACvB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAE3B,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAEM,gBAAgB,CAAC,MAAkB;QACxC,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC;QAE7B,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAED;;;OAGG;IACI,mBAAmB,CAAC,KAA0B;QACnD,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC;QACnC,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAED;;;OAGG;IACI,eAAe,CAAC,KAA4B;QACjD,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;IACnF,CAAC;IAED;;OAEG;IACI,gBAAgB,CAAC,MAAgB;QACtC,4DAA4D;QAC5D,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAEM,cAAc,CAAC,MAAkB;QACtC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACjC,CAAC;IAEM,qBAAqB;QAC1B,IAAI,CAAC,qBAAqB,GAAG,CAAC,IAAI,CAAC,qBAAqB,CAAC;QACzD,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAEM,4BAA4B;QACjC,IAAI,CAAC,4BAA4B,GAAG,CAAC,IAAI,CAAC,4BAA4B,CAAC;QACvE,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAEM,YAAY,CAAC,KAA6C;QAC/D,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC;IAEM,sBAAsB,CAAC,MAAe;QAC3C,0DAA0D;QAC1D,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE,CAAC;QACnC,CAAC;QAED,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAEO,YAAY;QAClB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE;YACpD,gBAAgB;YAChB,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,IAAI,MAAM,CAAC,UAAU,KAAK,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;gBAC7E,OAAO,KAAK,CAAC;YACf,CAAC;YAED,qBAAqB;YACrB,IAAI,IAAI,CAAC,OAAO,CAAC,UAAU,EAAE,CAAC;gBAC5B,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC;gBACzD,MAAM,UAAU,GAAG,CAAC,MAAM,CAAC,IAAI,IAAI,MAAM,CAAC,UAAU,IAAI,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;gBAC1E,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;oBACrC,OAAO,KAAK,CAAC;gBACf,CAAC;YACH,CAAC;YAED,oBAAoB;YACpB,IAAI,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE,CAAC;gBAC3B,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,WAAW,EAAE,CAAC;gBACxD,MAAM,SAAS,GAAG,CAAC,MAAM,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;gBACzD,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;oBACpC,OAAO,KAAK,CAAC;gBACf,CAAC;YACH,CAAC;YAED,gBAAgB;YAChB,IAAI,IAAI,CAAC,OAAO,CAAC,YAAY,IAAI,MAAM,CAAC,MAAM,KAAK,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,CAAC;gBAC7E,OAAO,KAAK,CAAC;YACf,CAAC;YAED,OAAO,IAAI,CAAC;QACd,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,eAAe;QACrB,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAChC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACtC,CAAC;IAEO,mBAAmB;QACzB,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAChC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC1C,CAAC;IAEO,UAAU;QAChB,OAAO;YACL,kBAAkB,EAAE,IAAI,CAAC,kBAAkB;YAC3C,gBAAgB,EAAE,GAAG;YACrB,OAAO,EAAE,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE;YAC5B,gBAAgB,EAAE,IAAI,CAAC,cAAc,EAAE,EAAE,IAAI,IAAI;YACjD,SAAS,EAAE,CAAC;YACZ,WAAW,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;YAC3B,qBAAqB,EAAE,IAAI,CAAC,qBAAqB;YACjD,4BAA4B,EAAE,IAAI,CAAC,4BAA4B;SAChE,CAAC;IACJ,CAAC;IAED,+EAA+E;IAC/E,aAAa;IACb,+EAA+E;IAE/E;;;OAGG;IACI,aAAa,CAAC,KAAiC;QACpD,IAAI,KAAK,CAAC,kBAAkB,KAAK,SAAS,EAAE,CAAC;YAC3C,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC,kBAAkB,CAAC;QACrD,CAAC;QACD,IAAI,KAAK,CAAC,OAAO,EAAE,CAAC;YAClB,IAAI,CAAC,OAAO,GAAG,EAAE,GAAG,KAAK,CAAC,OAAO,EAAE,CAAC;QACtC,CAAC;QACD,IAAI,KAAK,CAAC,qBAAqB,KAAK,SAAS,EAAE,CAAC;YAC9C,IAAI,CAAC,qBAAqB,GAAG,KAAK,CAAC,qBAAqB,CAAC;QAC3D,CAAC;QACD,IAAI,KAAK,CAAC,4BAA4B,KAAK,SAAS,EAAE,CAAC;YACrD,IAAI,CAAC,4BAA4B,GAAG,KAAK,CAAC,4BAA4B,CAAC;QACzE,CAAC;QACD,IAAI,KAAK,CAAC,gBAAgB,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACvD,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,CAAC,gBAAgB,CAAC,CAAC;YACxE,IAAI,MAAM,EAAE,CAAC;gBACX,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC;YAC/B,CAAC;QACH,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC7B,CAAC;QAED,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAED;;OAEG;IACI,UAAU;QACf,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,CAAC;QAC7B,CAAC;IACH,CAAC;IAED;;OAEG;IACI,QAAQ;QACb,OAAO,IAAI,CAAC,UAAU,EAAE,CAAC;IAC3B,CAAC;+EArVU,qBAAqB;6DAArB,qBAAqB;2BACrB,oBAAoB;;;;;YCvE/B,AADF,8BAA2B,wBAI2B;YAAhD,8HAAgB,kCAA8B,IAAC;YAS7C,AANF,8CAKiC,gCAQQ;YAArC,AADA,AADA,AADA,wIAAiB,2BAAuB,IAAC,mHACzB,oBAAgB,IAAC,mHACjB,oBAAgB,IAAC,+GACnB,yBAAqB,IAAC;YAExC,AADE,iBAAyB,EACL;YAOlB,AADF,AAHF,8CAEuB,aACW,uBAea;YAAzC,AADA,AADA,AADA,iIAAkB,+BAA2B,IAAC,kHAC1B,wBAAoB,IAAC,4GAC3B,2BAAuB,IAAC,8GACvB,4BAAwB,IAAC;YAG9C,AADE,AADE,iBAAgB,EACZ,EACc;YASpB,AANF,8CAK6B,2BAWW;YAApC,AADA,AADA,AADA,AADA,AADA,6HAAc,0BAAsB,IAAC,0GACvB,wBAAoB,IAAC,4HACZ,2BAAuB,IAAC,0IACjB,kCAA8B,IAAC,wHAC3C,4BAAwB,IAAC,gHAC7B,wBAAoB,IAAC;YAI7C,AADE,AADI,AADE,iBAAoB,EACA,EACT,EACb;;YA7DE,eAA6C;YAI7C,AADA,AADA,AADA,AADA,+DAA6C,sBACxB,qCACW,qBACZ,mCACU;YAE5B,cAAqB;YAErB,AADA,AADA,uCAAqB,0CACgB,wBAClB;YAUrB,cAAkB;YAClB,AADA,gCAAkB,qBACE;YAGhB,eAA6B;YAQ7B,AADA,AADA,AADA,AADA,AADA,AADA,AADA,AADA,+CAA6B,6BACL,yFACuB,qCACf,oBACjB,yBACS,yBACA,8BACC,yBACL;YAYxB,cAAyC;YAIzC,AADA,AADA,AADA,AADA,2DAAyC,sBACpB,mCACS,qBACV,+BACM;YAExB,cAAiC;YAGjC,AADA,AADA,AADA,mDAAiC,wCACE,oDACY,kEACc;;;iFDY1D,qBAAqB;cALjC,SAAS;2BACE,kBAAkB;gBAKK,WAAW;kBAA3C,SAAS;mBAAC,oBAAoB;YAGtB,eAAe;kBAAvB,KAAK;YAOG,aAAa;kBAArB,KAAK;YAMG,eAAe;kBAAvB,KAAK;YAMG,KAAK;kBAAb,KAAK;YAKG,UAAU;kBAAlB,KAAK;YASI,WAAW;kBAApB,MAAM;YAGG,eAAe;kBAAxB,MAAM;YAGG,YAAY;kBAArB,MAAM;YAGG,UAAU;kBAAnB,MAAM;;kFA9CI,qBAAqB"}