Member Junction
    Preparing search index...

    Class ComponentArtifactViewerComponent

    Viewer component for interactive Component artifacts (React-based UI components)

    Features:

    • Live component preview with React rendering
    • Dynamic tabs for component metadata (via GetAdditionalTabs)
    • Provides tabs for: Code, Functional Requirements, Technical Design, Data Requirements

    Hierarchy (View Summary)

    Implements

    • OnInit
    • AfterViewInit
    • OnChanges
    Index

    Constructors

    constructor

    Properties

    applyFormRequested artifactVersion component componentCode componentName cssClass? errorDetails errorMessage formEntityInfo formInitError formRecord formRecordIsReal formRecordLabel hasError height? interactiveForm? isFormArtifact navigationRequest? openEntityRecord permissionResult Provider reactComponent? readonly recordSearchResults recordSearchTerm ShowFeedbackPanel showRecordPicker tabsChanged ɵdir ɵfac

    Accessors

    hasDisplayContent isPermissionBlocked isShowingElevatedDisplay parentShouldShowRawContent ProviderToUse resolvedComponentSpec RunQueryToUse RunReportToUse RunViewToUse SupportsFeedback

    Methods

    AskUserForFeedback GetAdditionalTabs getContent GetCurrentStateSnapshot getDescription getDisplayName getDisplayTitle getRawContent GetStandardTabRemovals ngAfterViewInit ngOnChanges ngOnInit onApplyClicked onComponentEvent onOpenEntityRecord onPickerSearchInput onPickerSelect onReactComponentInitialized parseJsonContent triggerBrowserDownload

    Constructors

    Properties

    applyFormRequested: EventEmitter<{ entityName: string; spec: ComponentSpec }> = ...

    Emitted when the user clicks "Apply to my form" on a form-role artifact. Carries the spec (ready to hand to the agent's Create/Modify action) and the entity name. The host is responsible for confirming + invoking the actual server action.

    artifactVersion: MJArtifactVersionEntity

    The artifact version to display

    component: ComponentSpec | null = null
    componentCode: string = ""
    componentName: string = ''
    cssClass?: string

    Optional: Additional CSS classes to apply

    errorDetails: string = ''
    errorMessage: string = ''
    formEntityInfo: EntityInfo | null = null

    Entity the form targets — resolved from spec.entityName / dataRequirements.

    formInitError: string | null = null
    formRecord: BaseEntity<unknown> | null = null

    The real or fixture record currently bound to the form preview.

    formRecordIsReal: boolean = false

    True iff formRecord is a real DB row (vs a fixture NewRecord()).

    formRecordLabel: string = ''

    Label for the chip (e.g. the record's Name field).

    hasError: boolean = false
    height?: string

    Optional: Custom height for the viewer (defaults to auto)

    interactiveForm?: InteractiveFormComponent
    isFormArtifact: boolean = false

    True when this artifact's spec declares componentRole: 'form'.

    navigationRequest?: EventEmitter<NavigationRequest>

    Optional: Emitted when the plugin wants to navigate to a different app/nav item. Plugins that need app-level navigation (e.g., "Open Query" navigating to the Data Explorer's Queries nav item) should instantiate this emitter and emit a NavigationRequest. The event bubbles up through the artifact viewer chain to the host application where NavigationService handles the actual navigation.

    openEntityRecord: EventEmitter<
        { compositeKey: CompositeKey; entityName: string },
    > = ...
    permissionResult: PermissionEvaluationResult | null = null
    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.

    reactComponent?: MJReactComponent
    readonly: boolean = true

    Optional: Whether the viewer is in readonly mode

    recordSearchResults: { ID: string; Label: string }[] = []
    recordSearchTerm: string = ''
    ShowFeedbackPanel: boolean = false
    showRecordPicker: boolean = false

    Picker UI state.

    tabsChanged: EventEmitter<void> = ...

    Optional: Emitted when the plugin's additional tabs change after async loading. Plugins that load data asynchronously (e.g., from a component registry) should emit this when loading completes and new tabs become available. The parent panel listens for this to re-run change detection and render the updated tab list.

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

    Accessors

    • get hasDisplayContent(): boolean

      Whether this plugin has content to display in the Display tab. Returns true only if the component has code that can be rendered.

      IMPORTANT: Uses this.component (synchronously loaded from artifact JSON) instead of resolvedComponentSpec (which depends on async React loading). This ensures hasDisplayContent returns correct value immediately when pluginLoaded fires, before React component finishes loading.

      Returns boolean

    • get isShowingElevatedDisplay(): boolean

      Whether this plugin is showing an "elevated" display (e.g., extracted markdown/HTML) vs raw content. When true and content type is JSON, the wrapper will show a JSON tab.

      Subclasses should override this getter to return the appropriate value based on their current display state. For example, JSON plugin returns true when showing displayMarkdown or displayHtml, false when showing raw JSON editor.

      Default: false (showing raw content)

      Returns boolean

    • get parentShouldShowRawContent(): boolean

      Whether the parent wrapper should show a raw content tab (e.g., JSON tab for JSON content). This gives plugins fine-grained control over the parent's tab display.

      Use cases:

      • JSON plugin with extract rules: true (show JSON tab to view source)
      • Component plugin: true (show JSON tab even when displaying elevated component)
      • Code plugin: false (already showing raw content)

      Subclasses can override this to control parent behavior. Default: true (parent should show raw content tab if applicable)

      Returns boolean

    • 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 data-bound properties if at least one has changed, and before the view and content children are checked.

      Parameters

      • changes: { [propName: string]: SimpleChange<any> }

        The changed properties.

      Returns Promise<void>

    • Component initialization. Note: loadComponentSpec() is called in ngOnChanges which runs before ngOnInit, ensuring tabs are available when pluginLoaded fires. The async adapter initialization happens here and doesn't block tab availability.

      Returns Promise<void>

    • Bubble Apply intent up to the host (Form Builder dashboard / Sage chat).

      Resolves the full ComponentSpec (with code) from multiple sources:

      1. resolvedComponentSpec — live React bridge or cached copy (best for non-form artifacts)
      2. Re-parse artifact version Content — the agent stores the full spec including code
      3. DB fallback — fetch from MJ: Components by name

      Source #2 covers the common form-artifact case where the React component lives inside and resolvedComponentSpec falls back to the stripped local spec.

      Returns Promise<void>

    • Called when MJReactComponent finishes loading the full component spec from the registry. The full spec may contain Functional, Technical, and Data tabs not in the stripped spec. Caches the resolved spec so it survives DOM destruction (e.g., if the component fails to render and is removed by the @if/else block). Emits tabsChanged so the parent panel re-evaluates allTabs and renders the new tab labels.

      Returns void

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Accessors
    Methods