How to disable text annotation movement in web apps

There might be cases when you want to disable movements (dragging and resizing) of text annotations but allow a user to edit the text. You can do this by using the following code:

PSPDFKit.load(options).then((instance) => {
  const stopPropagation = (event) => event.stopImmediatePropagation();


  instance.addEventListener(
    "annotationSelection.change",
    (annotations) => {
      annotations.forEach((annotation) => {
        if (
          annotation &&
          annotation instanceof PSPDFKit.Annotations.TextAnnotation
        ) {
          instance.contentDocument.ownerDocument.addEventListener(
            "pointermove",
            stopPropagation,
            { capture: true }
          );
          instance.contentDocument.ownerDocument.addEventListener(
            "mousemove",
            stopPropagation,
            {
              capture: true
            }
          );
          instance.contentDocument.ownerDocument.addEventListener(
            "touchmove",
            stopPropagation,
            {
              capture: true
            }
          );


          instance.contentDocument.ownerDocument.addEventListener(
            "keydown",
            stopPropagation,
            {
              capture: true
            }
          );
        } else {
          instance.contentDocument.ownerDocument.removeEventListener(
            "pointermove",
            stopPropagation,
            { capture: true }
          );


          instance.contentDocument.ownerDocument.removeEventListener(
            "mousemove",
            stopPropagation,
            {
              capture: true
            }
          );
          instance.contentDocument.ownerDocument.removeEventListener(
            "touchmove",
            stopPropagation,
            {
              capture: true
            }
          );


          instance.contentDocument.ownerDocument.removeEventListener(
            "keydown",
            stopPropagation,
            {
              capture: true
            }
          );
        }
      });
    }
  );
});

All the other annotations, except the text annotation, will work as expected.

This has been tested with Nutrient Web SDK 2024.5.2.