@metadev/daga 3.1.5 → 4.0.0

package/src/lib/diagram/model/diagram-connection.d.ts

@@ -1,7 +1,8 @@
 import { Point } from '../../util/canvas-util';
-import { LineFunction, LineShape, LineStyle } from '../../util/line';
+import { LineShape, LineStyle } from '../../util/line';
 import { Side } from '../../util/svg-util';
-import { ConnectionMarkerLook, ConnectionTypeConfig, FieldConfig } from '../diagram-config';
+import { ConnectionTypeConfig, FieldConfig } from '../config/diagram-config';
+import { ConnectionLook, ConnectionLookConfig, MarkerImageLook, MarkerImageLookConfig } from '../config/diagram-look';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
 import { DiagramEntity, DiagramEntitySet } from './diagram-entity';
 import { DiagramModel } from './diagram-model';
@@ -14,16 +15,24 @@ import { PropertySet, ValueSet } from './diagram-property';
  */
 export declare const DIAGRAM_CONNECTION_TYPE_DEFAULTS: {
     name: string;
-    width: number;
-    shape: LineShape;
-    style: LineStyle;
     label: null;
-    defaultStartMarkerLook: null;
-    defaultEndMarkerLook: null;
+    look: {
+        lookType: string;
+        color: string;
+        thickness: number;
+        shape: LineShape;
+        style: LineStyle;
+        selected: {
+            color: string;
+        };
+        highlighted: {
+            thickness: number;
+        };
+    };
+    startMarkerLook: undefined;
+    endMarkerLook: undefined;
     startTypes: never[];
     endTypes: never[];
-    color: string;
-    selectedColor: string;
     properties: never[];
 };
 /**
@@ -42,6 +51,13 @@ export declare const CAN_CONNECTIONS_SHARE_PORTS = true;
  * Whether tightening connections is allowed.
  */
 export declare const CAN_TIGHTEN_CONNECTIONS = true;
+/**
+ * The types allowed for the look of the markers of a connection.
+ * @public
+ * @see Look
+ * @see DiagramConnection
+ */
+export type ConnectionMarkerLook = MarkerImageLook;
 /**
  * A connection type, which holds properties that connections of this type share in common.
  * @public
@@ -50,16 +66,21 @@ export declare const CAN_TIGHTEN_CONNECTIONS = true;
 export declare class DiagramConnectionType implements DiagramEntity {
     id: string;
     name: string;
-    width: number;
-    shape: LineShape | LineFunction;
-    style: LineStyle;
     label: FieldConfig | null;
+    defaultLook: ConnectionLook;
+    selectedLook: ConnectionLook;
+    highlightedLook: ConnectionLook;
+    selectedAndHighlightedLook: ConnectionLook;
     defaultStartMarkerLook: ConnectionMarkerLook | null;
+    selectedStartMarkerLook: ConnectionMarkerLook | null;
+    highlightedStartMarkerLook: ConnectionMarkerLook | null;
+    selectedAndHighlightedStartMarkerLook: ConnectionMarkerLook | null;
     defaultEndMarkerLook: ConnectionMarkerLook | null;
+    selectedEndMarkerLook: ConnectionMarkerLook | null;
+    highlightedEndMarkerLook: ConnectionMarkerLook | null;
+    selectedAndHighlightedEndMarkerLook: ConnectionMarkerLook | null;
     startTypes: string[];
     endTypes: string[];
-    color: string;
-    selectedColor: string;
     propertySet: PropertySet;
     constructor(options: ConnectionTypeConfig);
     canStartFromType(type: string): boolean;
@@ -71,7 +92,11 @@ export declare class DiagramConnectionType implements DiagramEntity {
  * @see DiagramPort
  */
 export declare class DiagramConnection extends DiagramElement {
-    type: DiagramConnectionType;
+    private _type;
+    get type(): DiagramConnectionType;
+    set type(type: DiagramConnectionType);
+    get typeString(): string;
+    set typeString(typeString: string);
     /**
      * Additional properties of this connection.
      * @public
@@ -97,11 +122,6 @@ export declare class DiagramConnection extends DiagramElement {
      * @public
      */
     startCoords: Point;
-    /**
-     * Look of the marker of this connection at the start, or `null` if the connection has no start marker.
-     * @public
-     */
-    startMarkerLook: ConnectionMarkerLook | null;
     /**
      * Port that this connection ends at.
      * @public
@@ -117,11 +137,6 @@ export declare class DiagramConnection extends DiagramElement {
      * @public
      */
     endCoords: Point;
-    /**
-     * Look of the marker of this connection at the end, or `null` if the connection has no end marker.
-     * @public
-     */
-    endMarkerLook: ConnectionMarkerLook | null;
     /**
      * Text at the start of this connection, or `''` if no text.
      * @public
@@ -148,6 +163,51 @@ export declare class DiagramConnection extends DiagramElement {
      */
     get name(): string;
     set name(name: string);
+    private _defaultLook?;
+    private _selectedLook?;
+    private _highlightedLook?;
+    private _selectedAndHighlightedLook?;
+    /**
+     * Current look of the connection.
+     * @private
+     */
+    get look(): ConnectionLook;
+    /**
+     * Sets the look configuration of the connection to override the one determined by the type.
+     * `undefined` resets it to the one determined by the type.
+     * @private
+     */
+    set look(look: ConnectionLookConfig | undefined);
+    private _defaultStartMarkerLook?;
+    private _selectedStartMarkerLook?;
+    private _highlightedStartMarkerLook?;
+    private _selectedAndHighlightedStartMarkerLook?;
+    /**
+     * Current look of the start marker.
+     * @private
+     */
+    get startMarkerLook(): MarkerImageLook | null;
+    /**
+     * Sets the look configuration of the start marker to override the one determined by the type.
+     * `null` stands for no marker and `undefined` resets it to the one determined by the type.
+     * @private
+     */
+    set startMarkerLook(startMarkerLook: MarkerImageLookConfig | null | undefined);
+    private _defaultEndMarkerLook?;
+    private _selectedEndMarkerLook?;
+    private _highlightedEndMarkerLook?;
+    private _selectedAndHighlightedEndMarkerLook?;
+    /**
+     * Current look of the end marker.
+     * @private
+     */
+    get endMarkerLook(): MarkerImageLook | null;
+    /**
+     * Sets the look configuration of the end marker to override the one determined by the type.
+     * `null` stands for no marker and `undefined` resets it to the one determined by the type.
+     * @private
+     */
+    set endMarkerLook(endMarkerLook: MarkerImageLookConfig | null | undefined);
     constructor(model: DiagramModel, type: DiagramConnectionType, start: DiagramPort | undefined, end: DiagramPort | undefined, id: string);
     get removed(): boolean;
     updateInView(): void;
@@ -192,7 +252,7 @@ export declare class DiagramConnectionSet extends DiagramElementSet<DiagramConne
      * @param type The type of the connection given as either the type itself or the id of the type.
      * @param start The start port of the connection.
      * @param end The end port of the connection.
-     * @param id The id of the connection.
+     * @param id The id of the connection. Cannot be an empty string.
      * @returns The instanced connection.
      */
     new(type: DiagramConnectionType | string, start: DiagramPort | undefined, end: DiagramPort | undefined, id: string): DiagramConnection;

package/src/lib/diagram/model/diagram-decorator.d.ts

@@ -57,7 +57,14 @@ export declare class DiagramDecoratorSet extends DiagramElementSet<DiagramDecora
     constructor(model: DiagramModel);
     /**
      * Instance a new decorator and add it to this set.
-     * @private
+     * @public
+     * @param coords The coordinates of the top left corner of the decorator in the diagram.
+     * @param width The dimension of the decorator along the x axis.
+     * @param height The dimension of the decorator along the y axis.
+     * @param priority The priority of the decorator. Used when filtering by priority.
+     * @param html The html contents of the decorator.
+     * @param id The id of the decorator. Cannot be an empty string.
+     * @returns The instanced decorator.
      */
     new(rootElement: DiagramNode | DiagramSection | undefined, coords: Point, width: number, height: number, priority: number, html: string, id: string): DiagramDecorator;
     remove(id: string): void;

package/src/lib/diagram/model/diagram-element.d.ts

@@ -20,6 +20,10 @@ export declare abstract class DiagramElement implements DiagramEntity {
      */
     readonly model: DiagramModel;
     private _id;
+    /**
+     * Identifier that uniquely identifies this element within its diagram model. Cannot be an empty string.
+     * @public
+     */
     get id(): string;
     /**
      * Whether this diagram element is currently in the user highlight.

package/src/lib/diagram/model/diagram-field.d.ts

@@ -1,7 +1,7 @@
 import { Point } from '../../util/canvas-util';
 import { HorizontalAlign, VerticalAlign } from '../../util/svg-util';
 import { CollabTimestamp } from '../collab/primitives';
-import { FieldConfig } from '../diagram-config';
+import { FieldConfig } from '../config/diagram-config';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
 import { DiagramModel } from './diagram-model';
 /**

package/src/lib/diagram/model/diagram-node.d.ts

@@ -1,7 +1,8 @@
 import { Point } from '../../util/canvas-util';
 import { Side } from '../../util/svg-util';
 import { CollabTimestamp } from '../collab/primitives';
-import { FieldConfig, ImageLook, NodeTypeConfig, PortConfig, SectionGridConfig, ShapedLook, StretchableImageLook } from '../diagram-config';
+import { FieldConfig, NodeTypeConfig, PortConfig } from '../config/diagram-config';
+import { ImageLook, ImageLookConfig, ShapedLook, ShapedLookConfig, StretchableImageLook, StretchableImageLookConfig } from '../config/diagram-look';
 import { DiagramConnection } from './diagram-connection';
 import { DiagramDecorator } from './diagram-decorator';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
@@ -10,13 +11,13 @@ import { DiagramField, LabeledElement } from './diagram-field';
 import { DiagramModel } from './diagram-model';
 import { DiagramPort } from './diagram-port';
 import { PropertySet, ValueSet } from './diagram-property';
-import { DiagramSection, DiagramSectionGeometry } from './diagram-section';
+import { DiagramSection, DiagramSectionGeometry, DiagramSectionGrid } from './diagram-section';
 /**
  * Default values of the look of a diagram node.
  * @private
  * @see DIAGRAM_NODE_TYPE_DEFAULTS
  */
-export declare const DIAGRAM_NODE_LOOK_DEFAULTS: ShapedLook;
+export declare const DIAGRAM_NODE_LOOK_DEFAULTS: ShapedLookConfig;
 /**
  * Default values of the parameters of a diagram node.
  * @private
@@ -34,7 +35,7 @@ export declare const DIAGRAM_NODE_TYPE_DEFAULTS: {
     label: null;
     ports: never[];
     sectionGrid: null;
-    look: ShapedLook;
+    look: ShapedLookConfig;
     isUnique: boolean;
     canBeParentless: boolean;
     childrenTypes: never[];
@@ -52,6 +53,13 @@ export type DiagramNodeGeometry = {
         [childId: string]: DiagramNodeGeometry;
     };
 };
+/**
+ * The types allowed for the look of a node.
+ * @public
+ * @see Look
+ * @see DiagramNode
+ */
+export type NodeLook = ShapedLook | ImageLook | StretchableImageLook;
 /**
  * A node type, which holds properties that nodes of this type share in common.
  * @public
@@ -72,8 +80,11 @@ export declare class DiagramNodeType implements DiagramEntity {
     topPadding: number;
     label: FieldConfig | null;
     ports: PortConfig[];
-    sectionGrid: SectionGridConfig | null;
-    look: ShapedLook | ImageLook | StretchableImageLook;
+    sectionGrid: DiagramSectionGrid | null;
+    defaultLook: NodeLook;
+    selectedLook: NodeLook;
+    highlightedLook: NodeLook;
+    selectedAndHighlightedLook: NodeLook;
     isUnique: boolean;
     canBeParentless: boolean;
     childrenTypes: string[];
@@ -89,7 +100,11 @@ export declare class DiagramNodeType implements DiagramEntity {
  * @see DiagramSection
  */
 export declare class DiagramNode extends DiagramElement implements LabeledElement {
-    type: DiagramNodeType;
+    private _type;
+    get type(): DiagramNodeType;
+    set type(type: DiagramNodeType);
+    get typeString(): string;
+    set typeString(typeString: string);
     /**
      * Additional properties of this node.
      * @public
@@ -156,6 +171,21 @@ export declare class DiagramNode extends DiagramElement implements LabeledElemen
      */
     get name(): string;
     set name(name: string);
+    private _defaultLook?;
+    private _selectedLook?;
+    private _highlightedLook?;
+    private _selectedAndHighlightedLook?;
+    /**
+     * Current look of this port.
+     * @private
+     */
+    get look(): NodeLook;
+    /**
+     * Sets the look configuration of the look to override the one determined by the type.
+     * `undefined` resets it to the one determined by the type.
+     * @private
+     */
+    set look(look: ShapedLookConfig | ImageLookConfig | StretchableImageLookConfig | undefined);
     constructor(model: DiagramModel, type: DiagramNodeType, coords: Point | undefined, id: string);
     get removed(): boolean;
     updateInView(): void;
@@ -261,7 +291,7 @@ export declare class DiagramNodeSet extends DiagramElementSet<DiagramNode> {
      * @public
      * @param type The type of the node given as either the type itself or the id of the type.
      * @param coords The coordinates of the top left corner of the node in the diagram.
-     * @param id The id of the node.
+     * @param id The id of the node. Cannot be an empty string.
      * @returns The instanced node.
      */
     new(type: DiagramNodeType | string, coords: Point, id: string): DiagramNode;

package/src/lib/diagram/model/diagram-object.d.ts

@@ -46,7 +46,14 @@ export declare class DiagramObjectSet extends DiagramElementSet<DiagramObject> {
     constructor(model: DiagramModel);
     /**
      * Instance a new object and add it to this set.
-     * @private
+     * @public
+     * @param coords The coordinates of the top left corner of the object in the diagram.
+     * @param width The dimension of the object along the x axis.
+     * @param height The dimension of the object along the y axis.
+     * @param priority The priority of the object. Used when filtering by priority.
+     * @param html The html contents of the object.
+     * @param id The id of the object. Cannot be an empty string.
+     * @returns The instanced object.
      */
     new(coords: Point, width: number, height: number, priority: number, html: string, id: string): DiagramObject;
     remove(id: string): void;

package/src/lib/diagram/model/diagram-port.d.ts

@@ -1,6 +1,7 @@
 import { Point } from '../../util/canvas-util';
 import { Side } from '../../util/svg-util';
-import { FieldConfig, ImageLook, PortTypeConfig } from '../diagram-config';
+import { FieldConfig, PortTypeConfig } from '../config/diagram-config';
+import { ImageLook, ImageLookConfig, ShapedLook, ShapedLookConfig } from '../config/diagram-look';
 import { DiagramConnection } from './diagram-connection';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
 import { DiagramEntity, DiagramEntitySet } from './diagram-entity';
@@ -9,14 +10,11 @@ import { DiagramModel } from './diagram-model';
 import { DiagramNode } from './diagram-node';
 import { DiagramSection } from './diagram-section';
 /**
- * Default values of the parameters of a diagram port.
+ * Default values of the look of a diagram port.
  * @private
- * @see DiagramPort
+ * @see DIAGRAM_NODE_TYPE_DEFAULTS
  */
-export declare const DIAGRAM_PORT_DEFAULTS: {
-    highlightedColor: string;
-    selectedColor: string;
-};
+export declare const DIAGRAM_PORT_LOOK_DEFAULTS: ShapedLookConfig;
 /**
  * Default values of the parameters of a diagram port.
  * @private
@@ -28,7 +26,15 @@ export declare const DIAGRAM_PORT_TYPE_DEFAULTS: {
     allowsOutgoing: boolean;
     allowsIncoming: boolean;
     width: number;
+    look: ShapedLookConfig;
 };
+/**
+ * The types allowed for the look of a port.
+ * @public
+ * @see Look
+ * @see DiagramPort
+ */
+export type PortLook = ShapedLook | ImageLook;
 /**
  * A port type, which holds properties that ports of this type share in common.
  * @public
@@ -50,10 +56,10 @@ export declare class DiagramPortType implements DiagramEntity {
      * Width of ports of this type in diagram units.
      */
     width: number;
-    /**
-     * Look of ports of this type.
-     */
-    look?: ImageLook;
+    defaultLook: PortLook;
+    selectedLook: PortLook;
+    highlightedLook: PortLook;
+    selectedAndHighlightedLook: PortLook;
     constructor(options: PortTypeConfig);
 }
 /**
@@ -64,7 +70,11 @@ export declare class DiagramPortType implements DiagramEntity {
  * @see DiagramSection
  */
 export declare class DiagramPort extends DiagramElement implements LabeledElement {
-    type: DiagramPortType | undefined;
+    private _type;
+    get type(): DiagramPortType | undefined;
+    set type(type: DiagramPortType | undefined);
+    get typeString(): string | undefined;
+    set typeString(typeString: string | undefined);
     /**
      * Element that this port belongs to.
      * @public
@@ -114,6 +124,31 @@ export declare class DiagramPort extends DiagramElement implements LabeledElemen
      */
     get name(): string;
     set name(name: string);
+    private _defaultLook?;
+    private _selectedLook?;
+    private _highlightedLook?;
+    private _selectedAndHighlightedLook?;
+    /**
+     * Current look of this port.
+     * @private
+     */
+    get look(): PortLook;
+    /**
+     * Sets the look configuration of the look to override the one determined by the type.
+     * `undefined` resets it to the one determined by the type.
+     * @private
+     */
+    set look(look: ShapedLookConfig | ImageLookConfig | undefined);
+    /**
+     * Current width of this port.
+     * @private
+     */
+    get width(): number;
+    /**
+     * Current height of this port. Same as the width.
+     * @private
+     */
+    get height(): number;
     constructor(model: DiagramModel, type: DiagramPortType | undefined, rootElement: DiagramNode | DiagramSection | undefined, coords: Point, connectionPoint: Point | undefined, direction: Side, id: string);
     get removed(): boolean;
     updateInView(): void;

package/src/lib/diagram/model/diagram-property.d.ts

@@ -157,9 +157,7 @@ export declare class ValueSet {
     propertySet: PropertySet;
     displayedProperties: Property[];
     hiddenProperties: Property[];
-    values: {
-        [key: string]: unknown;
-    };
+    private values;
     private valueSets;
     /**
      * Collaborative timestamps for all keys in this.values that have ever been set,
@@ -344,6 +342,23 @@ export declare const diff: (a: {
 }, {
     [key: string]: unknown;
 }];
+/**
+ * Calculates the differences between the two given values of a valueset and returns two objects containing the differences in each relative to the other.
+ *
+ * @param a An object.
+ * @param b An object.
+ * @param valueSet A ValueSet to use as reference for the keys and types of each property.
+ * @returns A tuple of two objects with each containing the keys that have a different value in the corresponding argument compared to the other argument.
+ */
+export declare const diffProperties: (a: {
+    [key: string]: unknown;
+}, b: {
+    [key: string]: unknown;
+}, valueSet: ValueSet) => [{
+    [key: string]: unknown;
+}, {
+    [key: string]: unknown;
+}];
 /**
  * Checks if the given value is an object.
  * @public

package/src/lib/diagram/model/diagram-section.d.ts

@@ -1,30 +1,14 @@
 import { Point } from '../../util/canvas-util';
 import { Side } from '../../util/svg-util';
-import { SectionConfig, ShapedLook } from '../diagram-config';
+import { FieldConfig, PortConfig, SectionConfig, SectionGridConfig } from '../config/diagram-config';
+import { ImageLookConfig, ShapedLookConfig, StretchableImageLookConfig } from '../config/diagram-look';
 import { DiagramConnection } from './diagram-connection';
 import { DiagramDecorator } from './diagram-decorator';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
 import { DiagramField, LabeledElement } from './diagram-field';
 import { DiagramModel } from './diagram-model';
-import { DiagramNode } from './diagram-node';
+import { DiagramNode, NodeLook } from './diagram-node';
 import { DiagramPort } from './diagram-port';
-/**
- * Default values of the look of a diagram section.
- * @private
- * @see DIAGRAM_SECTION_DEFAULTS
- */
-export declare const DIAGRAM_SECTION_LOOK_DEFAULTS: ShapedLook;
-/**
- * Default values of the parameters of a diagram section.
- * @private
- * @see DiagramSection
- */
-export declare const DIAGRAM_SECTION_DEFAULTS: {
-    label: null;
-    ports: never[];
-    look: ShapedLook;
-    priority: number;
-};
 /**
  * Default value of the default width of a diagram section.
  * @private
@@ -54,6 +38,31 @@ export type DiagramSectionGeometry = {
     readonly width: number;
     readonly height: number;
 };
+/**
+ * A grid of sections which a node has.
+ * @public
+ * @see DiagramNode
+ * @see SectionGridConfig
+ */
+export declare class DiagramSectionGrid {
+    defaultWidths: number[] | null;
+    defaultHeights: number[] | null;
+    minWidths: number[] | null;
+    minHeights: number[] | null;
+    margin: number;
+    sections: DiagramSectionType[][];
+    constructor(options: SectionGridConfig);
+}
+export declare class DiagramSectionType {
+    label: FieldConfig | null;
+    ports: PortConfig[];
+    defaultLook: NodeLook;
+    selectedLook: NodeLook;
+    highlightedLook: NodeLook;
+    selectedAndHighlightedLook: NodeLook;
+    priority: number;
+    constructor(options: SectionConfig);
+}
 /**
  * A section of a node which can have connections and display a property of the node.
  * @public
@@ -111,11 +120,26 @@ export declare class DiagramSection extends DiagramElement implements LabeledEle
      */
     get name(): string;
     set name(name: string);
+    private _defaultLook?;
+    private _selectedLook?;
+    private _highlightedLook?;
+    private _selectedAndHighlightedLook?;
+    /**
+     * Current look of this port.
+     * @private
+     */
+    get look(): NodeLook;
+    /**
+     * Sets the look configuration of the look to override the one determined by the type.
+     * `undefined` resets it to the one determined by the type.
+     * @private
+     */
+    set look(look: ShapedLookConfig | ImageLookConfig | StretchableImageLookConfig | undefined);
     constructor(model: DiagramModel, node: DiagramNode | undefined, indexXInNode: number, indexYInNode: number, coords: Point, width: number, height: number, id: string);
     get removed(): boolean;
     updateInView(): void;
     raise(): void;
-    getConfig(): SectionConfig | undefined;
+    get type(): DiagramSectionType | undefined;
     getMinWidth(): number;
     getMinHeight(): number;
     getPriority(): number;

package/src/lib/interfaces/canvas.d.ts

@@ -4,7 +4,7 @@ import { DiagramUserHighlight } from '../diagram/canvas/diagram-user-highlight';
 import { DiagramUserSelection } from '../diagram/canvas/diagram-user-selection';
 import { CollabEngine } from '../diagram/collab/collab-engine';
 import { ActionStack, DiagramAction, DiagramActionMethod, DiagramActions } from '../diagram/diagram-action';
-import { UserActionConfig } from '../diagram/diagram-config';
+import { UserActionConfig } from '../diagram/config/diagram-config';
 import { DiagramEvent } from '../diagram/diagram-event';
 import { DiagramConnectionType } from '../diagram/model/diagram-connection';
 import { DiagramModel } from '../diagram/model/diagram-model';

package/src/lib/util/test-util.d.ts

@@ -1,4 +1,4 @@
-import { DiagramConfig } from '../diagram/diagram-config';
+import { DiagramConfig } from '../diagram/config/diagram-config';
 /**
  * Creates the structuredClone function if it doesn't exist.
  * @private