@konfuzio/document-validation-ui 0.2.1-dev.0 → 0.2.1-dev.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@konfuzio/document-validation-ui",
-  "version": "0.2.1-dev.0",
+  "version": "0.2.1-dev.1",
   "repository": "https://github.com/konfuzio-ai/document-validation-ui",
   "main": "dist/app.js",
   "scripts": {
@@ -36,7 +36,7 @@
     "splitpanes": "^3.1.8",
     "vue": "^3.5.13",
     "vue-i18n": "^10.0.6",
-    "vue-konva": "^3.2.0",
+    "vue-konva": "^3.2.1",
     "vue3-observe-visibility": "^1.0.3",
     "vuedraggable": "^4.1.0",
     "vuex": "^4.1.0"

package/src/components/DocumentAnnotations/AnnotationContent.vue

@@ -62,7 +62,6 @@ export default {
   },
   computed: {
     ...mapGetters("document", ["isAnnotationInEditMode", "isDocumentReviewed"]),
-    ...mapGetters("display", ["bboxToRect"]),
     ...mapState("document", [
       "editAnnotation",
       "publicView",

package/src/components/DocumentPage/DocumentPage.vue

@@ -554,21 +554,18 @@ export default {
     },
     getAnnotationLabelPosition(annotation) {
       if (annotation && this.$refs.stage) {
-        const padding = 8;
         const maxCharacters = 10;
         const minimumSpaceTopY = 50;
-        const rect = this.bboxToRect(this.page, annotation.span, true);
+        const rect = this.bboxToRect(this.page, annotation.span);
 
         if (
           annotation.labelName.length > maxCharacters &&
           rect.y < minimumSpaceTopY
         ) {
-          return `left: ${rect.x}px; top: ${
-            rect.y + rect.height * 3 + padding
-          }px`;
+          return `left: ${rect.x}px; top: ${rect.y + rect.height}px`;
         } else {
           return `left: ${rect.x}px; bottom: ${
-            this.$refs.stage.$el.clientHeight - rect.y - rect.height - padding
+            this.$refs.stage.$el.clientHeight - rect.y
           }px`;
         }
       } else {

package/src/components/DocumentPage/SpanSelection.vue

@@ -121,15 +121,17 @@ export default {
 
     moveSelection(points) {
       // only apply when we have a large enough selection, otherwise we risk counting misclicks
-      const xDiff = Math.abs(this.selection.start.x - points.end.x);
-      const yDiff = Math.abs(this.selection.start.y - points.end.y);
-      if (xDiff > 5 && yDiff > 5) {
-        const { start, end } = points;
-        if (start) {
-          this.selection.start = start;
-        }
-        if (end) {
-          this.selection.end = end;
+      if (this.selection) {
+        const xDiff = Math.abs(this.selection.start.x - points.end.x);
+        const yDiff = Math.abs(this.selection.start.y - points.end.y);
+        if (xDiff > 5 && yDiff > 5) {
+          const { start, end } = points;
+          if (start) {
+            this.selection.start = start;
+          }
+          if (end) {
+            this.selection.end = end;
+          }
         }
       }
     },

package/src/store/selection.js

@@ -75,10 +75,12 @@ const actions = {
 
   moveSelection: ({ commit, state, dispatch }, points) => {
     // only apply when we have a large enough selection, otherwise we risk counting misclicks
-    const xDiff = Math.abs(state.selection.start.x - points.end.x);
-    const yDiff = Math.abs(state.selection.start.y - points.end.y);
-    if (xDiff > 5 && yDiff > 5) {
-      commit("MOVE_SELECTION", points);
+    if (state.selection && state.selection.start) {
+      const xDiff = Math.abs(state.selection.start.x - points.end.x);
+      const yDiff = Math.abs(state.selection.start.y - points.end.y);
+      if (xDiff > 5 && yDiff > 5) {
+        commit("MOVE_SELECTION", points);
+      }
     }
   },