@vertexvis/doc-viewer 1.0.0-canary.4 → 1.0.0-canary.6

package/dist/cjs/doc-viewer.cjs.js

@@ -21,7 +21,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await index.globalScripts();
-  return index.bootstrapLazy([["vertex-document-viewer.cjs",[[257,"vertex-document-viewer",{"src":[1],"documentId":[513,"document-id"],"provider":[1040],"interactionMode":[1,"interaction-mode"],"documentState":[1040],"layers":[1040],"config":[16],"resizeDebounce":[2,"resize-debounce"],"panByDelta":[64],"zoomTo":[64],"loadPage":[64]},null,{"src":[{"handleSrcChange":0}],"config":[{"handleConfigChange":0}],"interactionMode":[{"handleInteractionModeChange":0}]}]]]], options);
+  return index.bootstrapLazy([["vertex-document-viewer.cjs",[[257,"vertex-document-viewer",{"src":[1],"documentId":[513,"document-id"],"provider":[1040],"interactionMode":[1,"interaction-mode"],"documentState":[1040],"layers":[1040],"config":[16],"resizeDebounce":[2,"resize-debounce"],"registerBasicInteractionHandler":[64],"panByDelta":[64],"zoomTo":[64],"loadPage":[64]},null,{"src":[{"handleSrcChange":0}],"config":[{"handleConfigChange":0}],"interactionMode":[{"handleInteractionModeChange":0}]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/cjs/loader.cjs.js

@@ -8,7 +8,7 @@ var index = require('./index-UmtQ5Ckn.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await index.globalScripts();
-  return index.bootstrapLazy([["vertex-document-viewer.cjs",[[257,"vertex-document-viewer",{"src":[1],"documentId":[513,"document-id"],"provider":[1040],"interactionMode":[1,"interaction-mode"],"documentState":[1040],"layers":[1040],"config":[16],"resizeDebounce":[2,"resize-debounce"],"panByDelta":[64],"zoomTo":[64],"loadPage":[64]},null,{"src":[{"handleSrcChange":0}],"config":[{"handleConfigChange":0}],"interactionMode":[{"handleInteractionModeChange":0}]}]]]], options);
+  return index.bootstrapLazy([["vertex-document-viewer.cjs",[[257,"vertex-document-viewer",{"src":[1],"documentId":[513,"document-id"],"provider":[1040],"interactionMode":[1,"interaction-mode"],"documentState":[1040],"layers":[1040],"config":[16],"resizeDebounce":[2,"resize-debounce"],"registerBasicInteractionHandler":[64],"panByDelta":[64],"zoomTo":[64],"loadPage":[64]},null,{"src":[{"handleSrcChange":0}],"config":[{"handleConfigChange":0}],"interactionMode":[{"handleInteractionModeChange":0}]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/vertex-document-viewer.cjs.entry.js

@@ -34636,6 +34636,7 @@ const VertexDocumentViewer = class {
          */
         this.resizeDebounce = 100;
         this.dimensions = dimensions.create(0, 0);
+        this.interactionHandlers = [];
     }
     componentWillLoad() {
         this.handleElementResize = this.handleElementResize.bind(this);
@@ -34660,6 +34661,29 @@ const VertexDocumentViewer = class {
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
         this.clearCurrentDocument();
     }
+    /**
+     * Registers and initializes an interaction handler with the document viewer. Returns a
+     * `Disposable` that should be used to deregister the interaction handler.
+     *
+     * `InteractionHandler`s are used to build custom mouse and touch interactions.
+     *
+     * @param interactionHandler The interaction handler to register.
+     * @returns {Promise<void>} A promise containing the disposable to use to
+     *  deregister the handler.
+     */
+    async registerBasicInteractionHandler(interactionHandler) {
+        this.interactionHandlers.push(interactionHandler);
+        this.initializeInteractionHandler(interactionHandler);
+        return {
+            dispose: () => {
+                const index = this.interactionHandlers.indexOf(interactionHandler);
+                if (index !== -1) {
+                    this.interactionHandlers[index].dispose();
+                    this.interactionHandlers.splice(index, 1);
+                }
+            },
+        };
+    }
     /**
      * Pans the currently loaded document by the specified delta.
      *
@@ -34718,9 +34742,9 @@ const VertexDocumentViewer = class {
         this.updateInteractionHandler();
     }
     render() {
-        return (index.h(index.Host, { key: '9ebb0012f2edde7189b42f35fd2ecefb779b16ef' }, index.h("div", { key: 'ef52dd8c6367213d173f3847ff65deac1da6620e', ref: ref => (this.viewerContainerElement = ref), class: "viewer-container", onContextMenu: event => event.preventDefault() }, index.h("div", { key: 'db0bede43e0798c1c8097f8079d1bbf4bea3fe15', ref: ref => (this.canvasContainerElement = ref), class: classNames('canvas-container', {
+        return (index.h(index.Host, { key: '45d2a2dceb6008a12702493edc50337f5d3568f7' }, index.h("div", { key: '862161f98d61fdf01996202e3e9be6281eea62ae', ref: ref => (this.viewerContainerElement = ref), class: "viewer-container", onContextMenu: event => event.preventDefault() }, index.h("div", { key: '05936dfbd06a9b0a05f21d7ada870a40109e93d0', ref: ref => (this.canvasContainerElement = ref), class: classNames('canvas-container', {
                 'enable-pointer-events ': window.PointerEvent != null,
-            }) }, index.h("canvas", { key: '3a705edd1985b11256e565880298a729a5e7260b', role: "presentation", ref: el => (this.canvasEl = el) })), index.h("slot", { key: '9ccb82cc0493342c4e4caf7188c23ad8a55ca93b' }))));
+            }) }, index.h("canvas", { key: '230fc4741a7eb3c621d93056ab959d3cfd3d9a20', role: "presentation", ref: el => (this.canvasEl = el) })), index.h("slot", { key: '6720a16f6e5ee1bfd605dc8adb6413a4f6d44e24' }))));
     }
     getDocumentApi() {
         if (this.documentApi == null) {
@@ -34786,6 +34810,12 @@ const VertexDocumentViewer = class {
             await ((_a = this.documentApi) === null || _a === void 0 ? void 0 : _a.updateViewport(this.dimensions));
         }, this.resizeDebounce);
     }
+    initializeInteractionHandler(handler) {
+        if (this.canvasEl == null) {
+            throw new Error('Cannot initialize interaction handler');
+        }
+        handler.initialize(this.canvasEl);
+    }
     get hostEl() { return index.getElement(this); }
     static get watchers() { return {
         "src": [{

package/dist/collection/components/document-viewer/document-viewer.js

@@ -27,6 +27,7 @@ export class VertexDocumentViewer {
          */
         this.resizeDebounce = 100;
         this.dimensions = Dimensions.create(0, 0);
+        this.interactionHandlers = [];
     }
     componentWillLoad() {
         this.handleElementResize = this.handleElementResize.bind(this);
@@ -51,6 +52,29 @@ export class VertexDocumentViewer {
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
         this.clearCurrentDocument();
     }
+    /**
+     * Registers and initializes an interaction handler with the document viewer. Returns a
+     * `Disposable` that should be used to deregister the interaction handler.
+     *
+     * `InteractionHandler`s are used to build custom mouse and touch interactions.
+     *
+     * @param interactionHandler The interaction handler to register.
+     * @returns {Promise<void>} A promise containing the disposable to use to
+     *  deregister the handler.
+     */
+    async registerBasicInteractionHandler(interactionHandler) {
+        this.interactionHandlers.push(interactionHandler);
+        this.initializeInteractionHandler(interactionHandler);
+        return {
+            dispose: () => {
+                const index = this.interactionHandlers.indexOf(interactionHandler);
+                if (index !== -1) {
+                    this.interactionHandlers[index].dispose();
+                    this.interactionHandlers.splice(index, 1);
+                }
+            },
+        };
+    }
     /**
      * Pans the currently loaded document by the specified delta.
      *
@@ -109,9 +133,9 @@ export class VertexDocumentViewer {
         this.updateInteractionHandler();
     }
     render() {
-        return (h(Host, { key: '9ebb0012f2edde7189b42f35fd2ecefb779b16ef' }, h("div", { key: 'ef52dd8c6367213d173f3847ff65deac1da6620e', ref: ref => (this.viewerContainerElement = ref), class: "viewer-container", onContextMenu: event => event.preventDefault() }, h("div", { key: 'db0bede43e0798c1c8097f8079d1bbf4bea3fe15', ref: ref => (this.canvasContainerElement = ref), class: classNames('canvas-container', {
+        return (h(Host, { key: '45d2a2dceb6008a12702493edc50337f5d3568f7' }, h("div", { key: '862161f98d61fdf01996202e3e9be6281eea62ae', ref: ref => (this.viewerContainerElement = ref), class: "viewer-container", onContextMenu: event => event.preventDefault() }, h("div", { key: '05936dfbd06a9b0a05f21d7ada870a40109e93d0', ref: ref => (this.canvasContainerElement = ref), class: classNames('canvas-container', {
                 'enable-pointer-events ': window.PointerEvent != null,
-            }) }, h("canvas", { key: '3a705edd1985b11256e565880298a729a5e7260b', role: "presentation", ref: el => (this.canvasEl = el) })), h("slot", { key: '9ccb82cc0493342c4e4caf7188c23ad8a55ca93b' }))));
+            }) }, h("canvas", { key: '230fc4741a7eb3c621d93056ab959d3cfd3d9a20', role: "presentation", ref: el => (this.canvasEl = el) })), h("slot", { key: '6720a16f6e5ee1bfd605dc8adb6413a4f6d44e24' }))));
     }
     getDocumentApi() {
         if (this.documentApi == null) {
@@ -177,6 +201,12 @@ export class VertexDocumentViewer {
             await ((_a = this.documentApi) === null || _a === void 0 ? void 0 : _a.updateViewport(this.dimensions));
         }, this.resizeDebounce);
     }
+    initializeInteractionHandler(handler) {
+        if (this.canvasEl == null) {
+            throw new Error('Cannot initialize interaction handler');
+        }
+        handler.initialize(this.canvasEl);
+    }
     static get is() { return "vertex-document-viewer"; }
     static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
@@ -460,6 +490,45 @@ export class VertexDocumentViewer {
     }
     static get methods() {
         return {
+            "registerBasicInteractionHandler": {
+                "complexType": {
+                    "signature": "(interactionHandler: BasicInteractionHandler) => Promise<Disposable>",
+                    "parameters": [{
+                            "name": "interactionHandler",
+                            "type": "BasicInteractionHandler",
+                            "docs": "The interaction handler to register."
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "Disposable": {
+                            "location": "import",
+                            "path": "@vertexvis/utils",
+                            "id": "../utils/dist/index.d.ts::Disposable",
+                            "referenceLocation": "Disposable"
+                        },
+                        "BasicInteractionHandler": {
+                            "location": "import",
+                            "path": "@vertexvis/utils",
+                            "id": "../utils/dist/index.d.ts::BasicInteractionHandler",
+                            "referenceLocation": "BasicInteractionHandler"
+                        }
+                    },
+                    "return": "Promise<Disposable>"
+                },
+                "docs": {
+                    "text": "Registers and initializes an interaction handler with the document viewer. Returns a\n`Disposable` that should be used to deregister the interaction handler.\n\n`InteractionHandler`s are used to build custom mouse and touch interactions.",
+                    "tags": [{
+                            "name": "param",
+                            "text": "interactionHandler The interaction handler to register."
+                        }, {
+                            "name": "returns",
+                            "text": "A promise containing the disposable to use to\nderegister the handler."
+                        }]
+                }
+            },
             "panByDelta": {
                 "complexType": {
                     "signature": "(delta: Point.Point) => Promise<void>",