How to enable inline commenting feature and right-click annotation menu

Inline commenting is a new feature that allows users to quickly review and catch up on the comment history directly on the annotation. This popup will open when an annotation is selected.

When this feature is turned on, the annotation menu popup will be opened by right-clicking on an annotation.

WebViewer({
  path: '...'
}).then((instance) => {
  // this will turn on the inline commenting feature
  // and will also turn on right-click annotation menu feature
  instance.UI.enableFeatures([instance.UI.Feature.InlineComment]);
})

When this feature is turned off, the annotation menu popup will still be associated with the right click.

WebViewer({
  path: '...'
}).then((instance) => {
  // this will turn off the inline commenting feature
  // and will not touch the right-click annotation menu feature
  instance.UI.disableFeatures([instance.UI.Feature.InlineComment]);
})

By default, only text-related annotations will have the inline comment popup open on selected. For the other types of annotations, users will have to right click on the annotation then click Comment to open the inline comment popup. Noted that the notes panel has to stay closed for the inline comment popup to open.

There is an API to define whether the annotation should have inline comment feature enabled on select instance.UI.setInlineCommentFilter(filterFunc)

// only enable inline comment for free-hand annotations on select
instance.UI.setInlineCommentFilter((annotation) => {
  return annotation.ToolName === Tools.ToolNames.FREEHAND;
});

The annotation menu popup can be converted to a right click. The right click menu will now present different options depending on whether an annotation or the page is right-clicked. Noted that right click on an annotation will also select that annotation.

When this feature is turned on and if the inline commenting feature is turned off, selecting an annotation will no longer show a popup.

WebViewer({
  path: '...'
}).then((instance) => {
  // this will turn on the right-click annotation menu feature
  // and will not touch the inline commenting feature
  instance.UI.enableFeatures([instance.UI.Feature.RightClickAnnotationPopup]);
})

When this feature is turned off, the inline commenting feature will be turned off as well if it's on.

WebViewer({
  path: '...'
}).then((instance) => {
  // this will turn off the right-click annotation menu feature
  // and will also turn off the inline commenting feature
  instance.UI.disableFeatures([instance.UI.Feature.RightClickAnnotationPopup]);
})