@metadev/daga 1.3.1 → 1.4.1

package/index.d.ts

@@ -9,7 +9,7 @@ export { DiagramModelExporter } from './lib/diagram-editor/diagram/converters/di
 export { DiagramModelImporter } from './lib/diagram-editor/diagram/converters/diagram-model-importer';
 export { ActionQueue, AddConnectionAction, AddNodeAction, DiagramAction, DiagramActions, EditFieldAction, MoveNodeAction, RemoveAction, StretchNodeAction, UpdateValuesAction } from './lib/diagram-editor/diagram/diagram-action';
 export { ACTION_QUEUE_SIZE, DiagramCanvas } from './lib/diagram-editor/diagram/diagram-canvas';
-export { ConnectionMarkerLook, ConnectionTemplateConfig, ConnectionTypeConfig, DiagramConfig, FieldConfig, NodeImageLook, NodeShapedLook, NodeStretchableImageLook, NodeTemplateConfig, NodeTypeConfig, PaletteConfig, PortConfig, SectionConfig } from './lib/diagram-editor/diagram/diagram-config';
+export { ButtonsComponentConfig, ComponentsConfig, ConnectionMarkerLook, ConnectionTemplateConfig, ConnectionTypeConfig, DiagramConfig, ErrorsComponentConfig, FieldConfig, NodeImageLook, NodeShapedLook, NodeStretchableImageLook, NodeTemplateConfig, NodeTypeConfig, PaletteComponentConfig, PaletteSectionConfig, PortConfig, PropertyEditorComponentConfig, SectionConfig, SectionGridConfig, UserActionConfig } from './lib/diagram-editor/diagram/diagram-config';
 export { DiagramConnection, DiagramConnectionSet, DiagramConnectionType } from './lib/diagram-editor/diagram/diagram-connection';
 export { DiagramElement, DiagramEntity, DiagramEntitySet } from './lib/diagram-editor/diagram/diagram-element';
 export { DiagramField, DiagramFieldSet } from './lib/diagram-editor/diagram/diagram-field';

package/lib/diagram/diagram.component.d.ts

@@ -1,4 +1,5 @@
-import { OnInit } from '@angular/core';
+import { AfterContentInit, AfterViewInit, EventEmitter, OnInit } from '@angular/core';
+import { DagaModel } from '../diagram-editor/diagram/converters/daga-model';
 import { DiagramConfig } from '../diagram-editor/diagram/diagram-config';
 import { CanvasProviderService } from '../services/canvas-provider.service';
 import { DagaConfigurationService } from '../services/daga-configuration.service';
@@ -8,12 +9,36 @@ import * as i0 from "@angular/core";
  * 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
  */
-export declare class DiagramComponent implements OnInit {
+export declare class DiagramComponent implements AfterContentInit, AfterViewInit, OnInit {
     private configurationService;
     private canvasProvider;
+    /**
+     * Configuration for the diagram.
+     * @public
+     */
     config: DiagramConfig;
+    private importer;
+    private exporter;
+    private _model;
+    /**
+     * 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>;
     constructor(configurationService: DagaConfigurationService, canvasProvider: CanvasProviderService);
     ngOnInit(): void;
+    ngAfterContentInit(): void;
+    ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DiagramComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DiagramComponent, "daga-diagram", never, { "config": { "alias": "config"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DiagramComponent, "daga-diagram", never, { "config": { "alias": "config"; "required": false; }; "model": { "alias": "model"; "required": false; }; }, { "modelChange": "modelChange"; }, never, ["*"], true, never>;
 }

package/lib/diagram-buttons/diagram-buttons.component.d.ts

@@ -1,16 +1,20 @@
-import { ElementRef } from '@angular/core';
+import { AfterViewInit, ElementRef } from '@angular/core';
+import { DiagramActions } from '../diagram-editor/diagram/diagram-action';
 import { Canvas } from '../interfaces/canvas';
 import { DiagramButtons } from '../interfaces/diagram-buttons';
 import { CanvasProviderService } from '../services/canvas-provider.service';
+import { Corner, Side } from '../util/svg-util';
 import * as i0 from "@angular/core";
 /**
  * Buttons used to trigger diagram functionalities by the user.
  * @private
  */
-export declare class DiagramButtonsComponent implements DiagramButtons {
+export declare class DiagramButtonsComponent implements AfterViewInit, DiagramButtons {
     private canvasProvider;
     get canvas(): Canvas;
     collapsableButtons: ElementRef<HTMLDivElement>;
+    location: Corner;
+    direction: Side;
     enableFilter: boolean;
     enableLayout: boolean;
     enableUndoRedo: boolean;
@@ -19,7 +23,14 @@ export declare class DiagramButtonsComponent implements DiagramButtons {
     filterOn: boolean;
     collapsed: boolean;
     animationOngoing: boolean;
+    private sizeAttribute;
+    private transformFunction;
+    private transformOrigin;
+    private marginSide;
+    private collapsableButtonsSize;
+    DiagramActions: typeof DiagramActions;
     constructor(canvasProvider: CanvasProviderService);
+    ngAfterViewInit(): void;
     toggleCollapse(): Promise<void>;
     zoomIn(): void;
     zoomOut(): void;
@@ -29,5 +40,5 @@ export declare class DiagramButtonsComponent implements DiagramButtons {
     undo(): void;
     redo(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DiagramButtonsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DiagramButtonsComponent, "daga-diagram-buttons", never, { "enableFilter": { "alias": "enableFilter"; "required": false; }; "enableLayout": { "alias": "enableLayout"; "required": false; }; "enableUndoRedo": { "alias": "enableUndoRedo"; "required": false; }; "enableZoom": { "alias": "enableZoom"; "required": false; }; "zoomRate": { "alias": "zoomRate"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DiagramButtonsComponent, "daga-diagram-buttons", never, { "location": { "alias": "location"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "enableFilter": { "alias": "enableFilter"; "required": false; }; "enableLayout": { "alias": "enableLayout"; "required": false; }; "enableUndoRedo": { "alias": "enableUndoRedo"; "required": false; }; "enableZoom": { "alias": "enableZoom"; "required": false; }; "zoomRate": { "alias": "zoomRate"; "required": false; }; }, {}, never, never, true, never>;
 }

package/lib/diagram-editor/diagram/converters/daga-model.d.ts

@@ -30,6 +30,8 @@ export interface DagaModel {
                 label: string;
             }[];
             label: string;
+            indexXInNode: number;
+            indexYInNode: number;
             coords: Point;
             width: number;
             height: number;
@@ -61,4 +63,7 @@ export interface DagaModel {
             [key: string]: unknown;
         };
     }[];
+    data: {
+        [key: string]: unknown;
+    };
 }

package/lib/diagram-editor/diagram/diagram-action.d.ts

@@ -13,6 +13,11 @@ import { DiagramSection } from './diagram-section';
  * @private
  */
 export declare class ActionQueue {
+    /**
+     * Canvas that this action queue belongs to.
+     * @private
+     */
+    canvas: Canvas;
     /**
      * Maximum number of actions that can be recorded simultaneously.
      * When new actions are added past this limit, older actions are removed.
@@ -29,7 +34,7 @@ export declare class ActionQueue {
      * @private
      */
     index: number;
-    constructor(maximum: number);
+    constructor(canvas: Canvas, maximum: number);
     /**
      * Adds an action to the history.
      * @private
@@ -56,17 +61,63 @@ export interface DiagramAction {
 }
 /**
  * Enum listing the actions that can be taken by the user.
- * @private
+ * The actions can correspond to a DiagramAction that can be recorded in the action queue of a diagram or they may not correspond to any DiagramAction implementations.
+ * @public
  */
 export declare enum DiagramActions {
-    AddConnectionAction = "add-connection",
-    AddNodeAction = "add-node",
-    EditFieldAction = "edit-field",
-    MoveNodeAction = "move-node",
-    RemoveAction = "remove",
-    StretchNodeAction = "stretch-node",
-    StretchSectionAction = "stretch-section",
-    UpdateValuesAction = "update-values"
+    /**
+     * Action that corresponds to the addition of a connection.
+     * @see AddConnectionAction
+     * @public
+     */
+    AddConnection = "add-connection",
+    /**
+     * Action that corresponds to the addition of a node.
+     * @see AddNodeAction
+     * @public
+     */
+    AddNode = "add-node",
+    /**
+     * Action that corresponds to the edition of a field's text content.
+     * @see EditFieldAction
+     * @public
+     */
+    EditField = "edit-field",
+    /**
+     * Action that corresponds to moving a node.
+     * @see MoveNodeAction
+     * @public
+     */
+    MoveNode = "move-node",
+    /**
+     * Action that corresponds to removing elements.
+     * @see RemoveAction
+     * @public
+     */
+    Remove = "remove",
+    /**
+     * Action that corresponds to altering a node's dimensions.
+     * @see StretchNodeAction
+     * @public
+     */
+    StretchNode = "stretch-node",
+    /**
+     * Action that corresponds to altering a sections's dimensions.
+     * @see StretchSectionAction
+     * @public
+     */
+    StretchSection = "stretch-section",
+    /**
+     * Action that corresponds to changing the values of a value set.
+     * @see UpdateValuesAction
+     * @public
+     */
+    UpdateValues = "update-values",
+    /**
+     * Action that corresponds to changing the view point of a diagram by zooming or panning.
+     * @public
+     */
+    Zoom = "zoom"
 }
 /**
  * Action which consists of adding a node.

package/lib/diagram-editor/diagram/diagram-canvas.d.ts

@@ -11,6 +11,7 @@ import { DiagramElement } from './diagram-element';
 import { DiagramModel } from './diagram-model';
 import { DiagramPort } from './diagram-port';
 import { ValueSet } from './diagram-property';
+import { CursorStyle } from '../../util/style';
 /**
  * Thickness of the invisible path around a connection used to make it easier to click on, in pixels.
  * @private
@@ -37,13 +38,11 @@ export declare class DiagramCanvas implements Canvas {
     parentComponent: DiagramEditor;
     diagramRoot: HTMLElement;
     model: DiagramModel;
-    color: string;
+    backgroundColor: string;
     gridSize: number;
     snapToGrid: boolean;
     guessConnectionType: boolean;
     connectionType?: DiagramConnectionType;
-    priorityThreshold?: number;
-    priorityThresholds: number[];
     validators: DiagramValidator[];
     layoutFormat?: string;
     userActions: {
@@ -54,22 +53,31 @@ export declare class DiagramCanvas implements Canvas {
     private backgroundPatternId;
     private zoomBehavior;
     private zoomTransform;
+    private priorityThreshold?;
+    private priorityThresholds;
     private mainUserHighlight?;
     private userHighlight;
     private userSelection;
     private propertyEditorSelection?;
     private propertyEditorValues?;
     private unfinishedConnection?;
+    /**
+     * Invisible path followed by an unfinished connection. Used for making unfinished connections stop before the cursor rather than stopping right at the cursor.
+     */
+    private unfinishedConnectionTracer?;
     private inputFieldContainer?;
     private draggingFrom;
     private currentAction?;
     viewInitialized$: Subject<void>;
     validatorChanges$: Subject<void>;
-    diagramChanges$: Subject<number>;
+    diagramChanges$: Subject<void>;
     diagramImportantChanges$: Subject<void>;
     constructor(parentComponent: DiagramEditor, config: DiagramConfig);
     addValidator(validator: DiagramValidator): void;
     removeValidator(validator: DiagramValidator): void;
+    getPriorityThresholdOptions(): number[] | undefined;
+    getPriorityThreshold(): number | undefined;
+    setPriorityThreshold(priority: number): void;
     initView(appendTo: HTMLElement): void;
     zoomBy(zoom: number): void;
     zoomTo(zoom: number): void;
@@ -80,6 +88,7 @@ export declare class DiagramCanvas implements Canvas {
     private getEventHoldingCoordinates;
     getPointerLocationRelativeToCanvas(event: MouseEvent): Point;
     getPointerLocationRelativeToBody(event: MouseEvent): Point;
+    getPointerLocationRelativeToScreen(event: MouseEvent): Point;
     updateModelInView(): void;
     updateNodesInView(...ids: string[]): void;
     updateSectionsInView(...ids: string[]): void;
@@ -88,23 +97,33 @@ export declare class DiagramCanvas implements Canvas {
     updateFieldsInView(...ids: string[]): void;
     updateConnectionLabelsInView(connection: DiagramConnection): void;
     updateConnectionMarkersInView(connection: DiagramConnection): void;
+    fitFieldRootInView(id: string): void;
+    fitNodeInView(id: string): void;
     selectRoot(): d3.Selection<d3.BaseType, unknown, null, unknown>;
-    selectCanvas(): d3.Selection<SVGGElement, unknown, null, unknown>;
     selectCanvasView(): d3.Selection<SVGGElement, unknown, null, unknown>;
+    selectCanvasElements(): d3.Selection<SVGGElement, unknown, null, unknown>;
+    selectCanvasNodes(): d3.Selection<SVGGElement, unknown, null, unknown>;
+    selectCanvasSections(): d3.Selection<SVGGElement, unknown, null, unknown>;
+    selectCanvasPorts(): d3.Selection<SVGGElement, unknown, null, unknown>;
+    selectCanvasConnections(): d3.Selection<SVGGElement, unknown, null, unknown>;
+    selectCanvasFields(): d3.Selection<SVGGElement, unknown, null, unknown>;
     startConnection(port: DiagramPort): void;
     finishConnection(port: DiagramPort): void;
     dropConnection(): void;
     highlight(element: DiagramElement): void;
     unhighlight(): void;
-    setPropertyEditorSelection(selection?: DiagramElement & {
+    setPropertyEditorSelection(selection?: {
         valueSet: ValueSet;
-    }): void;
+    } & (DiagramElement | DiagramModel)): void;
     isInUserSelection(selection: DiagramElement): boolean;
     addToUserSelection(selection: DiagramElement): void;
     removeFromUserSelection(selection: DiagramElement): void;
     toggleUserSelection(selection: DiagramElement): void;
     clearUserSelection(): void;
     cancelAllUserActions(): void;
+    canUserPerformAction(action: DiagramActions): boolean;
     private createInputField;
     private removeInputField;
+    private minimumSizeOfField;
 }
+export declare const cursorStyle: (style?: CursorStyle) => void;