Member Junction
    Preparing search index...

    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)
    <mj-erd-composite
    (stateChange)="onStateChange($event)"
    (userStateChange)="saveUserPreferences($event)"
    (openRecord)="navigateToRecord($event)">
    </mj-erd-composite>

    The component emits userStateChange events (debounced 1s) when user changes any settings. The parent should save this state and restore it using loadUserState():

    @ViewChild(ERDCompositeComponent) erdComposite!: ERDCompositeComponent;

    ngAfterViewInit() {
    const savedState = await this.loadSavedState();
    if (savedState) {
    this.erdComposite.loadUserState(savedState);
    }
    }

    onUserStateChange(state: ERDCompositeState) {
    await this.saveState(state);
    }

    Hierarchy (View Summary)

    Implements

    • OnInit
    • OnDestroy
    Index

    Constructors

    Properties

    allEntityFields: EntityFieldInfo[] = []

    All entity fields (flattened from all entities)

    depth: number = 1

    Depth of relationships to display. 1 = only direct relationships, 2 = relationships of relationships, etc.

    entities: EntityInfo[] = []

    All entities loaded from metadata

    entityOpened: EventEmitter<EntityInfo> = ...

    Emitted when an entity is opened (e.g., double-clicked in details panel)

    erdConfig: ERDConfig = ...

    ERD configuration - skip animation for faster rendering

    fieldsSectionExpanded: boolean = true
    filteredEntities: EntityInfo[] = []
    filterPanelVisible: boolean = true
    filters: EntityFilter = ...
    focusEntities: EntityInfo[] | null = null

    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.

    isDataLoaded: boolean = false
    isRefreshingERD: boolean = false

    Whether the ERD is in a refreshing state

    openRecord: EventEmitter<{ EntityName: string; RecordID: string }> = ...

    Emitted when requesting to open an entity record (for navigation)

    Provider: IMetadataProvider | null

    If specified, this provider will be used for communication and for all metadata purposes. By default, if not provided, the Metadata and RunView classes are used for this and the default GraphQLDataProvider is used which is connected to the same back-end MJAPI instance as the Metadata and RunView classes. If you want to have this component connect to a different MJAPI back-end, create an instance of a ProviderBase sub-class like GraphQLDataProvider/etc, and configure it as appropriate to connect to the MJAPI back-end you want to use, and then pass it in here.

    relationshipsSectionExpanded: boolean = true
    selectedEntity: EntityInfo | null = null
    showFilterPanel: boolean = true

    Whether to show the filter panel on the left. Set to false for focused/single-entity views.

    showHeader: boolean = true

    Whether to show the ERD header bar.

    stateChange: EventEmitter<ERDCompositeState> = ...

    Emitted on any state change (debounced 50ms)

    userStateChange: EventEmitter<ERDCompositeState> = ...

    Emitted on user-initiated state changes (debounced 1s) for persistence

    "ɵdir": unknown
    "ɵfac": unknown

    Accessors

    • get ProviderToUse(): IMetadataProvider

      Returns either the default Metadata provider or the one specified in the Provider property, if it was specified

      Returns IMetadataProvider

    • get RunQueryToUse(): IRunQueryProvider

      Returns either the default RunQuery provider or the one specified in the Provider property, if it was specified

      Returns IRunQueryProvider

    • get RunReportToUse(): IRunReportProvider

      Returns either the default RunReport provider or the one specified in the Provider property, if it was specified

      Returns IRunReportProvider

    • get RunViewToUse(): IRunViewProvider

      Returns either the default RunView provider or the one specified in the Provider property, if it was specified

      Returns IRunViewProvider

    Methods

    • A callback method that is invoked immediately after the default change detector has checked the directive's data-bound properties for the first time, and before any of the view or content children have been checked. It is invoked only once when the directive is instantiated.

      Returns Promise<void>