Override the Ink Signature Dialog

To override the default ink signature dialog, intercept the ink signature workflow completely by preventing the default behavior when pressing an annotation and using your own dialog. This example mimics the default behavior and can be modified as needed:

PSPDFKit.load(configuration).then((instance) => {
  function fitIn(size, containerSize) {
    const { width, height } = size;

    const widthRatio = containerSize.width / width;
    const heightRatio = containerSize.height / height;

    const ratio = Math.min(widthRatio, heightRatio);

    return {
      width: width * ratio,
      height: height * ratio
    };
  }

  let currentInkSignatureWidget;

  instance.addEventListener("annotations.press", (event) => {
    if (
      event.annotation instanceof PSPDFKit.Annotations.WidgetAnnotation
    ) {
      currentInkSignatureWidget = event.annotation;
      event.preventDefault();
      instance.setViewState((viewState) =>
        viewState.set(
          "interactionMode",
          PSPDFKit.InteractionMode.INK_SIGNATURE
        )
      );
    }
  });

  instance.addEventListener("annotations.create", (annotations) => {
    const annotation = annotations.first();
    if (
      annotation instanceof PSPDFKit.Annotations.InkAnnotation &&
      annotation.isSignature
    ) {
      if (currentInkSignatureWidget) {
        const newSize = fitIn(
          {
            width: annotation.boundingBox.width,
            height: annotation.boundingBox.height
          },
          {
            width: currentInkSignatureWidget.boundingBox.width,
            height: currentInkSignatureWidget.boundingBox.height
          }
        );
        const resizeRatio =
          newSize.width / annotation.boundingBox.width;
        const newLeft =
          currentInkSignatureWidget.boundingBox.left +
          currentInkSignatureWidget.boundingBox.width / 2 -
          newSize.width / 2;
        const newTop =
          currentInkSignatureWidget.boundingBox.top +
          currentInkSignatureWidget.boundingBox.height / 2 -
          newSize.height / 2;
        const newLines = annotation.lines.map((line) => {
          return line.map((point) => {
            return new PSPDFKit.Geometry.DrawingPoint({
              x:
                newLeft +
                (point.x - annotation.boundingBox.left) * resizeRatio,
              y:
                newTop +
                (point.y - annotation.boundingBox.top) * resizeRatio
            });
          });
        });
        const newBoundingBox = new PSPDFKit.Geometry.Rect({
          left: newLeft,
          top: newTop,
          width: newSize.width,
          height: newSize.height
        });
        instance.update(
          annotation
            .set("boundingBox", newBoundingBox)
            .set("lines", newLines)
            .set("lineWidth", annotation.lineWidth * resizeRatio)
        );
        currentInkSignatureWidget = null;
      }
    }
  });
});

This has been tested with PSPDFKit for Web 2019.3.1.