@metadev/daga 1.4.0 → 1.4.1

package/Changelog.md

@@ -4,7 +4,14 @@ List of releases and changes.
 
 ![Daga logo](https://metadev.pro/icons/daga-logo-header.svg)
 
-## 1.4.0 Tizona
+## Next release Colada
+
+## v. 1.4.1
+
+- Fix bug with diagram changes not triggering validation [#91](https://github.com/metadevpro/daga/pull/91)
+- Compensate for scroll when getting cursor position relative to screen [#92](https://github.com/metadevpro/daga/pull/92)
+
+## v. 1.4.0 Tizona
 
 - Enable configuring which components are present in a diagram [#66](https://github.com/metadevpro/daga/pull/66)
 - Add `zoom` configurable user action and enable configuring whether zooming and panning is enabled [#66](https://github.com/metadevpro/daga/pull/66)

package/fesm2022/metadev-daga.mjs

@@ -4487,6 +4487,13 @@ class DiagramCanvas {
     getPointerLocationRelativeToBody(event) {
         return d3.pointer(this.getEventHoldingCoordinates(event), d3.select('body').node());
     }
+    getPointerLocationRelativeToScreen(event) {
+        const pointerLocationRelativeToBody = this.getPointerLocationRelativeToBody(event);
+        return [
+            pointerLocationRelativeToBody[0] - window.scrollX,
+            pointerLocationRelativeToBody[1] - window.scrollY
+        ];
+    }
     updateModelInView() {
         this.updateNodesInView();
         this.updateSectionsInView();
@@ -6713,7 +6720,7 @@ class ErrorsComponent {
         this.Side = Side;
     }
     ngAfterViewInit() {
-        merge([this.canvas.validatorChanges$, this.canvas.diagramChanges$])
+        merge(this.canvas.validatorChanges$, this.canvas.diagramChanges$)
             .pipe(
         // delay to avoid errors of variables changing right after checking
         delay(1), map(() => this.validate()))
@@ -6877,7 +6884,7 @@ class PaletteComponent {
             .drag()
             .on(DragEvents.Drag, (event) => {
             if (this.canvas.canUserPerformAction(DiagramActions.AddNode)) {
-                const pointerCoords = this.canvas.getPointerLocationRelativeToBody(event);
+                const pointerCoords = this.canvas.getPointerLocationRelativeToScreen(event);
                 if (pointerCoords.length < 2 ||
                     isNaN(pointerCoords[0]) ||
                     isNaN(pointerCoords[1])) {
@@ -6893,7 +6900,7 @@ class PaletteComponent {
             .on(DragEvents.Start, (event) => {
             if (this.canvas.canUserPerformAction(DiagramActions.AddNode)) {
                 d3.select('body').style('cursor', 'grabbing');
-                const pointerCoords = this.canvas.getPointerLocationRelativeToBody(event);
+                const pointerCoords = this.canvas.getPointerLocationRelativeToScreen(event);
                 if (pointerCoords.length < 2 ||
                     isNaN(pointerCoords[0]) ||
                     isNaN(pointerCoords[1])) {
@@ -6926,14 +6933,14 @@ class PaletteComponent {
                     // can't place, it's unique and that node is already in the model
                     return;
                 }
-                const pointerCoordsRelativeToBody = this.canvas.getPointerLocationRelativeToBody(event);
-                if (pointerCoordsRelativeToBody.length < 2 ||
-                    isNaN(pointerCoordsRelativeToBody[0]) ||
-                    isNaN(pointerCoordsRelativeToBody[1])) {
+                const pointerCoordsRelativeToScreen = this.canvas.getPointerLocationRelativeToScreen(event);
+                if (pointerCoordsRelativeToScreen.length < 2 ||
+                    isNaN(pointerCoordsRelativeToScreen[0]) ||
+                    isNaN(pointerCoordsRelativeToScreen[1])) {
                     // can't place, position is incorrect
                     return;
                 }
-                const element = document.elementFromPoint(pointerCoordsRelativeToBody[0], pointerCoordsRelativeToBody[1]);
+                const element = document.elementFromPoint(pointerCoordsRelativeToScreen[0], pointerCoordsRelativeToScreen[1]);
                 if (element &&
                     !this.canvas.selectCanvasView().node()?.contains(element)) {
                     // can't place, node hasn't been dropped on the canvas