@searpent/react-image-annotate 2.0.47 → 2.0.48

package/Annotator/examplePhotos.js

@@ -686,55 +686,20 @@ var examplePhotos = [{
         "text": "[{\"label\":\"author\",\"text\":\"MET\"}]",
         "groupId": "5",
         "id": "346807506053365764"
-      }, {
-        "label": "title",
-        "score": 0.99,
-        "box": {
-          "X1": 0.7056229,
-          "X2": 0.9718065,
-          "Y1": 0.049599823,
-          "Y2": 0.18825386
-        },
-        "text": "[{\"label\":\"title\",\"text\":\"Za lidská práva! Vadí Čína i Katar\"}]",
-        "groupId": "6",
-        "id": "346807506909003776"
-      }, {
-        "label": "text",
-        "score": 0.99,
-        "box": {
-          "X1": 0.70483536,
-          "X2": 0.7946133,
-          "Y1": 0.1657085,
-          "Y2": 0.53319806
-        },
-        "text": "[{\"label\":\"text\",\"text\":\"\"}]",
-        "groupId": "6",
-        "id": "346807506909003777"
-      }, {
-        "label": "text",
-        "score": 0.99,
-        "box": {
-          "X1": 0.7985509,
-          "X2": 0.8875413,
-          "Y1": 0.33028972,
-          "Y2": 0.53432536
-        },
-        "text": "[{\"label\":\"text\",\"text\":\"\"}]",
-        "groupId": "6",
-        "id": "346807506909003778"
-      }, {
-        "label": "text",
-        "score": 0.99,
-        "box": {
-          "X1": 0.89147896,
-          "X2": 0.98046935,
-          "Y1": 0.33028972,
-          "Y2": 0.53432536
-        },
-        "text": "[{\"label\":\"text\",\"text\":\"\"}]",
-        "groupId": "6",
-        "id": "346807506913198080"
-      }, {
+      }, // {
+      //   "label": "title",
+      //   "score": 0.99,
+      //   "box": {
+      //     "X1": 0.7056229,
+      //     "X2": 0.9718065,
+      //     "Y1": 0.049599823,
+      //     "Y2": 0.18825386
+      //   },
+      //   "text": "[{\"label\":\"title\",\"text\":\"Za lidská práva! Vadí Čína i Katar\"}]",
+      //   "groupId": "6",
+      //   "id": "346807506909003776"
+      // },
+      {
         "label": "photo_caption",
         "score": 0.99,
         "box": {
@@ -743,33 +708,35 @@ var examplePhotos = [{
           "Y1": 0.25025365,
           "Y2": 0.3415624
         },
-        "text": "[{\"label\":\"photo_caption\",\"text\":\"Protest z února v Indii proti konání ZOH v Pekingu\"}]",
-        "groupId": "6",
-        "id": "346807506913198081"
-      }, {
-        "label": "photo_caption",
-        "score": 0.99,
-        "box": {
-          "X1": 0.80248857,
-          "X2": 0.95999366,
-          "Y1": 0.32127157,
-          "Y2": 0.34381694
-        },
-        "text": "[{\"label\":\"photo_caption\",\"text\":\"Protest z února v Indii proti konání ZOH v Pekingu\"}]",
-        "groupId": "6",
-        "id": "346807506913198082"
-      }, {
-        "label": "author",
-        "score": 0.99,
-        "box": {
-          "X1": 0.9584186,
-          "X2": 0.9733816,
-          "Y1": 0.51628906,
-          "Y2": 0.53319806
-        },
-        "text": "[{\"label\":\"author\",\"text\":\"PUR\"}]",
+        "text": "[{\"label\":\"photo_caption\",\"text\":\"Protest n z února v Indii,\\n\\tpred proti v Pekingu.\"}]",
         "groupId": "6",
-        "id": "346807506913198083"
+        "id": "346807506913198081" // {
+        //   "label": "photo_caption",
+        //   "score": 0.99,
+        //   "box": {
+        //     "X1": 0.80248857,
+        //     "X2": 0.95999366,
+        //     "Y1": 0.32127157,
+        //     "Y2": 0.34381694
+        //   },
+        //   "text": "[{\"label\":\"photo_caption\",\"text\":\"Protest z února v Indii proti konání ZOH v Pekingu\"}]",
+        //   "groupId": "6",
+        //   "id": "346807506913198082"
+        // },
+        // {
+        //   "label": "author",
+        //   "score": 0.99,
+        //   "box": {
+        //     "X1": 0.9584186,
+        //     "X2": 0.9733816,
+        //     "Y1": 0.51628906,
+        //     "Y2": 0.53319806
+        //   },
+        //   "text": "[{\"label\":\"author\",\"text\":\"PUR\"}]",
+        //   "groupId": "6",
+        //   "id": "346807506913198083"
+        // }
+
       }]
     }, {
       "modelFamily": "metadata-engine",

package/Editor/annotation-plugin/annotation.js

@@ -4,9 +4,26 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
 /**
  * Build styles
  */
-import './annotation.css'; // Possible classes
+import './annotation.css';
+
+function whitespaceCharactersToHTML() {
+  var str = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  return str // new line whitespace
+  .replaceAll(/[ ]\n[ ]/gm, '&nbsp;<br>&nbsp;') // space both sides adds &nbsp;
+  .replaceAll(/\n[ ]/gm, '<br>&nbsp;') // space right side adds &nbsp;
+  .replaceAll(/[ ]\n/gm, '&nbsp;<br>') // space left side adds &nbsp;
+  .replaceAll(/\n/gm, '<br>') // no spaces
+  // tab whitespace
+  .replaceAll(/\t/gm, '&nbsp;&nbsp;&nbsp;&nbsp;'); // no spaces
+}
+
+function HTMLToWhitespaceCharacters() {
+  var str = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  return str.replaceAll(/((&nbsp;|\s){4})/gm, '\t').replaceAll('&nbsp;', ' ').replaceAll('<br>', '\n'); // new line whitespace
+} // Possible classes
 // ================
 
+
 var Annotation =
 /*#__PURE__*/
 function () {
@@ -92,7 +109,7 @@ function () {
         data = {};
       }
 
-      newData.text = data.text || '';
+      newData.text = whitespaceCharactersToHTML(data.text);
       newData.labelName = data.labelName || this.defaultLabel.labelName;
       return newData;
     }
@@ -234,7 +251,7 @@ function () {
     key: "save",
     value: function save(toolsContent) {
       return {
-        text: toolsContent.innerHTML,
+        text: HTMLToWhitespaceCharacters(toolsContent.innerHTML),
         labelName: this.currentLabel.labelName
       };
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@searpent/react-image-annotate",
-  "version": "2.0.47",
+  "version": "2.0.48",
   "dependencies": {
     "@editorjs/editorjs": "^2.25.0",
     "@editorjs/paragraph": "^2.8.0",