import { EventEmitter, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';
import { ComponentSpec } from '@memberjunction/interactive-component-types';
import { FormHostProps, FormMode } from '@memberjunction/interactive-component-types/forms';
import { ReactComponentEvent, MJReactComponent } from '@memberjunction/ng-react';
import { CompositeKey } from '@memberjunction/core';
import { ComponentStudioStateService, ComponentError } from '../../services/component-studio-state.service';
import * as i0 from "@angular/core";
/**
 * Viewport size preset for the component preview
 */
export type ViewportSize = 'mobile' | 'tablet' | 'desktop';
interface ViewportPreset {
    Size: ViewportSize;
    Label: string;
    Icon: string;
    MaxWidth: string;
}
/**
 * Component Preview - TOP section of CENTER panel.
 * Renders the live React component preview with toolbar controls.
 */
export declare class ComponentPreviewComponent implements OnInit, OnDestroy {
    State: ComponentStudioStateService;
    private cdr;
    ReactComponentRef?: MJReactComponent;
    AskAIToFix: EventEmitter<ComponentError>;
    ActiveViewport: ViewportSize;
    readonly ViewportPresets: ViewportPreset[];
    LocalComponentSpec: ComponentSpec | null;
    /** Recent records of the target entity for the optional real-record picker. */
    RecentRecords: Array<{
        ID: string;
        Display: string;
    }>;
    SelectedRecordID: string | null;
    /** When a real record is loaded, this holds its fields keyed by name. */
    LoadedRecordValues: Record<string, unknown> | null;
    IsLoadingRecord: boolean;
    /** Last 20 events emitted by the previewed component, newest first. */
    EventLog: Array<{
        Timestamp: Date;
        Type: string;
        Payload: string;
    }>;
    private destroy$;
    private lastLoadedEntity;
    constructor(State: ComponentStudioStateService, cdr: ChangeDetectorRef);
    ngOnInit(): void;
    ngOnDestroy(): void;
    RunSelectedComponent(): void;
    StopComponent(): void;
    RefreshComponent(): void;
    SetViewport(size: ViewportSize): void;
    SendErrorToAI(): void;
    GetActivePreset(): ViewportPreset;
    GetPreviewContainerMaxWidth(): string;
    OnComponentEvent(event: ReactComponentEvent): void;
    /** True when the current spec is form-role (drives the sandbox UI). */
    get IsFormRolePreview(): boolean;
    /** Convenience for the template — the entity name the form binds to. */
    get FormTargetEntity(): string | null;
    /** Selected preview mode (delegates to the shared state). */
    get FormPreviewMode(): FormMode;
    SetFormPreviewMode(mode: FormMode): void;
    /** Add an entry to the event log; keep the log bounded to 20 entries. */
    private logEvent;
    private summarisePayload;
    ClearEventLog(): void;
    /**
     * Load the top 10 most-recent records for the target entity so the
     * preview can swap from fixture to real-record mode. Re-runs whenever
     * the target entity changes; quiet no-op if entity isn't set yet.
     */
    private maybeRefreshRecentRecords;
    /**
     * Load a real record for preview. We pull the full entity object then
     * extract its field values into a plain object for FormHostProps.
     * Sandboxed — any BeforeSave/BeforeDelete events emitted by the previewed
     * component are logged, never applied.
     */
    OnPickRecord(event: Event): Promise<void>;
    /**
     * Fires once the React bridge has resolved the full component hierarchy from the
     * registry. The bridge stores the resolved spec (with real dependency code, not
     * registry-reference stubs) on its public `resolvedComponentSpec` field — pull it
     * across so the code-editor tabs can render actual source instead of "No code available".
     */
    OnReactInitialized(): void;
    OnOpenEntityRecord(event: {
        entityName: string;
        key: CompositeKey;
    }): void;
    GetComponentName(): string;
    GetComponentDescription(): string | undefined;
    private syncSpecFromState;
    /**
     * Fixture `FormHostProps` for form-role component previews. Built from
     * the curated schema of `State.FormTargetEntityName` — the entity the
     * user picked in the Field Binding Inspector. Returns an empty object
     * when (a) the current spec isn't a form, (b) no target entity is
     * selected, or (c) the entity isn't registered with the provider — in
     * which case the previewed component sees `record === undefined` and
     * should handle that gracefully (the Studio skeleton does).
     *
     * The mode toggles to 'edit' so authors can see how inputs render
     * without manually flipping mode each refresh.
     */
    get FixtureFormHostProps(): Partial<FormHostProps> | object;
    /**
     * Refresh the preview by nulling the spec, detecting changes,
     * then restoring the spec after a short delay. The bridge's own
     * `initializeComponent` purges the runtime registry + manager fetch cache
     * for the new spec's keys, so consumers don't need to clear anything here.
     */
    private refreshPreview;
    static ɵfac: i0.ɵɵFactoryDeclaration<ComponentPreviewComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<ComponentPreviewComponent, "mj-component-preview", never, {}, { "AskAIToFix": "AskAIToFix"; }, never, never, false, never>;
}
export {};
//# sourceMappingURL=component-preview.component.d.ts.map