@searpent/react-image-annotate 2.0.22 → 2.0.23

package/Annotator/index.js

@@ -229,7 +229,7 @@ export var Annotator = function Annotator(_ref2) {
 
 
   useEffect(function () {
-    if (!state.lastAction || !["BEGIN_BOX_TRANSFORM", "CHANGE_REGION", "DELETE_REGION"].includes(state.lastAction.type)) {
+    if (!state.lastAction || !["BEGIN_BOX_TRANSFORM", "CHANGE_REGION", "DELETE_REGION", "UPDATE_METADATA"].includes(state.lastAction.type)) {
       return;
     }
 

package/ImageCanvas/index.js

@@ -302,7 +302,6 @@ export var ImageCanvas = function ImageCanvas(_ref2) {
     style: {
       width: "100%",
       height: "100vh",
-      maxHeight: "calc(100vh - 68px)",
       position: "relative",
       overflow: "hidden",
       cursor: createWithPrimary ? "crosshair" : dragging ? "grabbing" : dragWithPrimary ? "grab" : zoomWithPrimary ? mat.a < 1 ? "zoom-out" : "zoom-in" : undefined

package/PageSelector/index.js

@@ -9,7 +9,22 @@ function PageThumbnail(_ref) {
       onClick = _ref.onClick,
       pageNumber = _ref.pageNumber,
       metadata = _ref.metadata,
-      showMetadata = _ref.showMetadata;
+      showMetadata = _ref.showMetadata,
+      imageIndex = _ref.imageIndex,
+      onMetadataChange = _ref.onMetadataChange;
+
+  var handleChange = function handleChange(e) {
+    e.preventDefault();
+    var _e$target = e.target,
+        name = _e$target.name,
+        value = _e$target.value;
+    onMetadataChange({
+      name: name,
+      value: value,
+      imageIndex: imageIndex
+    });
+  };
+
   return React.createElement("div", {
     role: "button",
     tabIndex: 0,
@@ -29,47 +44,28 @@ function PageThumbnail(_ref) {
     className: "page-number"
   }, pageNumber))), React.createElement("div", {
     className: "ps-page-thumbnail-metadata-wrapper"
-  }, React.createElement("label", {
-    htmlFor: true
-  }, "Page"), React.createElement("input", {
-    type: "text",
-    value: "2"
-  }), React.createElement("label", {
-    htmlFor: true
-  }, "Topic"), React.createElement("input", {
-    type: "text",
-    value: "012345678901234567890123456789"
-  }), React.createElement("label", {
-    htmlFor: true
-  }, "Mutation"), React.createElement("input", {
-    type: "text",
-    value: "2"
-  }), React.createElement("label", {
-    htmlFor: true
-  }, "Page"), React.createElement("input", {
-    type: "text",
-    value: "2"
-  }), React.createElement("label", {
-    htmlFor: true
-  }, "Topic"), React.createElement("input", {
-    type: "text",
-    value: "012345678901234567890123456789"
-  }), React.createElement("label", {
-    htmlFor: true
-  }, "Mutation"), React.createElement("input", {
-    type: "text",
-    value: "2"
+  }, metadata.map(function (_ref2) {
+    var key = _ref2.key,
+        value = _ref2.value;
+    return React.createElement(React.Fragment, null, React.createElement("label", {
+      for: key
+    }, key), React.createElement("input", {
+      type: "text",
+      value: value,
+      name: key,
+      onChange: handleChange
+    }));
   })));
 }
 
-function PageSelector(_ref2) {
-  var pages = _ref2.pages,
-      onPageClick = _ref2.onPageClick,
-      onRecalc = _ref2.onRecalc,
-      onSave = _ref2.onSave,
-      recalcActive = _ref2.recalcActive,
-      saveActive = _ref2.saveActive,
-      onMetadataChange = _ref2.onMetadataChange;
+function PageSelector(_ref3) {
+  var pages = _ref3.pages,
+      onPageClick = _ref3.onPageClick,
+      onRecalc = _ref3.onRecalc,
+      onSave = _ref3.onSave,
+      recalcActive = _ref3.recalcActive,
+      saveActive = _ref3.saveActive,
+      onMetadataChange = _ref3.onMetadataChange;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -116,7 +112,9 @@ function PageSelector(_ref2) {
         return onPageClick(idx);
       },
       metadata: page.metadata,
-      showMetadata: showMetadata
+      showMetadata: showMetadata,
+      imageIndex: page.id,
+      onMetadataChange: onMetadataChange
     });
   })));
 }

package/package.json

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