diff --git a/src/TextAnnotator.jsx b/src/TextAnnotator.jsx
index 1baf1f9..ae9f24d 100644
--- a/src/TextAnnotator.jsx
+++ b/src/TextAnnotator.jsx
@@ -75,6 +75,27 @@ export default class TextAnnotator extends Component {
     }
   }
 
+  /**
+   * A convenience method that allows the external application to
+   * override the autogenerated Id.
+   * 
+   * Usually, the override will happen almost immediately after
+   * the annotation is created. But we need to be defensive and assume
+   * that the override might come in with considerable delay, thus
+   * the user might have made further edits already.
+   */
+  overrideId = originalId => forcedId => {
+    // Force the editors to close, otherwise their annotations will be orphaned
+    if (this.state.selectedAnnotation || this.state.selectedRelation) {
+      this.setState({
+        selectedAnnotation: null,
+        selectedRelation: null
+      }, () => this.highlighter.overrideId(originalId, forcedId));
+    } else {
+      this.highlighter.overrideId(originalId, forcedId);
+    }
+  }
+
   /** Common handler for annotation CREATE or UPDATE **/
   onCreateOrUpdateAnnotation = method => (annotation, previous) => {
     this.clearState();
@@ -82,16 +103,11 @@ export default class TextAnnotator extends Component {
     this.selectionHandler.clearSelection();
     this.highlighter.addOrUpdateAnnotation(annotation, previous);
 
-    // A convenience method that allows the external application to
-    // override the autogenerated Id
-    const overrideId = originalId => forcedId =>
-      this.highlighter.overrideId(originalId, forcedId);
-
     // Call CREATE or UPDATE handler
     if (previous)
       this.props[method](annotation.clone(), previous.clone());
     else 
-      this.props[method](annotation.clone(), overrideId(annotation.id));
+      this.props[method](annotation.clone(), this.overrideId(annotation.id));
   }
 
   onDeleteAnnotation = annotation => {