@metadev/daga-angular 5.0.3 → 5.0.4

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@metadev/daga-angular",
   "description": "Diagramming engine for editing models on the Web. Made by Metadev.",
-  "version": "5.0.3",
+  "version": "5.0.4",
   "author": "Metadev (https://metadev.pro)",
   "license": "SEE LICENSE IN LICENSE.md",
   "repository": "git+https://github.com/metadevpro/daga-tutorial.git",
@@ -21,15 +21,15 @@
     "@angular/common": ">= 21.0.7 < 23",
     "@angular/core": ">= 21.0.7 < 23",
     "@angular/forms": ">= 21.0.7 < 23",
-    "@metadev/daga": "^5.0.3",
+    "@metadev/daga": "^5.0.4",
     "d3": "^7.9.0",
-    "rxjs": "~7.8.1"
+    "rxjs": "~7.8.2"
   },
   "sideEffects": false,
   "files": [
     "/assets",
     "/fesm2022",
-    "/lib",
+    "/types",
     "index.d.ts",
     "package.json",
     "README.md",
@@ -47,6 +47,7 @@
       "default": "./fesm2022/metadev-daga-angular.mjs"
     }
   },
+  "type": "module",
   "dependencies": {
     "tslib": "^2.3.0"
   }

package/types/metadev-daga-angular.d.ts

@@ -0,0 +1,403 @@
+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, DiagramDraggingNodeEvent, 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, DiagramZoomEvent, 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, ResizableMode, 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;
+    centerAnimationDuration: number | undefined;
+    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; }; "centerAnimationDuration": { "alias": "centerAnimationDuration"; "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;
+    height?: 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; }; "height": { "alias": "height"; "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;
+    height?: 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 };