@searpent/react-image-annotate 2.0.45 → 2.0.47

package/Annotator/index.js

@@ -76,6 +76,7 @@ export var Annotator = function Annotator(_ref) {
       groupColors = _ref.groupColors,
       onRecalc = _ref.onRecalc,
       onSave = _ref.onSave,
+      onSelectedImageChange = _ref.onSelectedImageChange,
       albumMetadata = _ref.albumMetadata,
       metadataConfigs = _ref.metadataConfigs,
       _ref$lockedImages = _ref.lockedImages,
@@ -197,13 +198,51 @@ export var Annotator = function Annotator(_ref) {
     };
   }();
 
-  var handleRecalcClick = function handleRecalcClick(e) {
-    e.preventDefault();
+  var handleRecalcClick =
+  /*#__PURE__*/
+  function () {
+    var _ref3 = _asyncToGenerator(
+    /*#__PURE__*/
+    _regeneratorRuntime.mark(function _callee2(e) {
+      var createdAt;
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              createdAt = new Date();
+              e.preventDefault();
 
-    if (onRecalc) {
-      onRecalc();
-    }
-  };
+              if (!onRecalc) {
+                _context2.next = 6;
+                break;
+              }
+
+              _context2.next = 5;
+              return onRecalc({
+                images: state.images,
+                albumMetadata: state.albumMetadata,
+                createdAt: createdAt,
+                selectedImage: state === null || state === void 0 ? void 0 : state.selectedImage
+              });
+
+            case 5:
+              dispatchToReducer({
+                type: "IMAGES_RECALCULATED",
+                recalculatedAt: createdAt
+              });
+
+            case 6:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+
+    return function handleRecalcClick(_x2) {
+      return _ref3.apply(this, arguments);
+    };
+  }();
 
   var handleMetadataChange = function handleMetadataChange(params) {
     dispatchToReducer(_objectSpread({
@@ -216,8 +255,24 @@ export var Annotator = function Annotator(_ref) {
       type: "ADD_GROUP",
       group: group
     });
-  }; // trigger this on every BBox manipulation (there is currently no way to detect adding of new box!)
+  }; // trigger onSelectedImageChange() hook when image changed
+
 
+  useEffect(function () {
+    var _state$lastAction;
+
+    var createdAt = new Date();
+
+    if (typeof onSelectedImageChange === 'function' && ((_state$lastAction = state.lastAction) === null || _state$lastAction === void 0 ? void 0 : _state$lastAction.type) === 'SELECT_IMAGE' && (state === null || state === void 0 ? void 0 : state.selectedImage) !== state.previouslySelectedImage) {
+      onSelectedImageChange({
+        selectedImage: state === null || state === void 0 ? void 0 : state.selectedImage,
+        previouslySelectedImage: state.previouslySelectedImage,
+        images: state.images,
+        albumMetadata: state.albumMetadata,
+        createdAt: createdAt
+      });
+    }
+  }, [state.previouslySelectedImage, state.selectedImage, onSelectedImageChange, state.images, state.albumMetadata, state]); // trigger this on every BBox manipulation (there is currently no way to detect adding of new box!)
 
   useEffect(function () {
     if (!state.lastAction || !["BEGIN_BOX_TRANSFORM", "CHANGE_REGION", "DELETE_REGION", "DELETE_SELECTED_REGION", "UPDATE_METADATA", "SELECT_CLASSIFICATION"].includes(state.lastAction.type)) {
@@ -243,10 +298,10 @@ export var Annotator = function Annotator(_ref) {
   }, [onImagesChange, selectedImage]);
   if (!images && !videoSrc) return 'Missing required prop "images" or "videoSrc"';
 
-  var _ref3 = state.imagesSavedAt < state.imagesUpdatedAt ? [true, true] : [false, false],
-      _ref4 = _slicedToArray(_ref3, 2),
-      recalcActive = _ref4[0],
-      saveActive = _ref4[1];
+  var _ref4 = state.imagesSavedAt < state.imagesUpdatedAt ? [true, true] : [false, false],
+      _ref5 = _slicedToArray(_ref4, 2),
+      recalcActive = _ref5[0],
+      saveActive = _ref5[1];
 
   return React.createElement(SettingsProvider, {
     clsColors: clsColors,

package/Annotator/reducers/general-reducer.js

@@ -114,6 +114,7 @@ export default (function (state, action) {
         src = _ref.src,
         frameTime = _ref.frameTime;
 
+    state = setIn(state, ["previouslySelectedImage"], state.selectedImage);
     return setIn(setIn(state, ["selectedImage"], index), ["selectedImageFrameTime"], frameTime);
   };
 
@@ -1155,6 +1156,12 @@ export default (function (state, action) {
         return setIn(state, ["imagesSavedAt"], savedAt);
       }
 
+    case "IMAGES_RECALCULATED":
+      {
+        var recalculatedAt = action.recalculatedAt;
+        return setIn(state, ["imagesSavedAt"], recalculatedAt);
+      }
+
     case "UPDATE_METADATA":
       {
         var name = action.name,

package/package.json

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