@metadev/daga 2.0.2 → 3.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@metadev/daga",
-  "version": "2.0.2",
+  "version": "3.0.0",
   "dependencies": {},
   "peerDependencies": {
     "d3": "^7.9.0",

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

@@ -49,7 +49,9 @@ export declare class DiagramCanvas implements Canvas {
     panRate: number;
     inferConnectionType: boolean;
     multipleSelectionOn: boolean;
-    connectionType?: DiagramConnectionType;
+    private _connectionType?;
+    get connectionType(): DiagramConnectionType | undefined;
+    set connectionType(value: DiagramConnectionType | undefined);
     layoutFormat?: string;
     validators: DiagramValidator[];
     userActions: {

package/src/lib/diagram/diagram-config.d.ts

@@ -262,6 +262,11 @@ export interface PaletteComponentConfig {
      * @default '12rem'
      */
     width?: string;
+    /**
+     * Gap between the templates in this palette.
+     * @default '1rem'
+     */
+    gap?: string;
     /**
      * Configuration for the sections of this palette. By default, no sections are created.
      * @default undefined
@@ -371,6 +376,10 @@ export interface ConnectionTemplateConfig {
      * File path of the background image of this template as it appears on the palette.
      */
     icon: string;
+    /**
+     * File path of the background image of this template as it appears on the palette when this connection type is selected.
+     */
+    selectedIcon: string;
     /**
      * Width of this template in diagram units as it appears on the palette.
      */

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

@@ -4,9 +4,6 @@ import { CollabTimestamp } from '../collab/primitives';
 import { FieldConfig } from '../diagram-config';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
 import { DiagramModel } from './diagram-model';
-import { DiagramNode } from './diagram-node';
-import { DiagramPort } from './diagram-port';
-import { DiagramSection } from './diagram-section';
 /**
  * Default values of the parameters of a diagram field.
  * @private
@@ -24,6 +21,9 @@ export declare const DIAGRAM_FIELD_DEFAULTS: {
     verticalAlign: VerticalAlign;
     fit: boolean;
 };
+export interface LabeledElement {
+    label?: DiagramField;
+}
 /**
  * A field which displays text and is part of a diagram element.
  * @public
@@ -36,7 +36,7 @@ export declare class DiagramField extends DiagramElement {
      * Element that this field belongs to.
      * @public
      */
-    rootElement?: DiagramNode | DiagramSection | DiagramPort;
+    rootElement?: LabeledElement & DiagramElement;
     /**
      * Coordinates of this field.
      * @public
@@ -109,7 +109,7 @@ export declare class DiagramField extends DiagramElement {
      * @public
      */
     fit: boolean;
-    constructor(model: DiagramModel, rootElement: DiagramNode | DiagramSection | DiagramPort | undefined, coords: Point, width: number, height: number, fontSize: number, fontFamily: string | null, color: string, selectedColor: string, horizontalAlign: HorizontalAlign, verticalAlign: VerticalAlign, text: string, editable: boolean, fit: boolean);
+    constructor(model: DiagramModel, rootElement: (LabeledElement & DiagramElement) | undefined, coords: Point, width: number, height: number, fontSize: number, fontFamily: string | null, color: string, selectedColor: string, horizontalAlign: HorizontalAlign, verticalAlign: VerticalAlign, text: string, editable: boolean, fit: boolean);
     select(): d3.Selection<SVGGElement, unknown, null, unknown> | undefined;
     get removed(): boolean;
     updateInView(): void;
@@ -132,7 +132,7 @@ export declare class DiagramFieldSet extends DiagramElementSet<DiagramField> {
      * Instance a new field and add it to this set. This method is normally called when instancing an element with a field and it is rarely called by itself.
      * @private
      */
-    new(rootElement: DiagramNode | DiagramSection | DiagramPort | undefined, coords: Point, fontSize: number, fontFamily: string | null, color: string, selectedColor: string, width: number, height: number, horizontalAlign: HorizontalAlign, verticalAlign: VerticalAlign, text: string, editable: boolean, fit: boolean): DiagramField;
+    new(rootElement: (LabeledElement & DiagramElement) | undefined, coords: Point, fontSize: number, fontFamily: string | null, color: string, selectedColor: string, width: number, height: number, horizontalAlign: HorizontalAlign, verticalAlign: VerticalAlign, text: string, editable: boolean, fit: boolean): DiagramField;
     remove(id: string): void;
 }
 export declare const getBottomMargin: (config?: FieldConfig | null) => number;

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

@@ -6,7 +6,7 @@ import { DiagramConnection } from './diagram-connection';
 import { DiagramDecorator } from './diagram-decorator';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
 import { DiagramEntity, DiagramEntitySet } from './diagram-entity';
-import { DiagramField } from './diagram-field';
+import { DiagramField, LabeledElement } from './diagram-field';
 import { DiagramModel } from './diagram-model';
 import { DiagramPort } from './diagram-port';
 import { PropertySet, ValueSet } from './diagram-property';
@@ -76,7 +76,7 @@ export declare class DiagramNodeType implements DiagramEntity {
  * @see DiagramPort
  * @see DiagramSection
  */
-export declare class DiagramNode extends DiagramElement {
+export declare class DiagramNode extends DiagramElement implements LabeledElement {
     type: DiagramNodeType;
     /**
      * Additional properties of this node.

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

@@ -2,7 +2,7 @@ import { Point } from '../../util/canvas-util';
 import { Side } from '../../util/svg-util';
 import { DiagramConnection } from './diagram-connection';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
-import { DiagramField } from './diagram-field';
+import { DiagramField, LabeledElement } from './diagram-field';
 import { DiagramModel } from './diagram-model';
 import { DiagramNode } from './diagram-node';
 import { DiagramSection } from './diagram-section';
@@ -23,7 +23,7 @@ export declare const DIAGRAM_PORT_DEFAULTS: {
  * @see DiagramNode
  * @see DiagramSection
  */
-export declare class DiagramPort extends DiagramElement {
+export declare class DiagramPort extends DiagramElement implements LabeledElement {
     /**
      * Element that this port belongs to.
      * @public

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

@@ -4,7 +4,7 @@ import { NodeShapedLook, SectionConfig } from '../diagram-config';
 import { DiagramConnection } from './diagram-connection';
 import { DiagramDecorator } from './diagram-decorator';
 import { DiagramElement, DiagramElementSet } from './diagram-element';
-import { DiagramField } from './diagram-field';
+import { DiagramField, LabeledElement } from './diagram-field';
 import { DiagramModel } from './diagram-model';
 import { DiagramNode } from './diagram-node';
 import { DiagramPort } from './diagram-port';
@@ -61,7 +61,7 @@ export type DiagramSectionGeometry = {
  * @see DiagramNode
  * @see DiagramPort
  */
-export declare class DiagramSection extends DiagramElement {
+export declare class DiagramSection extends DiagramElement implements LabeledElement {
     /**
      * Node that this section belongs to.
      * @public

package/src/lib/util/events.d.ts

@@ -15,6 +15,8 @@ export declare enum Events {
     KeyDown = "keydown",
     KeyUp = "keyup",
     MouseDown = "mousedown",
+    MouseEnter = "mouseenter",
+    MouseLeave = "mouseleave",
     MouseMove = "mousemove",
     MouseOut = "mouseout",
     MouseOver = "mouseover",