@metadev/daga-angular/index.d.ts

Diagramming engine for editing models on the Web. Made by Metadev.

import { Side, DiagramButtons, Canvas, Corner, DiagramActions, DiagramConfig, Palette, PaletteSectionConfig, PropertyEditor, ValueSet, DiagramEditor, DagaModel, DiagramEvent, DiagramError, Type, Property } from '@metadev/daga';
export { ACTION_STACK_SIZE, ActionStack, AddConnectionAction, AddNodeAction, AdjacencyLayout, ApplyLayoutAction, BreadthAdjacencyLayout, BreadthLayout, ButtonsComponentConfig, Canvas, CanvasConfig, ClosedShape, CollabAction, CollabActionSerialized, CollabClient, CollabTimestamp, CollabTimestampSet, ComponentsConfig, ConnectionLook, ConnectionLookConfig, ConnectionTemplateConfig, ConnectionTypeConfig, Corner, DagaExporter, DagaImporter, DagaModel, DiagramAction, DiagramActionMethod, DiagramActions, DiagramButtons, DiagramCanvas, DiagramConfig, DiagramConnection, DiagramConnectionSet, DiagramConnectionType, DiagramDecorator, DiagramDecoratorSet, DiagramDoubleClickEvent, DiagramEditor, DiagramElement, DiagramElementSet, DiagramEntity, DiagramEntitySet, DiagramError, DiagramEvent, DiagramEvents, DiagramField, DiagramFieldSet, DiagramHighlightedEvent, DiagramLayout, DiagramModel, DiagramModelExporter, DiagramModelImporter, DiagramNode, DiagramNodeGeometry, DiagramNodeSet, DiagramNodeType, DiagramObject, DiagramObjectSet, DiagramPort, DiagramPortSet, DiagramPortType, DiagramSecondaryClickEvent, DiagramSection, DiagramSectionGeometry, DiagramSectionSet, DiagramSelectionEvent, DiagramValidator, EditFieldAction, ErrorsComponentConfig, FieldConfig, ForceLayout, GridConfig, GridStyle, HorizontalAlign, HorizontalLayout, ImageLook, ImageLookConfig, Line, LineShape, LineStyle, Look, LookConfig, MarkerImageLook, MarkerImageLookConfig, MoveAction, NodeTemplateConfig, NodeTypeConfig, Palette, PaletteComponentConfig, PaletteSectionConfig, PasteAction, Point, PortConfig, PortTypeConfig, PriorityLayout, Property, PropertyEditor, PropertyEditorComponentConfig, PropertySet, Rectangle, RemoveAction, SectionConfig, SectionGridConfig, SetGeometryAction, SetParentAction, ShapedLook, ShapedLookConfig, Side, StretchableImageLook, StretchableImageLookConfig, TreeLayout, Type, UpdateValuesAction, UserActionConfig, ValueSet, VerticalAlign, VerticalLayout, getLocationsOfNodes, layouts } from '@metadev/daga';
import * as i0 from '@angular/core';
import { ElementRef, OnInit, AfterViewInit, OnDestroy, EventEmitter } from '@angular/core';
import * as rxjs from 'rxjs';
import { Observable } from 'rxjs';
import * as d3 from 'd3';
import * as i10 from '@angular/common';
import * as i11 from '@angular/forms';

/**
 * Button used to collapse components that implement it.
 * @private
 */
declare class CollapseButtonComponent {
    collapsableSelector: string | ElementRef | HTMLElement;
    collapsableAdditionalSelector: string;
    collapsed: boolean;
    disabled: boolean;
    direction: Side;
    rule: string;
    collapsedValue: string;
    visibleValue: string;
    Side: typeof Side;
    toggleCollapse(): void;
    getClass(): string;
    static ɵfac: i0.ɵɵFactoryDeclaration<CollapseButtonComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<CollapseButtonComponent, "daga-collapse-button", never, { "collapsableSelector": { "alias": "collapsableSelector"; "required": false; }; "collapsableAdditionalSelector": { "alias": "collapsableAdditionalSelector"; "required": false; }; "collapsed": { "alias": "collapsed"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "rule": { "alias": "rule"; "required": false; }; "collapsedValue": { "alias": "collapsedValue"; "required": false; }; "visibleValue": { "alias": "visibleValue"; "required": false; }; }, {}, never, never, true, never>;
}

/**
 * Buttons used to trigger diagram functionalities by the user.
 * @private
 */
declare class DiagramButtonsComponent implements DiagramButtons, OnInit, AfterViewInit, OnDestroy {
    #private;
    get canvas(): Canvas;
    collapsableButtons: ElementRef<HTMLDivElement>;
    location: Corner;
    direction: Side;
    enableAction: boolean;
    enableFilter: boolean;
    enableLayout: boolean;
    enableSelection: boolean;
    enableZoom: boolean;
    filterOn: boolean;
    collapsed: boolean;
    animationOngoing: boolean;
    private sizeAttribute;
    private transformFunction;
    private transformOrigin;
    private marginSide;
    private collapsableButtonsSize;
    private sub?;
    DiagramActions: typeof DiagramActions;
    ngOnInit(): void;
    ngAfterViewInit(): void;
    ngOnDestroy(): void;
    init(config: DiagramConfig): void;
    recalculateSizeOfButtons(): void;
    toggleCollapse(): Promise<void>;
    zoomIn(): void;
    zoomOut(): void;
    center(): void;
    layout(): void;
    filter(): void;
    undo(): void;
    redo(): void;
    copySelection(): void;
    cutSelection(): void;
    pasteSelection(): void;
    deleteSelection(): void;
    startMultipleSelection(): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<DiagramButtonsComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<DiagramButtonsComponent, "daga-diagram-buttons", never, { "location": { "alias": "location"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "enableAction": { "alias": "enableAction"; "required": false; }; "enableFilter": { "alias": "enableFilter"; "required": false; }; "enableLayout": { "alias": "enableLayout"; "required": false; }; "enableSelection": { "alias": "enableSelection"; "required": false; }; "enableZoom": { "alias": "enableZoom"; "required": false; }; }, {}, never, never, true, never>;
}

/**
 * Palette that the user can drag and drop nodes from.
 * @private
 * @see DiagramConfig
 * @see DiagramNode
 */
declare class PaletteComponent implements Palette, OnInit, AfterViewInit, OnDestroy {
    #private;
    get canvas(): Canvas;
    panel: ElementRef<HTMLDivElement>;
    palettes: PaletteSectionConfig[];
    currentPalette: PaletteSectionConfig;
    currentCategory: string;
    location: Corner;
    direction: Side;
    width: string;
    gap: string;
    private priorityThreshold?;
    private sub?;
    ngOnInit(): void;
    ngAfterViewInit(): void;
    ngOnDestroy(): void;
    init(config: DiagramConfig): void;
    refreshPalette(): void;
    switchPalette(palette: PaletteSectionConfig): void;
    selectPanel(): d3.Selection<HTMLDivElement, unknown, null, undefined>;
    selectPalette(): d3.Selection<HTMLDivElement, unknown, null, undefined>;
    private appendCategories;
    private appendTemplate;
    private appendNodeTemplate;
    private appendConnectionTemplate;
    static ɵfac: i0.ɵɵFactoryDeclaration<PaletteComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<PaletteComponent, "daga-palette", never, { "palettes": { "alias": "palettes"; "required": false; }; "currentPalette": { "alias": "currentPalette"; "required": false; }; "currentCategory": { "alias": "currentCategory"; "required": false; }; "location": { "alias": "location"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "width": { "alias": "width"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; }, {}, never, never, true, never>;
}

/**
 * Editor of the values of a value set.
 * @private
 * @see ValueSet
 */
declare class PropertyEditorComponent implements PropertyEditor, OnInit, AfterViewInit, OnDestroy {
    #private;
    panel: ElementRef<HTMLDivElement>;
    location: Corner;
    direction: Side;
    width: string;
    title?: string;
    _valueSet: ValueSet | undefined;
    get valueSet(): ValueSet | undefined;
    set valueSet(valueSet: ValueSet | undefined);
    settings?: boolean;
    private sub?;
    ngOnInit(): void;
    ngAfterViewInit(): void;
    ngOnDestroy(): void;
    init(config: DiagramConfig): void;
    setPanelWidth(): void;
    selectPanel(): d3.Selection<HTMLDivElement, unknown, null, undefined>;
    highlightProperty(...propertyNames: string[]): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<PropertyEditorComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<PropertyEditorComponent, "daga-property-editor", never, { "valueSet": { "alias": "valueSet"; "required": false; }; }, {}, never, never, true, never>;
}

/**
 * The context of a diagram. Every separate diagram must be contained within its own {@link DiagramComponent} and every {@link DiagramComponent} must contain its own {@link DiagramEditorComponent}.
 * This component defines a {@link DagaConfigurationService} and a {@link CanvasProviderService}, which is shared by all the components within and allows accessing the configuration and the canvas of this component's diagram, respectively.
 * @public
 */
declare class DiagramComponent implements DiagramEditor, OnInit, AfterViewInit, OnDestroy {
    #private;
    appendTo: ElementRef<HTMLDivElement>;
    diagramButtons: DiagramButtonsComponent;
    palette: PaletteComponent;
    propertyEditor: PropertyEditorComponent;
    private importer;
    private exporter;
    private _model;
    /**
     * Getter for the configuration of this diagram.
     * @public
     */
    get config(): DiagramConfig;
    /**
     * Setter for the configuration for the diagram.
     * @public
     */
    set config(config: DiagramConfig);
    /**
     * Subject used to track when the diagram configuration has been updated.
     * @public
     */
    get config$(): Observable<DiagramConfig>;
    /**
     * Getter for the canvas of this diagram.
     * @public
     */
    get canvas(): Canvas;
    /**
     * Subject used to track when the canvas has been updated.
     * @public
     */
    get canvas$(): Observable<Canvas>;
    /**
     * Subject used to track when the view has been initialized after updating the canvas.
     * @public
     */
    get viewInitialized$(): Observable<Canvas>;
    /**
     * Serialized model for the diagram. Used for data binding to the model.
     * @public
     */
    get model(): DagaModel;
    /**
     * Serialized model for the diagram. Used for data binding to the model.
     * @public
     */
    set model(model: DagaModel);
    /**
     * Output for changes to the diagram's model.
     * @public
     */
    modelChange: EventEmitter<DagaModel>;
    /**
     * Output for user events on the diagram.
     * @public
     */
    diagramEvent: EventEmitter<DiagramEvent>;
    private configurationSub?;
    private canvasSub?;
    Corner: typeof Corner;
    Side: typeof Side;
    ngOnInit(): void;
    ngAfterViewInit(): void;
    ngOnDestroy(): void;
    private setUpCanvas;
    static ɵfac: i0.ɵɵFactoryDeclaration<DiagramComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<DiagramComponent, "daga-diagram", never, { "config": { "alias": "config"; "required": false; }; "model": { "alias": "model"; "required": false; }; }, { "modelChange": "modelChange"; "diagramEvent": "diagramEvent"; }, never, ["*"], true, never>;
}

/**
 * Displays the errors detected by a diagram's validators.
 * @private
 * @see DiagramValidator
 */
declare class ErrorsComponent implements AfterViewInit, OnDestroy {
    #private;
    get canvas(): Canvas;
    errorsContainer: ElementRef<HTMLDivElement>;
    errors: DiagramError[];
    private canvasSub?;
    private validationSub?;
    Side: typeof Side;
    ngAfterViewInit(): void;
    ngOnDestroy(): void;
    selectPanel(): d3.Selection<d3.BaseType, unknown, null, unknown>;
    private updateCanvas;
    validate(): void;
    showError(error: DiagramError): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<ErrorsComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<ErrorsComponent, "daga-errors", never, {}, {}, never, never, true, never>;
}

/**
 * Editor of a value set within a property editor.
 * @private
 * @see PropertyEditor
 * @see ValueSet
 */
declare class ObjectEditorComponent {
    #private;
    get canvas(): Canvas;
    get userCanEdit(): boolean;
    _valueSet?: ValueSet;
    get valueSet(): ValueSet | undefined;
    set valueSet(valueSet: ValueSet | undefined);
    /** How many object-editor elements are parents of this object-editor element. @private */
    depth: number;
    Type: typeof Type;
    getStyleClassName: (s: string) => string;
    setValue(property: Property, value: unknown): void;
    dateToLocalDatetimeString(date: string | number | Date | null | undefined): string;
    localDatetimeStringToDate(string: string): Date;
    static ɵfac: i0.ɵɵFactoryDeclaration<ObjectEditorComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<ObjectEditorComponent, "daga-object-editor", never, { "valueSet": { "alias": "valueSet"; "required": false; }; "depth": { "alias": "depth"; "required": false; }; }, {}, never, never, true, never>;
}

/**
 * Editor of a property of text list type within a property editor.
 * @private
 * @see Type.TextList
 * @see PropertyEditor
 * @see ValueSet
 */
declare class TextListEditorComponent {
    #private;
    private _value;
    set value(value: string[]);
    get value(): string[];
    valueInput: string;
    allowRepeats: boolean;
    disabled: boolean;
    valueChange: EventEmitter<string[]>;
    getValueFromEvent(event: Event): string;
    hasValue(value: string): boolean;
    removeFromValue(index: number): void;
    editFromValue(item: string, index: number): void;
    addToValue(): void;
    clearInput(): void;
    onKeyUp(event: KeyboardEvent): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<TextListEditorComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<TextListEditorComponent, "daga-text-list-editor", never, { "value": { "alias": "value"; "required": false; }; "valueInput": { "alias": "valueInput"; "required": false; }; "allowRepeats": { "alias": "allowRepeats"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
}

/**
 * Editor of a property of text map type within a property editor.
 * @private
 * @see Type.TextMap
 * @see PropertyEditor
 * @see ValueSet
 */
declare class TextMapEditorComponent {
    #private;
    private _value;
    set value(value: {
        [name: string]: string;
    });
    get value(): {
        [name: string]: string;
    };
    keyInput: string;
    valueInput: string;
    disabled: boolean;
    valueChange: EventEmitter<{
        [name: string]: string;
    }>;
    getValueFromEvent(event: Event): string;
    removeFromValue(key: string): void;
    editKey(oldKey: string, newKey: string): void;
    editValue(key: string, value: string): void;
    addToValue(): void;
    clearKeyInput(): void;
    clearValueInput(): void;
    onKeyUp(event: KeyboardEvent): void;
    static ɵfac: i0.ɵɵFactoryDeclaration<TextMapEditorComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<TextMapEditorComponent, "daga-text-map-editor", never, { "value": { "alias": "value"; "required": false; }; "keyInput": { "alias": "keyInput"; "required": false; }; "valueInput": { "alias": "valueInput"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
}

declare class DagaModule {
    static ɵfac: i0.ɵɵFactoryDeclaration<DagaModule, never>;
    static ɵmod: i0.ɵɵNgModuleDeclaration<DagaModule, never, [typeof CollapseButtonComponent, typeof DiagramButtonsComponent, typeof DiagramComponent, typeof ErrorsComponent, typeof ObjectEditorComponent, typeof PaletteComponent, typeof TextListEditorComponent, typeof TextMapEditorComponent, typeof PropertyEditorComponent, typeof i10.CommonModule, typeof i11.FormsModule], [typeof DiagramComponent]>;
    static ɵinj: i0.ɵɵInjectorDeclaration<DagaModule>;
}

/**
 * A provider for the {@link Canvas} associated with a {@link DiagramComponent} context.
 * @public
 */
declare class CanvasProviderService {
    private _canvas;
    private canvasSubject$;
    /**
     * Subject used to track when the canvas has been updated.
     * @public
     */
    canvas$: rxjs.Observable<Canvas>;
    private viewInitializedSubject$;
    /**
     * Subject used to track when the view of the canvas has been updated after updating the canvas.
     * @public
     */
    viewInitialized$: rxjs.Observable<Canvas>;
    /**
     * Initialize the diagram canvas object of this context using the given diagram configuration.
     * @private
     * @param parentComponent A diagram editor.
     * @param config A diagram configuration.
     */
    initCanvas(parentComponent: DiagramEditor, config: DiagramConfig): void;
    /**
     * Attach the canvas of this context to an HTML element to render it there.
     * @private
     * @param appendTo An HTML element.
     */
    initCanvasView(appendTo: HTMLElement): void;
    /**
     * Get the current canvas of this context.
     * @public
     * @returns A canvas.
     */
    getCanvas(): Canvas;
    static ɵfac: i0.ɵɵFactoryDeclaration<CanvasProviderService, never>;
    static ɵprov: i0.ɵɵInjectableDeclaration<CanvasProviderService>;
}

/**
 * A provider for the {@link DiagramConfig} associated with a {@link DiagramComponent} context.
 * @public
 */
declare class DagaConfigurationService {
    private _config;
    private configSubject$;
    /**
     * Subject used to track when the diagram configuration has been updated.
     * @public
     */
    config$: rxjs.Observable<DiagramConfig>;
    /**
     * Set the diagram configuration of this context.
     * @private
     * @param config A diagram configuration.
     */
    init(config: DiagramConfig): void;
    /**
     * Get the current diagram configuration of this context.
     * @public
     * @returns A diagram configuration.
     */
    getConfig(): DiagramConfig;
    static ɵfac: i0.ɵɵFactoryDeclaration<DagaConfigurationService, never>;
    static ɵprov: i0.ɵɵInjectableDeclaration<DagaConfigurationService>;
}

export { CanvasProviderService, CollapseButtonComponent, DagaConfigurationService, DagaModule, DiagramButtonsComponent, DiagramComponent, ErrorsComponent, ObjectEditorComponent, PaletteComponent, PropertyEditorComponent, TextListEditorComponent, TextMapEditorComponent };