@embedpdf/plugin-pan 1.0.1 → 1.0.2

package/dist/index.cjs

@@ -46,7 +46,14 @@ var PanPlugin = class extends import_core.BasePlugin {
   buildCapability() {
     return {
       enablePan: () => this.interactionManager.activate("panMode"),
-      disablePan: () => this.interactionManager.activate("default")
+      disablePan: () => this.interactionManager.activate("default"),
+      togglePan: () => {
+        if (this.interactionManager.getActiveMode() === "panMode") {
+          this.interactionManager.activate("default");
+        } else {
+          this.interactionManager.activate("panMode");
+        }
+      }
     };
   }
 };

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/lib/pan-plugin.ts","../src/lib/manifest.ts","../src/lib/index.ts"],"sourcesContent":["export * from './lib';\n","import { BasePlugin, PluginRegistry } from '@embedpdf/core';\nimport {\n  InteractionManagerCapability,\n  InteractionManagerPlugin,\n} from '@embedpdf/plugin-interaction-manager';\n\nimport { PanCapability, PanPluginConfig } from './types';\n\nexport class PanPlugin extends BasePlugin<PanPluginConfig, PanCapability> {\n  static readonly id = 'pan' as const;\n\n  private interactionManager: InteractionManagerCapability;\n\n  constructor(id: string, registry: PluginRegistry) {\n    super(id, registry);\n\n    this.interactionManager = registry\n      .getPlugin<InteractionManagerPlugin>(InteractionManagerPlugin.id)\n      ?.provides()!;\n\n    this.interactionManager.registerMode({\n      id: 'panMode',\n      scope: 'global',\n      exclusive: false,\n      cursor: 'grab',\n    });\n  }\n\n  async initialize(_: PanPluginConfig): Promise<void> {}\n\n  protected buildCapability(): PanCapability {\n    return {\n      enablePan: () => this.interactionManager.activate('panMode'),\n      disablePan: () => this.interactionManager.activate('default'),\n    };\n  }\n}\n","import { PluginManifest } from '@embedpdf/core';\nimport { PanPluginConfig } from './types';\n\nexport const PAN_PLUGIN_ID = 'pan';\n\nexport const manifest: PluginManifest<PanPluginConfig> = {\n  id: PAN_PLUGIN_ID,\n  name: 'Pan Plugin',\n  version: '1.0.0',\n  provides: ['pan'],\n  requires: ['interaction-manager'],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { PluginPackage } from '@embedpdf/core';\n\nimport { PanPlugin } from './pan-plugin';\nimport { manifest, PAN_PLUGIN_ID } from './manifest';\nimport { PanPluginConfig } from './types';\n\nexport const PanPluginPackage: PluginPackage<PanPlugin, PanPluginConfig> = {\n  manifest,\n  create: (registry) => new PanPlugin(PAN_PLUGIN_ID, registry),\n  reducer: () => {},\n  initialState: {},\n};\n\nexport * from './pan-plugin';\nexport * from './types';\nexport * from './manifest';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,kBAA2C;AAC3C,wCAGO;AAIA,IAAM,YAAN,cAAwB,uBAA2C;AAAA,EAKxE,YAAY,IAAY,UAA0B;AAChD,UAAM,IAAI,QAAQ;AAElB,SAAK,qBAAqB,SACvB,UAAoC,2DAAyB,EAAE,GAC9D,SAAS;AAEb,SAAK,mBAAmB,aAAa;AAAA,MACnC,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,MACX,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAAA,EAEA,MAAM,WAAW,GAAmC;AAAA,EAAC;AAAA,EAE3C,kBAAiC;AACzC,WAAO;AAAA,MACL,WAAW,MAAM,KAAK,mBAAmB,SAAS,SAAS;AAAA,MAC3D,YAAY,MAAM,KAAK,mBAAmB,SAAS,SAAS;AAAA,IAC9D;AAAA,EACF;AACF;AA5Ba,UACK,KAAK;;;ACNhB,IAAM,gBAAgB;AAEtB,IAAM,WAA4C;AAAA,EACvD,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU,CAAC,KAAK;AAAA,EAChB,UAAU,CAAC,qBAAqB;AAAA,EAChC,UAAU,CAAC;AAAA,EACX,eAAe;AAAA,IACb,SAAS;AAAA,EACX;AACF;;;ACTO,IAAM,mBAA8D;AAAA,EACzE;AAAA,EACA,QAAQ,CAAC,aAAa,IAAI,UAAU,eAAe,QAAQ;AAAA,EAC3D,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,cAAc,CAAC;AACjB;","names":[]}
+{"version":3,"sources":["../src/index.ts","../src/lib/pan-plugin.ts","../src/lib/manifest.ts","../src/lib/index.ts"],"sourcesContent":["export * from './lib';\n","import { BasePlugin, PluginRegistry } from '@embedpdf/core';\nimport {\n  InteractionManagerCapability,\n  InteractionManagerPlugin,\n} from '@embedpdf/plugin-interaction-manager';\n\nimport { PanCapability, PanPluginConfig } from './types';\n\nexport class PanPlugin extends BasePlugin<PanPluginConfig, PanCapability> {\n  static readonly id = 'pan' as const;\n\n  private interactionManager: InteractionManagerCapability;\n\n  constructor(id: string, registry: PluginRegistry) {\n    super(id, registry);\n\n    this.interactionManager = registry\n      .getPlugin<InteractionManagerPlugin>(InteractionManagerPlugin.id)\n      ?.provides()!;\n\n    this.interactionManager.registerMode({\n      id: 'panMode',\n      scope: 'global',\n      exclusive: false,\n      cursor: 'grab',\n    });\n  }\n\n  async initialize(_: PanPluginConfig): Promise<void> {}\n\n  protected buildCapability(): PanCapability {\n    return {\n      enablePan: () => this.interactionManager.activate('panMode'),\n      disablePan: () => this.interactionManager.activate('default'),\n      togglePan: () => {\n        if (this.interactionManager.getActiveMode() === 'panMode') {\n          this.interactionManager.activate('default');\n        } else {\n          this.interactionManager.activate('panMode');\n        }\n      },\n    };\n  }\n}\n","import { PluginManifest } from '@embedpdf/core';\nimport { PanPluginConfig } from './types';\n\nexport const PAN_PLUGIN_ID = 'pan';\n\nexport const manifest: PluginManifest<PanPluginConfig> = {\n  id: PAN_PLUGIN_ID,\n  name: 'Pan Plugin',\n  version: '1.0.0',\n  provides: ['pan'],\n  requires: ['interaction-manager'],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { PluginPackage } from '@embedpdf/core';\n\nimport { PanPlugin } from './pan-plugin';\nimport { manifest, PAN_PLUGIN_ID } from './manifest';\nimport { PanPluginConfig } from './types';\n\nexport const PanPluginPackage: PluginPackage<PanPlugin, PanPluginConfig> = {\n  manifest,\n  create: (registry) => new PanPlugin(PAN_PLUGIN_ID, registry),\n  reducer: () => {},\n  initialState: {},\n};\n\nexport * from './pan-plugin';\nexport * from './types';\nexport * from './manifest';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,kBAA2C;AAC3C,wCAGO;AAIA,IAAM,YAAN,cAAwB,uBAA2C;AAAA,EAKxE,YAAY,IAAY,UAA0B;AAChD,UAAM,IAAI,QAAQ;AAElB,SAAK,qBAAqB,SACvB,UAAoC,2DAAyB,EAAE,GAC9D,SAAS;AAEb,SAAK,mBAAmB,aAAa;AAAA,MACnC,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,MACX,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAAA,EAEA,MAAM,WAAW,GAAmC;AAAA,EAAC;AAAA,EAE3C,kBAAiC;AACzC,WAAO;AAAA,MACL,WAAW,MAAM,KAAK,mBAAmB,SAAS,SAAS;AAAA,MAC3D,YAAY,MAAM,KAAK,mBAAmB,SAAS,SAAS;AAAA,MAC5D,WAAW,MAAM;AACf,YAAI,KAAK,mBAAmB,cAAc,MAAM,WAAW;AACzD,eAAK,mBAAmB,SAAS,SAAS;AAAA,QAC5C,OAAO;AACL,eAAK,mBAAmB,SAAS,SAAS;AAAA,QAC5C;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAnCa,UACK,KAAK;;;ACNhB,IAAM,gBAAgB;AAEtB,IAAM,WAA4C;AAAA,EACvD,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU,CAAC,KAAK;AAAA,EAChB,UAAU,CAAC,qBAAqB;AAAA,EAChC,UAAU,CAAC;AAAA,EACX,eAAe;AAAA,IACb,SAAS;AAAA,EACX;AACF;;;ACTO,IAAM,mBAA8D;AAAA,EACzE;AAAA,EACA,QAAQ,CAAC,aAAa,IAAI,UAAU,eAAe,QAAQ;AAAA,EAC3D,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,cAAc,CAAC;AACjB;","names":[]}

package/dist/index.d.cts

@@ -5,6 +5,7 @@ interface PanPluginConfig extends BasePluginConfig {
 interface PanCapability {
     enablePan: () => void;
     disablePan: () => void;
+    togglePan: () => void;
 }
 
 declare class PanPlugin extends BasePlugin<PanPluginConfig, PanCapability> {

package/dist/index.d.ts

@@ -5,6 +5,7 @@ interface PanPluginConfig extends BasePluginConfig {
 interface PanCapability {
     enablePan: () => void;
     disablePan: () => void;
+    togglePan: () => void;
 }
 
 declare class PanPlugin extends BasePlugin<PanPluginConfig, PanCapability> {

package/dist/index.js

@@ -19,7 +19,14 @@ var PanPlugin = class extends BasePlugin {
   buildCapability() {
     return {
       enablePan: () => this.interactionManager.activate("panMode"),
-      disablePan: () => this.interactionManager.activate("default")
+      disablePan: () => this.interactionManager.activate("default"),
+      togglePan: () => {
+        if (this.interactionManager.getActiveMode() === "panMode") {
+          this.interactionManager.activate("default");
+        } else {
+          this.interactionManager.activate("panMode");
+        }
+      }
     };
   }
 };

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/lib/pan-plugin.ts","../src/lib/manifest.ts","../src/lib/index.ts"],"sourcesContent":["import { BasePlugin, PluginRegistry } from '@embedpdf/core';\nimport {\n  InteractionManagerCapability,\n  InteractionManagerPlugin,\n} from '@embedpdf/plugin-interaction-manager';\n\nimport { PanCapability, PanPluginConfig } from './types';\n\nexport class PanPlugin extends BasePlugin<PanPluginConfig, PanCapability> {\n  static readonly id = 'pan' as const;\n\n  private interactionManager: InteractionManagerCapability;\n\n  constructor(id: string, registry: PluginRegistry) {\n    super(id, registry);\n\n    this.interactionManager = registry\n      .getPlugin<InteractionManagerPlugin>(InteractionManagerPlugin.id)\n      ?.provides()!;\n\n    this.interactionManager.registerMode({\n      id: 'panMode',\n      scope: 'global',\n      exclusive: false,\n      cursor: 'grab',\n    });\n  }\n\n  async initialize(_: PanPluginConfig): Promise<void> {}\n\n  protected buildCapability(): PanCapability {\n    return {\n      enablePan: () => this.interactionManager.activate('panMode'),\n      disablePan: () => this.interactionManager.activate('default'),\n    };\n  }\n}\n","import { PluginManifest } from '@embedpdf/core';\nimport { PanPluginConfig } from './types';\n\nexport const PAN_PLUGIN_ID = 'pan';\n\nexport const manifest: PluginManifest<PanPluginConfig> = {\n  id: PAN_PLUGIN_ID,\n  name: 'Pan Plugin',\n  version: '1.0.0',\n  provides: ['pan'],\n  requires: ['interaction-manager'],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { PluginPackage } from '@embedpdf/core';\n\nimport { PanPlugin } from './pan-plugin';\nimport { manifest, PAN_PLUGIN_ID } from './manifest';\nimport { PanPluginConfig } from './types';\n\nexport const PanPluginPackage: PluginPackage<PanPlugin, PanPluginConfig> = {\n  manifest,\n  create: (registry) => new PanPlugin(PAN_PLUGIN_ID, registry),\n  reducer: () => {},\n  initialState: {},\n};\n\nexport * from './pan-plugin';\nexport * from './types';\nexport * from './manifest';\n"],"mappings":";AAAA,SAAS,kBAAkC;AAC3C;AAAA,EAEE;AAAA,OACK;AAIA,IAAM,YAAN,cAAwB,WAA2C;AAAA,EAKxE,YAAY,IAAY,UAA0B;AAChD,UAAM,IAAI,QAAQ;AAElB,SAAK,qBAAqB,SACvB,UAAoC,yBAAyB,EAAE,GAC9D,SAAS;AAEb,SAAK,mBAAmB,aAAa;AAAA,MACnC,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,MACX,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAAA,EAEA,MAAM,WAAW,GAAmC;AAAA,EAAC;AAAA,EAE3C,kBAAiC;AACzC,WAAO;AAAA,MACL,WAAW,MAAM,KAAK,mBAAmB,SAAS,SAAS;AAAA,MAC3D,YAAY,MAAM,KAAK,mBAAmB,SAAS,SAAS;AAAA,IAC9D;AAAA,EACF;AACF;AA5Ba,UACK,KAAK;;;ACNhB,IAAM,gBAAgB;AAEtB,IAAM,WAA4C;AAAA,EACvD,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU,CAAC,KAAK;AAAA,EAChB,UAAU,CAAC,qBAAqB;AAAA,EAChC,UAAU,CAAC;AAAA,EACX,eAAe;AAAA,IACb,SAAS;AAAA,EACX;AACF;;;ACTO,IAAM,mBAA8D;AAAA,EACzE;AAAA,EACA,QAAQ,CAAC,aAAa,IAAI,UAAU,eAAe,QAAQ;AAAA,EAC3D,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,cAAc,CAAC;AACjB;","names":[]}
+{"version":3,"sources":["../src/lib/pan-plugin.ts","../src/lib/manifest.ts","../src/lib/index.ts"],"sourcesContent":["import { BasePlugin, PluginRegistry } from '@embedpdf/core';\nimport {\n  InteractionManagerCapability,\n  InteractionManagerPlugin,\n} from '@embedpdf/plugin-interaction-manager';\n\nimport { PanCapability, PanPluginConfig } from './types';\n\nexport class PanPlugin extends BasePlugin<PanPluginConfig, PanCapability> {\n  static readonly id = 'pan' as const;\n\n  private interactionManager: InteractionManagerCapability;\n\n  constructor(id: string, registry: PluginRegistry) {\n    super(id, registry);\n\n    this.interactionManager = registry\n      .getPlugin<InteractionManagerPlugin>(InteractionManagerPlugin.id)\n      ?.provides()!;\n\n    this.interactionManager.registerMode({\n      id: 'panMode',\n      scope: 'global',\n      exclusive: false,\n      cursor: 'grab',\n    });\n  }\n\n  async initialize(_: PanPluginConfig): Promise<void> {}\n\n  protected buildCapability(): PanCapability {\n    return {\n      enablePan: () => this.interactionManager.activate('panMode'),\n      disablePan: () => this.interactionManager.activate('default'),\n      togglePan: () => {\n        if (this.interactionManager.getActiveMode() === 'panMode') {\n          this.interactionManager.activate('default');\n        } else {\n          this.interactionManager.activate('panMode');\n        }\n      },\n    };\n  }\n}\n","import { PluginManifest } from '@embedpdf/core';\nimport { PanPluginConfig } from './types';\n\nexport const PAN_PLUGIN_ID = 'pan';\n\nexport const manifest: PluginManifest<PanPluginConfig> = {\n  id: PAN_PLUGIN_ID,\n  name: 'Pan Plugin',\n  version: '1.0.0',\n  provides: ['pan'],\n  requires: ['interaction-manager'],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { PluginPackage } from '@embedpdf/core';\n\nimport { PanPlugin } from './pan-plugin';\nimport { manifest, PAN_PLUGIN_ID } from './manifest';\nimport { PanPluginConfig } from './types';\n\nexport const PanPluginPackage: PluginPackage<PanPlugin, PanPluginConfig> = {\n  manifest,\n  create: (registry) => new PanPlugin(PAN_PLUGIN_ID, registry),\n  reducer: () => {},\n  initialState: {},\n};\n\nexport * from './pan-plugin';\nexport * from './types';\nexport * from './manifest';\n"],"mappings":";AAAA,SAAS,kBAAkC;AAC3C;AAAA,EAEE;AAAA,OACK;AAIA,IAAM,YAAN,cAAwB,WAA2C;AAAA,EAKxE,YAAY,IAAY,UAA0B;AAChD,UAAM,IAAI,QAAQ;AAElB,SAAK,qBAAqB,SACvB,UAAoC,yBAAyB,EAAE,GAC9D,SAAS;AAEb,SAAK,mBAAmB,aAAa;AAAA,MACnC,IAAI;AAAA,MACJ,OAAO;AAAA,MACP,WAAW;AAAA,MACX,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAAA,EAEA,MAAM,WAAW,GAAmC;AAAA,EAAC;AAAA,EAE3C,kBAAiC;AACzC,WAAO;AAAA,MACL,WAAW,MAAM,KAAK,mBAAmB,SAAS,SAAS;AAAA,MAC3D,YAAY,MAAM,KAAK,mBAAmB,SAAS,SAAS;AAAA,MAC5D,WAAW,MAAM;AACf,YAAI,KAAK,mBAAmB,cAAc,MAAM,WAAW;AACzD,eAAK,mBAAmB,SAAS,SAAS;AAAA,QAC5C,OAAO;AACL,eAAK,mBAAmB,SAAS,SAAS;AAAA,QAC5C;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAnCa,UACK,KAAK;;;ACNhB,IAAM,gBAAgB;AAEtB,IAAM,WAA4C;AAAA,EACvD,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU,CAAC,KAAK;AAAA,EAChB,UAAU,CAAC,qBAAqB;AAAA,EAChC,UAAU,CAAC;AAAA,EACX,eAAe;AAAA,IACb,SAAS;AAAA,EACX;AACF;;;ACTO,IAAM,mBAA8D;AAAA,EACzE;AAAA,EACA,QAAQ,CAAC,aAAa,IAAI,UAAU,eAAe,QAAQ;AAAA,EAC3D,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,cAAc,CAAC;AACjB;","names":[]}

package/dist/preact/index.cjs

@@ -21,6 +21,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var preact_exports = {};
 __export(preact_exports, {
   PanMode: () => PanMode,
+  usePan: () => usePan,
   usePanCapability: () => usePanCapability,
   usePanPlugin: () => usePanPlugin
 });
@@ -28,21 +29,38 @@ module.exports = __toCommonJS(preact_exports);
 
 // src/preact/hooks/use-pan.ts
 var import_preact = require("@embedpdf/core/preact");
+var import_preact2 = require("@embedpdf/plugin-interaction-manager/preact");
 var import_plugin_pan = require("@embedpdf/plugin-pan");
+var import_hooks = require("preact/hooks");
 var usePanPlugin = () => (0, import_preact.usePlugin)(import_plugin_pan.PanPlugin.id);
 var usePanCapability = () => (0, import_preact.useCapability)(import_plugin_pan.PanPlugin.id);
+var usePan = () => {
+  const { provides } = usePanCapability();
+  const { provides: interactionManager } = (0, import_preact2.useInteractionManagerCapability)();
+  const [isPanning, setIsPanning] = (0, import_hooks.useState)(false);
+  (0, import_hooks.useEffect)(() => {
+    if (!interactionManager) return;
+    return interactionManager.onStateChange((state) => {
+      setIsPanning(state.activeMode === "panMode");
+    });
+  }, [interactionManager]);
+  return {
+    provides,
+    isPanning
+  };
+};
 
 // src/preact/components/pan-mode.tsx
-var import_hooks = require("preact/hooks");
-var import_preact2 = require("@embedpdf/plugin-interaction-manager/preact");
-var import_preact3 = require("@embedpdf/plugin-viewport/preact");
+var import_hooks2 = require("preact/hooks");
+var import_preact3 = require("@embedpdf/plugin-interaction-manager/preact");
+var import_preact4 = require("@embedpdf/plugin-viewport/preact");
 var import_jsx_runtime = require("preact/jsx-runtime");
 var PanMode = () => {
-  const { register } = (0, import_preact2.usePointerHandlers)({ modeId: "panMode" });
-  const { setCursor, removeCursor } = (0, import_preact2.useCursor)();
-  const { provides: viewport } = (0, import_preact3.useViewportCapability)();
-  const dragRef = (0, import_hooks.useRef)(null);
-  const handlers = (0, import_hooks.useMemo)(
+  const { register } = (0, import_preact3.usePointerHandlers)({ modeId: "panMode" });
+  const { setCursor, removeCursor } = (0, import_preact3.useCursor)();
+  const { provides: viewport } = (0, import_preact4.useViewportCapability)();
+  const dragRef = (0, import_hooks2.useRef)(null);
+  const handlers = (0, import_hooks2.useMemo)(
     () => ({
       onPointerDown: (_, pe) => {
         if (!viewport) return;
@@ -86,7 +104,7 @@ var PanMode = () => {
     }),
     [viewport, setCursor, removeCursor]
   );
-  (0, import_hooks.useEffect)(() => {
+  (0, import_hooks2.useEffect)(() => {
     if (!register) return;
     return register(handlers);
   }, [register, handlers]);
@@ -95,6 +113,7 @@ var PanMode = () => {
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   PanMode,
+  usePan,
   usePanCapability,
   usePanPlugin
 });

package/dist/preact/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/preact/index.ts","../../src/preact/hooks/use-pan.ts","../../src/preact/components/pan-mode.tsx"],"sourcesContent":["export * from './hooks';\nexport * from './components';\n","import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { PanPlugin } from '@embedpdf/plugin-pan';\n\nexport const usePanPlugin = () => usePlugin<PanPlugin>(PanPlugin.id);\nexport const usePanCapability = () => useCapability<PanPlugin>(PanPlugin.id);\n","/** @jsxImportSource preact */\nimport { useEffect, useMemo, useRef } from 'preact/hooks';\nimport type { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/preact';\nimport { useViewportCapability } from '@embedpdf/plugin-viewport/preact';\n\nexport const PanMode = () => {\n  const { register } = usePointerHandlers({ modeId: 'panMode' });\n  const { setCursor, removeCursor } = useCursor();\n  const { provides: viewport } = useViewportCapability();\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    startLeft: number;\n    startTop: number;\n  } | null>(null);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (_, pe) => {\n        if (!viewport) return;\n\n        const metrics = viewport.getMetrics();\n\n        dragRef.current = {\n          startX: pe.clientX,\n          startY: pe.clientY,\n          startLeft: metrics.scrollLeft,\n          startTop: metrics.scrollTop,\n        };\n\n        setCursor('panMode', 'grabbing', 10);\n      },\n      onPointerMove: (_, pe) => {\n        const drag = dragRef.current;\n        if (!drag || !viewport) return;\n\n        /* delta between current pointer position and where the drag started */\n        const dx = pe.clientX - drag.startX;\n        const dy = pe.clientY - drag.startY;\n\n        viewport.scrollTo({\n          x: drag.startLeft - dx,\n          y: drag.startTop - dy,\n        });\n      },\n      onPointerUp: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerLeave: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerCancel: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n    }),\n    [viewport, setCursor, removeCursor],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return <></>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAAyC;AACzC,wBAA0B;AAEnB,IAAM,eAAe,UAAM,yBAAqB,4BAAU,EAAE;AAC5D,IAAM,mBAAmB,UAAM,6BAAyB,4BAAU,EAAE;;;ACH3E,mBAA2C;AAE3C,IAAAA,iBAA8C;AAC9C,IAAAA,iBAAsC;AAyE7B;AAvEF,IAAM,UAAU,MAAM;AAC3B,QAAM,EAAE,SAAS,QAAI,mCAAmB,EAAE,QAAQ,UAAU,CAAC;AAC7D,QAAM,EAAE,WAAW,aAAa,QAAI,0BAAU;AAC9C,QAAM,EAAE,UAAU,SAAS,QAAI,sCAAsB;AAErD,QAAM,cAAU,qBAKN,IAAI;AAEd,QAAM,eAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,GAAG,OAAO;AACxB,YAAI,CAAC,SAAU;AAEf,cAAM,UAAU,SAAS,WAAW;AAEpC,gBAAQ,UAAU;AAAA,UAChB,QAAQ,GAAG;AAAA,UACX,QAAQ,GAAG;AAAA,UACX,WAAW,QAAQ;AAAA,UACnB,UAAU,QAAQ;AAAA,QACpB;AAEA,kBAAU,WAAW,YAAY,EAAE;AAAA,MACrC;AAAA,MACA,eAAe,CAAC,GAAG,OAAO;AACxB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,QAAQ,CAAC,SAAU;AAGxB,cAAM,KAAK,GAAG,UAAU,KAAK;AAC7B,cAAM,KAAK,GAAG,UAAU,KAAK;AAE7B,iBAAS,SAAS;AAAA,UAChB,GAAG,KAAK,YAAY;AAAA,UACpB,GAAG,KAAK,WAAW;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,aAAa,MAAM;AACjB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,gBAAgB,MAAM;AACpB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,iBAAiB,MAAM;AACrB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,UAAU,WAAW,YAAY;AAAA,EACpC;AAEA,8BAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SAAO,2EAAE;AACX;","names":["import_preact"]}
+{"version":3,"sources":["../../src/preact/index.ts","../../src/preact/hooks/use-pan.ts","../../src/preact/components/pan-mode.tsx"],"sourcesContent":["export * from './hooks';\nexport * from './components';\n","import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { useInteractionManagerCapability } from '@embedpdf/plugin-interaction-manager/preact';\nimport { PanPlugin } from '@embedpdf/plugin-pan';\nimport { useEffect, useState } from 'preact/hooks';\n\nexport const usePanPlugin = () => usePlugin<PanPlugin>(PanPlugin.id);\nexport const usePanCapability = () => useCapability<PanPlugin>(PanPlugin.id);\n\nexport const usePan = () => {\n  const { provides } = usePanCapability();\n  const { provides: interactionManager } = useInteractionManagerCapability();\n\n  const [isPanning, setIsPanning] = useState(false);\n\n  useEffect(() => {\n    if (!interactionManager) return;\n    return interactionManager.onStateChange((state) => {\n      setIsPanning(state.activeMode === 'panMode');\n    });\n  }, [interactionManager]);\n\n  return {\n    provides,\n    isPanning,\n  };\n};\n","/** @jsxImportSource preact */\nimport { useEffect, useMemo, useRef } from 'preact/hooks';\nimport type { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/preact';\nimport { useViewportCapability } from '@embedpdf/plugin-viewport/preact';\n\nexport const PanMode = () => {\n  const { register } = usePointerHandlers({ modeId: 'panMode' });\n  const { setCursor, removeCursor } = useCursor();\n  const { provides: viewport } = useViewportCapability();\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    startLeft: number;\n    startTop: number;\n  } | null>(null);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (_, pe) => {\n        if (!viewport) return;\n\n        const metrics = viewport.getMetrics();\n\n        dragRef.current = {\n          startX: pe.clientX,\n          startY: pe.clientY,\n          startLeft: metrics.scrollLeft,\n          startTop: metrics.scrollTop,\n        };\n\n        setCursor('panMode', 'grabbing', 10);\n      },\n      onPointerMove: (_, pe) => {\n        const drag = dragRef.current;\n        if (!drag || !viewport) return;\n\n        /* delta between current pointer position and where the drag started */\n        const dx = pe.clientX - drag.startX;\n        const dy = pe.clientY - drag.startY;\n\n        viewport.scrollTo({\n          x: drag.startLeft - dx,\n          y: drag.startTop - dy,\n        });\n      },\n      onPointerUp: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerLeave: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerCancel: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n    }),\n    [viewport, setCursor, removeCursor],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return <></>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAAyC;AACzC,IAAAA,iBAAgD;AAChD,wBAA0B;AAC1B,mBAAoC;AAE7B,IAAM,eAAe,UAAM,yBAAqB,4BAAU,EAAE;AAC5D,IAAM,mBAAmB,UAAM,6BAAyB,4BAAU,EAAE;AAEpE,IAAM,SAAS,MAAM;AAC1B,QAAM,EAAE,SAAS,IAAI,iBAAiB;AACtC,QAAM,EAAE,UAAU,mBAAmB,QAAI,gDAAgC;AAEzE,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAEhD,8BAAU,MAAM;AACd,QAAI,CAAC,mBAAoB;AACzB,WAAO,mBAAmB,cAAc,CAAC,UAAU;AACjD,mBAAa,MAAM,eAAe,SAAS;AAAA,IAC7C,CAAC;AAAA,EACH,GAAG,CAAC,kBAAkB,CAAC;AAEvB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;;;ACxBA,IAAAC,gBAA2C;AAE3C,IAAAC,iBAA8C;AAC9C,IAAAA,iBAAsC;AAyE7B;AAvEF,IAAM,UAAU,MAAM;AAC3B,QAAM,EAAE,SAAS,QAAI,mCAAmB,EAAE,QAAQ,UAAU,CAAC;AAC7D,QAAM,EAAE,WAAW,aAAa,QAAI,0BAAU;AAC9C,QAAM,EAAE,UAAU,SAAS,QAAI,sCAAsB;AAErD,QAAM,cAAU,sBAKN,IAAI;AAEd,QAAM,eAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,GAAG,OAAO;AACxB,YAAI,CAAC,SAAU;AAEf,cAAM,UAAU,SAAS,WAAW;AAEpC,gBAAQ,UAAU;AAAA,UAChB,QAAQ,GAAG;AAAA,UACX,QAAQ,GAAG;AAAA,UACX,WAAW,QAAQ;AAAA,UACnB,UAAU,QAAQ;AAAA,QACpB;AAEA,kBAAU,WAAW,YAAY,EAAE;AAAA,MACrC;AAAA,MACA,eAAe,CAAC,GAAG,OAAO;AACxB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,QAAQ,CAAC,SAAU;AAGxB,cAAM,KAAK,GAAG,UAAU,KAAK;AAC7B,cAAM,KAAK,GAAG,UAAU,KAAK;AAE7B,iBAAS,SAAS;AAAA,UAChB,GAAG,KAAK,YAAY;AAAA,UACpB,GAAG,KAAK,WAAW;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,aAAa,MAAM;AACjB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,gBAAgB,MAAM;AACpB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,iBAAiB,MAAM;AACrB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,UAAU,WAAW,YAAY;AAAA,EACpC;AAEA,+BAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SAAO,2EAAE;AACX;","names":["import_preact","import_hooks","import_preact"]}

package/dist/preact/index.d.cts

@@ -12,7 +12,11 @@ declare const usePanCapability: () => {
     isLoading: boolean;
     ready: Promise<void>;
 };
+declare const usePan: () => {
+    provides: Readonly<_embedpdf_plugin_pan.PanCapability> | null;
+    isPanning: boolean;
+};
 
 declare const PanMode: () => preact.JSX.Element;
 
-export { PanMode, usePanCapability, usePanPlugin };
+export { PanMode, usePan, usePanCapability, usePanPlugin };

package/dist/preact/index.d.ts

@@ -12,7 +12,11 @@ declare const usePanCapability: () => {
     isLoading: boolean;
     ready: Promise<void>;
 };
+declare const usePan: () => {
+    provides: Readonly<_embedpdf_plugin_pan.PanCapability> | null;
+    isPanning: boolean;
+};
 
 declare const PanMode: () => preact.JSX.Element;
 
-export { PanMode, usePanCapability, usePanPlugin };
+export { PanMode, usePan, usePanCapability, usePanPlugin };

package/dist/preact/index.js

@@ -1,11 +1,28 @@
 // src/preact/hooks/use-pan.ts
 import { useCapability, usePlugin } from "@embedpdf/core/preact";
+import { useInteractionManagerCapability } from "@embedpdf/plugin-interaction-manager/preact";
 import { PanPlugin } from "@embedpdf/plugin-pan";
+import { useEffect, useState } from "preact/hooks";
 var usePanPlugin = () => usePlugin(PanPlugin.id);
 var usePanCapability = () => useCapability(PanPlugin.id);
+var usePan = () => {
+  const { provides } = usePanCapability();
+  const { provides: interactionManager } = useInteractionManagerCapability();
+  const [isPanning, setIsPanning] = useState(false);
+  useEffect(() => {
+    if (!interactionManager) return;
+    return interactionManager.onStateChange((state) => {
+      setIsPanning(state.activeMode === "panMode");
+    });
+  }, [interactionManager]);
+  return {
+    provides,
+    isPanning
+  };
+};
 
 // src/preact/components/pan-mode.tsx
-import { useEffect, useMemo, useRef } from "preact/hooks";
+import { useEffect as useEffect2, useMemo, useRef } from "preact/hooks";
 import { useCursor, usePointerHandlers } from "@embedpdf/plugin-interaction-manager/preact";
 import { useViewportCapability } from "@embedpdf/plugin-viewport/preact";
 import { Fragment, jsx } from "preact/jsx-runtime";
@@ -58,7 +75,7 @@ var PanMode = () => {
     }),
     [viewport, setCursor, removeCursor]
   );
-  useEffect(() => {
+  useEffect2(() => {
     if (!register) return;
     return register(handlers);
   }, [register, handlers]);
@@ -66,6 +83,7 @@ var PanMode = () => {
 };
 export {
   PanMode,
+  usePan,
   usePanCapability,
   usePanPlugin
 };

package/dist/preact/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/preact/hooks/use-pan.ts","../../src/preact/components/pan-mode.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { PanPlugin } from '@embedpdf/plugin-pan';\n\nexport const usePanPlugin = () => usePlugin<PanPlugin>(PanPlugin.id);\nexport const usePanCapability = () => useCapability<PanPlugin>(PanPlugin.id);\n","/** @jsxImportSource preact */\nimport { useEffect, useMemo, useRef } from 'preact/hooks';\nimport type { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/preact';\nimport { useViewportCapability } from '@embedpdf/plugin-viewport/preact';\n\nexport const PanMode = () => {\n  const { register } = usePointerHandlers({ modeId: 'panMode' });\n  const { setCursor, removeCursor } = useCursor();\n  const { provides: viewport } = useViewportCapability();\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    startLeft: number;\n    startTop: number;\n  } | null>(null);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (_, pe) => {\n        if (!viewport) return;\n\n        const metrics = viewport.getMetrics();\n\n        dragRef.current = {\n          startX: pe.clientX,\n          startY: pe.clientY,\n          startLeft: metrics.scrollLeft,\n          startTop: metrics.scrollTop,\n        };\n\n        setCursor('panMode', 'grabbing', 10);\n      },\n      onPointerMove: (_, pe) => {\n        const drag = dragRef.current;\n        if (!drag || !viewport) return;\n\n        /* delta between current pointer position and where the drag started */\n        const dx = pe.clientX - drag.startX;\n        const dy = pe.clientY - drag.startY;\n\n        viewport.scrollTo({\n          x: drag.startLeft - dx,\n          y: drag.startTop - dy,\n        });\n      },\n      onPointerUp: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerLeave: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerCancel: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n    }),\n    [viewport, setCursor, removeCursor],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return <></>;\n};\n"],"mappings":";AAAA,SAAS,eAAe,iBAAiB;AACzC,SAAS,iBAAiB;AAEnB,IAAM,eAAe,MAAM,UAAqB,UAAU,EAAE;AAC5D,IAAM,mBAAmB,MAAM,cAAyB,UAAU,EAAE;;;ACH3E,SAAS,WAAW,SAAS,cAAc;AAE3C,SAAS,WAAW,0BAA0B;AAC9C,SAAS,6BAA6B;AAyE7B;AAvEF,IAAM,UAAU,MAAM;AAC3B,QAAM,EAAE,SAAS,IAAI,mBAAmB,EAAE,QAAQ,UAAU,CAAC;AAC7D,QAAM,EAAE,WAAW,aAAa,IAAI,UAAU;AAC9C,QAAM,EAAE,UAAU,SAAS,IAAI,sBAAsB;AAErD,QAAM,UAAU,OAKN,IAAI;AAEd,QAAM,WAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,GAAG,OAAO;AACxB,YAAI,CAAC,SAAU;AAEf,cAAM,UAAU,SAAS,WAAW;AAEpC,gBAAQ,UAAU;AAAA,UAChB,QAAQ,GAAG;AAAA,UACX,QAAQ,GAAG;AAAA,UACX,WAAW,QAAQ;AAAA,UACnB,UAAU,QAAQ;AAAA,QACpB;AAEA,kBAAU,WAAW,YAAY,EAAE;AAAA,MACrC;AAAA,MACA,eAAe,CAAC,GAAG,OAAO;AACxB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,QAAQ,CAAC,SAAU;AAGxB,cAAM,KAAK,GAAG,UAAU,KAAK;AAC7B,cAAM,KAAK,GAAG,UAAU,KAAK;AAE7B,iBAAS,SAAS;AAAA,UAChB,GAAG,KAAK,YAAY;AAAA,UACpB,GAAG,KAAK,WAAW;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,aAAa,MAAM;AACjB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,gBAAgB,MAAM;AACpB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,iBAAiB,MAAM;AACrB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,UAAU,WAAW,YAAY;AAAA,EACpC;AAEA,YAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SAAO,gCAAE;AACX;","names":[]}
+{"version":3,"sources":["../../src/preact/hooks/use-pan.ts","../../src/preact/components/pan-mode.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { useInteractionManagerCapability } from '@embedpdf/plugin-interaction-manager/preact';\nimport { PanPlugin } from '@embedpdf/plugin-pan';\nimport { useEffect, useState } from 'preact/hooks';\n\nexport const usePanPlugin = () => usePlugin<PanPlugin>(PanPlugin.id);\nexport const usePanCapability = () => useCapability<PanPlugin>(PanPlugin.id);\n\nexport const usePan = () => {\n  const { provides } = usePanCapability();\n  const { provides: interactionManager } = useInteractionManagerCapability();\n\n  const [isPanning, setIsPanning] = useState(false);\n\n  useEffect(() => {\n    if (!interactionManager) return;\n    return interactionManager.onStateChange((state) => {\n      setIsPanning(state.activeMode === 'panMode');\n    });\n  }, [interactionManager]);\n\n  return {\n    provides,\n    isPanning,\n  };\n};\n","/** @jsxImportSource preact */\nimport { useEffect, useMemo, useRef } from 'preact/hooks';\nimport type { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/preact';\nimport { useViewportCapability } from '@embedpdf/plugin-viewport/preact';\n\nexport const PanMode = () => {\n  const { register } = usePointerHandlers({ modeId: 'panMode' });\n  const { setCursor, removeCursor } = useCursor();\n  const { provides: viewport } = useViewportCapability();\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    startLeft: number;\n    startTop: number;\n  } | null>(null);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (_, pe) => {\n        if (!viewport) return;\n\n        const metrics = viewport.getMetrics();\n\n        dragRef.current = {\n          startX: pe.clientX,\n          startY: pe.clientY,\n          startLeft: metrics.scrollLeft,\n          startTop: metrics.scrollTop,\n        };\n\n        setCursor('panMode', 'grabbing', 10);\n      },\n      onPointerMove: (_, pe) => {\n        const drag = dragRef.current;\n        if (!drag || !viewport) return;\n\n        /* delta between current pointer position and where the drag started */\n        const dx = pe.clientX - drag.startX;\n        const dy = pe.clientY - drag.startY;\n\n        viewport.scrollTo({\n          x: drag.startLeft - dx,\n          y: drag.startTop - dy,\n        });\n      },\n      onPointerUp: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerLeave: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerCancel: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n    }),\n    [viewport, setCursor, removeCursor],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return <></>;\n};\n"],"mappings":";AAAA,SAAS,eAAe,iBAAiB;AACzC,SAAS,uCAAuC;AAChD,SAAS,iBAAiB;AAC1B,SAAS,WAAW,gBAAgB;AAE7B,IAAM,eAAe,MAAM,UAAqB,UAAU,EAAE;AAC5D,IAAM,mBAAmB,MAAM,cAAyB,UAAU,EAAE;AAEpE,IAAM,SAAS,MAAM;AAC1B,QAAM,EAAE,SAAS,IAAI,iBAAiB;AACtC,QAAM,EAAE,UAAU,mBAAmB,IAAI,gCAAgC;AAEzE,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,YAAU,MAAM;AACd,QAAI,CAAC,mBAAoB;AACzB,WAAO,mBAAmB,cAAc,CAAC,UAAU;AACjD,mBAAa,MAAM,eAAe,SAAS;AAAA,IAC7C,CAAC;AAAA,EACH,GAAG,CAAC,kBAAkB,CAAC;AAEvB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;;;ACxBA,SAAS,aAAAA,YAAW,SAAS,cAAc;AAE3C,SAAS,WAAW,0BAA0B;AAC9C,SAAS,6BAA6B;AAyE7B;AAvEF,IAAM,UAAU,MAAM;AAC3B,QAAM,EAAE,SAAS,IAAI,mBAAmB,EAAE,QAAQ,UAAU,CAAC;AAC7D,QAAM,EAAE,WAAW,aAAa,IAAI,UAAU;AAC9C,QAAM,EAAE,UAAU,SAAS,IAAI,sBAAsB;AAErD,QAAM,UAAU,OAKN,IAAI;AAEd,QAAM,WAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,GAAG,OAAO;AACxB,YAAI,CAAC,SAAU;AAEf,cAAM,UAAU,SAAS,WAAW;AAEpC,gBAAQ,UAAU;AAAA,UAChB,QAAQ,GAAG;AAAA,UACX,QAAQ,GAAG;AAAA,UACX,WAAW,QAAQ;AAAA,UACnB,UAAU,QAAQ;AAAA,QACpB;AAEA,kBAAU,WAAW,YAAY,EAAE;AAAA,MACrC;AAAA,MACA,eAAe,CAAC,GAAG,OAAO;AACxB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,QAAQ,CAAC,SAAU;AAGxB,cAAM,KAAK,GAAG,UAAU,KAAK;AAC7B,cAAM,KAAK,GAAG,UAAU,KAAK;AAE7B,iBAAS,SAAS;AAAA,UAChB,GAAG,KAAK,YAAY;AAAA,UACpB,GAAG,KAAK,WAAW;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,aAAa,MAAM;AACjB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,gBAAgB,MAAM;AACpB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,iBAAiB,MAAM;AACrB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,UAAU,WAAW,YAAY;AAAA,EACpC;AAEA,EAAAA,WAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SAAO,gCAAE;AACX;","names":["useEffect"]}

package/dist/react/index.cjs

@@ -21,6 +21,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var react_exports = {};
 __export(react_exports, {
   PanMode: () => PanMode,
+  usePan: () => usePan,
   usePanCapability: () => usePanCapability,
   usePanPlugin: () => usePanPlugin
 });
@@ -28,21 +29,38 @@ module.exports = __toCommonJS(react_exports);
 
 // src/react/hooks/use-pan.ts
 var import_react = require("@embedpdf/core/react");
+var import_react2 = require("@embedpdf/plugin-interaction-manager/react");
 var import_plugin_pan = require("@embedpdf/plugin-pan");
+var import_react3 = require("react");
 var usePanPlugin = () => (0, import_react.usePlugin)(import_plugin_pan.PanPlugin.id);
 var usePanCapability = () => (0, import_react.useCapability)(import_plugin_pan.PanPlugin.id);
+var usePan = () => {
+  const { provides } = usePanCapability();
+  const { provides: interactionManager } = (0, import_react2.useInteractionManagerCapability)();
+  const [isPanning, setIsPanning] = (0, import_react3.useState)(false);
+  (0, import_react3.useEffect)(() => {
+    if (!interactionManager) return;
+    return interactionManager.onStateChange((state) => {
+      setIsPanning(state.activeMode === "panMode");
+    });
+  }, [interactionManager]);
+  return {
+    provides,
+    isPanning
+  };
+};
 
 // src/react/components/pan-mode.tsx
-var import_react2 = require("react");
-var import_react3 = require("@embedpdf/plugin-interaction-manager/react");
-var import_react4 = require("@embedpdf/plugin-viewport/react");
+var import_react4 = require("react");
+var import_react5 = require("@embedpdf/plugin-interaction-manager/react");
+var import_react6 = require("@embedpdf/plugin-viewport/react");
 var import_jsx_runtime = require("react/jsx-runtime");
 var PanMode = () => {
-  const { register } = (0, import_react3.usePointerHandlers)({ modeId: "panMode" });
-  const { setCursor, removeCursor } = (0, import_react3.useCursor)();
-  const { provides: viewport } = (0, import_react4.useViewportCapability)();
-  const dragRef = (0, import_react2.useRef)(null);
-  const handlers = (0, import_react2.useMemo)(
+  const { register } = (0, import_react5.usePointerHandlers)({ modeId: "panMode" });
+  const { setCursor, removeCursor } = (0, import_react5.useCursor)();
+  const { provides: viewport } = (0, import_react6.useViewportCapability)();
+  const dragRef = (0, import_react4.useRef)(null);
+  const handlers = (0, import_react4.useMemo)(
     () => ({
       onPointerDown: (_, pe) => {
         if (!viewport) return;
@@ -86,7 +104,7 @@ var PanMode = () => {
     }),
     [viewport, setCursor, removeCursor]
   );
-  (0, import_react2.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (!register) return;
     return register(handlers);
   }, [register, handlers]);
@@ -95,6 +113,7 @@ var PanMode = () => {
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   PanMode,
+  usePan,
   usePanCapability,
   usePanPlugin
 });

package/dist/react/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/react/index.ts","../../src/react/hooks/use-pan.ts","../../src/react/components/pan-mode.tsx"],"sourcesContent":["export * from './hooks';\nexport * from './components';\n","import { useCapability, usePlugin } from '@embedpdf/core/react';\nimport { PanPlugin } from '@embedpdf/plugin-pan';\n\nexport const usePanPlugin = () => usePlugin<PanPlugin>(PanPlugin.id);\nexport const usePanCapability = () => useCapability<PanPlugin>(PanPlugin.id);\n","import { useEffect, useMemo, useRef } from 'react';\nimport type { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/react';\nimport { useViewportCapability } from '@embedpdf/plugin-viewport/react';\n\nexport const PanMode = () => {\n  const { register } = usePointerHandlers({ modeId: 'panMode' });\n  const { setCursor, removeCursor } = useCursor();\n  const { provides: viewport } = useViewportCapability();\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    startLeft: number;\n    startTop: number;\n  } | null>(null);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (_, pe) => {\n        if (!viewport) return;\n\n        const metrics = viewport.getMetrics();\n\n        dragRef.current = {\n          startX: pe.clientX,\n          startY: pe.clientY,\n          startLeft: metrics.scrollLeft,\n          startTop: metrics.scrollTop,\n        };\n\n        setCursor('panMode', 'grabbing', 10);\n      },\n      onPointerMove: (_, pe) => {\n        const drag = dragRef.current;\n        if (!drag || !viewport) return;\n\n        /* delta between current pointer position and where the drag started */\n        const dx = pe.clientX - drag.startX;\n        const dy = pe.clientY - drag.startY;\n\n        viewport.scrollTo({\n          x: drag.startLeft - dx,\n          y: drag.startTop - dy,\n        });\n      },\n      onPointerUp: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerLeave: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerCancel: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n    }),\n    [viewport, setCursor, removeCursor],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return <></>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAyC;AACzC,wBAA0B;AAEnB,IAAM,eAAe,UAAM,wBAAqB,4BAAU,EAAE;AAC5D,IAAM,mBAAmB,UAAM,4BAAyB,4BAAU,EAAE;;;ACJ3E,IAAAA,gBAA2C;AAE3C,IAAAA,gBAA8C;AAC9C,IAAAA,gBAAsC;AAyE7B;AAvEF,IAAM,UAAU,MAAM;AAC3B,QAAM,EAAE,SAAS,QAAI,kCAAmB,EAAE,QAAQ,UAAU,CAAC;AAC7D,QAAM,EAAE,WAAW,aAAa,QAAI,yBAAU;AAC9C,QAAM,EAAE,UAAU,SAAS,QAAI,qCAAsB;AAErD,QAAM,cAAU,sBAKN,IAAI;AAEd,QAAM,eAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,GAAG,OAAO;AACxB,YAAI,CAAC,SAAU;AAEf,cAAM,UAAU,SAAS,WAAW;AAEpC,gBAAQ,UAAU;AAAA,UAChB,QAAQ,GAAG;AAAA,UACX,QAAQ,GAAG;AAAA,UACX,WAAW,QAAQ;AAAA,UACnB,UAAU,QAAQ;AAAA,QACpB;AAEA,kBAAU,WAAW,YAAY,EAAE;AAAA,MACrC;AAAA,MACA,eAAe,CAAC,GAAG,OAAO;AACxB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,QAAQ,CAAC,SAAU;AAGxB,cAAM,KAAK,GAAG,UAAU,KAAK;AAC7B,cAAM,KAAK,GAAG,UAAU,KAAK;AAE7B,iBAAS,SAAS;AAAA,UAChB,GAAG,KAAK,YAAY;AAAA,UACpB,GAAG,KAAK,WAAW;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,aAAa,MAAM;AACjB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,gBAAgB,MAAM;AACpB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,iBAAiB,MAAM;AACrB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,UAAU,WAAW,YAAY;AAAA,EACpC;AAEA,+BAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SAAO,2EAAE;AACX;","names":["import_react"]}
+{"version":3,"sources":["../../src/react/index.ts","../../src/react/hooks/use-pan.ts","../../src/react/components/pan-mode.tsx"],"sourcesContent":["export * from './hooks';\nexport * from './components';\n","import { useCapability, usePlugin } from '@embedpdf/core/react';\nimport { useInteractionManagerCapability } from '@embedpdf/plugin-interaction-manager/react';\nimport { PanPlugin } from '@embedpdf/plugin-pan';\nimport { useEffect, useState } from 'react';\n\nexport const usePanPlugin = () => usePlugin<PanPlugin>(PanPlugin.id);\nexport const usePanCapability = () => useCapability<PanPlugin>(PanPlugin.id);\n\nexport const usePan = () => {\n  const { provides } = usePanCapability();\n  const { provides: interactionManager } = useInteractionManagerCapability();\n\n  const [isPanning, setIsPanning] = useState(false);\n\n  useEffect(() => {\n    if (!interactionManager) return;\n    return interactionManager.onStateChange((state) => {\n      setIsPanning(state.activeMode === 'panMode');\n    });\n  }, [interactionManager]);\n\n  return {\n    provides,\n    isPanning,\n  };\n};\n","import { useEffect, useMemo, useRef } from 'react';\nimport type { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/react';\nimport { useViewportCapability } from '@embedpdf/plugin-viewport/react';\n\nexport const PanMode = () => {\n  const { register } = usePointerHandlers({ modeId: 'panMode' });\n  const { setCursor, removeCursor } = useCursor();\n  const { provides: viewport } = useViewportCapability();\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    startLeft: number;\n    startTop: number;\n  } | null>(null);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (_, pe) => {\n        if (!viewport) return;\n\n        const metrics = viewport.getMetrics();\n\n        dragRef.current = {\n          startX: pe.clientX,\n          startY: pe.clientY,\n          startLeft: metrics.scrollLeft,\n          startTop: metrics.scrollTop,\n        };\n\n        setCursor('panMode', 'grabbing', 10);\n      },\n      onPointerMove: (_, pe) => {\n        const drag = dragRef.current;\n        if (!drag || !viewport) return;\n\n        /* delta between current pointer position and where the drag started */\n        const dx = pe.clientX - drag.startX;\n        const dy = pe.clientY - drag.startY;\n\n        viewport.scrollTo({\n          x: drag.startLeft - dx,\n          y: drag.startTop - dy,\n        });\n      },\n      onPointerUp: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerLeave: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerCancel: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n    }),\n    [viewport, setCursor, removeCursor],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return <></>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAyC;AACzC,IAAAA,gBAAgD;AAChD,wBAA0B;AAC1B,IAAAA,gBAAoC;AAE7B,IAAM,eAAe,UAAM,wBAAqB,4BAAU,EAAE;AAC5D,IAAM,mBAAmB,UAAM,4BAAyB,4BAAU,EAAE;AAEpE,IAAM,SAAS,MAAM;AAC1B,QAAM,EAAE,SAAS,IAAI,iBAAiB;AACtC,QAAM,EAAE,UAAU,mBAAmB,QAAI,+CAAgC;AAEzE,QAAM,CAAC,WAAW,YAAY,QAAI,wBAAS,KAAK;AAEhD,+BAAU,MAAM;AACd,QAAI,CAAC,mBAAoB;AACzB,WAAO,mBAAmB,cAAc,CAAC,UAAU;AACjD,mBAAa,MAAM,eAAe,SAAS;AAAA,IAC7C,CAAC;AAAA,EACH,GAAG,CAAC,kBAAkB,CAAC;AAEvB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;;;ACzBA,IAAAC,gBAA2C;AAE3C,IAAAA,gBAA8C;AAC9C,IAAAA,gBAAsC;AAyE7B;AAvEF,IAAM,UAAU,MAAM;AAC3B,QAAM,EAAE,SAAS,QAAI,kCAAmB,EAAE,QAAQ,UAAU,CAAC;AAC7D,QAAM,EAAE,WAAW,aAAa,QAAI,yBAAU;AAC9C,QAAM,EAAE,UAAU,SAAS,QAAI,qCAAsB;AAErD,QAAM,cAAU,sBAKN,IAAI;AAEd,QAAM,eAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,GAAG,OAAO;AACxB,YAAI,CAAC,SAAU;AAEf,cAAM,UAAU,SAAS,WAAW;AAEpC,gBAAQ,UAAU;AAAA,UAChB,QAAQ,GAAG;AAAA,UACX,QAAQ,GAAG;AAAA,UACX,WAAW,QAAQ;AAAA,UACnB,UAAU,QAAQ;AAAA,QACpB;AAEA,kBAAU,WAAW,YAAY,EAAE;AAAA,MACrC;AAAA,MACA,eAAe,CAAC,GAAG,OAAO;AACxB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,QAAQ,CAAC,SAAU;AAGxB,cAAM,KAAK,GAAG,UAAU,KAAK;AAC7B,cAAM,KAAK,GAAG,UAAU,KAAK;AAE7B,iBAAS,SAAS;AAAA,UAChB,GAAG,KAAK,YAAY;AAAA,UACpB,GAAG,KAAK,WAAW;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,aAAa,MAAM;AACjB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,gBAAgB,MAAM;AACpB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,iBAAiB,MAAM;AACrB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,UAAU,WAAW,YAAY;AAAA,EACpC;AAEA,+BAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SAAO,2EAAE;AACX;","names":["import_react","import_react"]}

package/dist/react/index.d.cts

@@ -12,7 +12,11 @@ declare const usePanCapability: () => {
     isLoading: boolean;
     ready: Promise<void>;
 };
+declare const usePan: () => {
+    provides: Readonly<_embedpdf_plugin_pan.PanCapability> | null;
+    isPanning: boolean;
+};
 
 declare const PanMode: () => react_jsx_runtime.JSX.Element;
 
-export { PanMode, usePanCapability, usePanPlugin };
+export { PanMode, usePan, usePanCapability, usePanPlugin };

package/dist/react/index.d.ts

@@ -12,7 +12,11 @@ declare const usePanCapability: () => {
     isLoading: boolean;
     ready: Promise<void>;
 };
+declare const usePan: () => {
+    provides: Readonly<_embedpdf_plugin_pan.PanCapability> | null;
+    isPanning: boolean;
+};
 
 declare const PanMode: () => react_jsx_runtime.JSX.Element;
 
-export { PanMode, usePanCapability, usePanPlugin };
+export { PanMode, usePan, usePanCapability, usePanPlugin };

package/dist/react/index.js

@@ -1,11 +1,28 @@
 // src/react/hooks/use-pan.ts
 import { useCapability, usePlugin } from "@embedpdf/core/react";
+import { useInteractionManagerCapability } from "@embedpdf/plugin-interaction-manager/react";
 import { PanPlugin } from "@embedpdf/plugin-pan";
+import { useEffect, useState } from "react";
 var usePanPlugin = () => usePlugin(PanPlugin.id);
 var usePanCapability = () => useCapability(PanPlugin.id);
+var usePan = () => {
+  const { provides } = usePanCapability();
+  const { provides: interactionManager } = useInteractionManagerCapability();
+  const [isPanning, setIsPanning] = useState(false);
+  useEffect(() => {
+    if (!interactionManager) return;
+    return interactionManager.onStateChange((state) => {
+      setIsPanning(state.activeMode === "panMode");
+    });
+  }, [interactionManager]);
+  return {
+    provides,
+    isPanning
+  };
+};
 
 // src/react/components/pan-mode.tsx
-import { useEffect, useMemo, useRef } from "react";
+import { useEffect as useEffect2, useMemo, useRef } from "react";
 import { useCursor, usePointerHandlers } from "@embedpdf/plugin-interaction-manager/react";
 import { useViewportCapability } from "@embedpdf/plugin-viewport/react";
 import { Fragment, jsx } from "react/jsx-runtime";
@@ -58,7 +75,7 @@ var PanMode = () => {
     }),
     [viewport, setCursor, removeCursor]
   );
-  useEffect(() => {
+  useEffect2(() => {
     if (!register) return;
     return register(handlers);
   }, [register, handlers]);
@@ -66,6 +83,7 @@ var PanMode = () => {
 };
 export {
   PanMode,
+  usePan,
   usePanCapability,
   usePanPlugin
 };

package/dist/react/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/react/hooks/use-pan.ts","../../src/react/components/pan-mode.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/react';\nimport { PanPlugin } from '@embedpdf/plugin-pan';\n\nexport const usePanPlugin = () => usePlugin<PanPlugin>(PanPlugin.id);\nexport const usePanCapability = () => useCapability<PanPlugin>(PanPlugin.id);\n","import { useEffect, useMemo, useRef } from 'react';\nimport type { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/react';\nimport { useViewportCapability } from '@embedpdf/plugin-viewport/react';\n\nexport const PanMode = () => {\n  const { register } = usePointerHandlers({ modeId: 'panMode' });\n  const { setCursor, removeCursor } = useCursor();\n  const { provides: viewport } = useViewportCapability();\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    startLeft: number;\n    startTop: number;\n  } | null>(null);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (_, pe) => {\n        if (!viewport) return;\n\n        const metrics = viewport.getMetrics();\n\n        dragRef.current = {\n          startX: pe.clientX,\n          startY: pe.clientY,\n          startLeft: metrics.scrollLeft,\n          startTop: metrics.scrollTop,\n        };\n\n        setCursor('panMode', 'grabbing', 10);\n      },\n      onPointerMove: (_, pe) => {\n        const drag = dragRef.current;\n        if (!drag || !viewport) return;\n\n        /* delta between current pointer position and where the drag started */\n        const dx = pe.clientX - drag.startX;\n        const dy = pe.clientY - drag.startY;\n\n        viewport.scrollTo({\n          x: drag.startLeft - dx,\n          y: drag.startTop - dy,\n        });\n      },\n      onPointerUp: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerLeave: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerCancel: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n    }),\n    [viewport, setCursor, removeCursor],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return <></>;\n};\n"],"mappings":";AAAA,SAAS,eAAe,iBAAiB;AACzC,SAAS,iBAAiB;AAEnB,IAAM,eAAe,MAAM,UAAqB,UAAU,EAAE;AAC5D,IAAM,mBAAmB,MAAM,cAAyB,UAAU,EAAE;;;ACJ3E,SAAS,WAAW,SAAS,cAAc;AAE3C,SAAS,WAAW,0BAA0B;AAC9C,SAAS,6BAA6B;AAyE7B;AAvEF,IAAM,UAAU,MAAM;AAC3B,QAAM,EAAE,SAAS,IAAI,mBAAmB,EAAE,QAAQ,UAAU,CAAC;AAC7D,QAAM,EAAE,WAAW,aAAa,IAAI,UAAU;AAC9C,QAAM,EAAE,UAAU,SAAS,IAAI,sBAAsB;AAErD,QAAM,UAAU,OAKN,IAAI;AAEd,QAAM,WAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,GAAG,OAAO;AACxB,YAAI,CAAC,SAAU;AAEf,cAAM,UAAU,SAAS,WAAW;AAEpC,gBAAQ,UAAU;AAAA,UAChB,QAAQ,GAAG;AAAA,UACX,QAAQ,GAAG;AAAA,UACX,WAAW,QAAQ;AAAA,UACnB,UAAU,QAAQ;AAAA,QACpB;AAEA,kBAAU,WAAW,YAAY,EAAE;AAAA,MACrC;AAAA,MACA,eAAe,CAAC,GAAG,OAAO;AACxB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,QAAQ,CAAC,SAAU;AAGxB,cAAM,KAAK,GAAG,UAAU,KAAK;AAC7B,cAAM,KAAK,GAAG,UAAU,KAAK;AAE7B,iBAAS,SAAS;AAAA,UAChB,GAAG,KAAK,YAAY;AAAA,UACpB,GAAG,KAAK,WAAW;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,aAAa,MAAM;AACjB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,gBAAgB,MAAM;AACpB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,iBAAiB,MAAM;AACrB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,UAAU,WAAW,YAAY;AAAA,EACpC;AAEA,YAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SAAO,gCAAE;AACX;","names":[]}
+{"version":3,"sources":["../../src/react/hooks/use-pan.ts","../../src/react/components/pan-mode.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/react';\nimport { useInteractionManagerCapability } from '@embedpdf/plugin-interaction-manager/react';\nimport { PanPlugin } from '@embedpdf/plugin-pan';\nimport { useEffect, useState } from 'react';\n\nexport const usePanPlugin = () => usePlugin<PanPlugin>(PanPlugin.id);\nexport const usePanCapability = () => useCapability<PanPlugin>(PanPlugin.id);\n\nexport const usePan = () => {\n  const { provides } = usePanCapability();\n  const { provides: interactionManager } = useInteractionManagerCapability();\n\n  const [isPanning, setIsPanning] = useState(false);\n\n  useEffect(() => {\n    if (!interactionManager) return;\n    return interactionManager.onStateChange((state) => {\n      setIsPanning(state.activeMode === 'panMode');\n    });\n  }, [interactionManager]);\n\n  return {\n    provides,\n    isPanning,\n  };\n};\n","import { useEffect, useMemo, useRef } from 'react';\nimport type { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/react';\nimport { useViewportCapability } from '@embedpdf/plugin-viewport/react';\n\nexport const PanMode = () => {\n  const { register } = usePointerHandlers({ modeId: 'panMode' });\n  const { setCursor, removeCursor } = useCursor();\n  const { provides: viewport } = useViewportCapability();\n\n  const dragRef = useRef<{\n    startX: number;\n    startY: number;\n    startLeft: number;\n    startTop: number;\n  } | null>(null);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (_, pe) => {\n        if (!viewport) return;\n\n        const metrics = viewport.getMetrics();\n\n        dragRef.current = {\n          startX: pe.clientX,\n          startY: pe.clientY,\n          startLeft: metrics.scrollLeft,\n          startTop: metrics.scrollTop,\n        };\n\n        setCursor('panMode', 'grabbing', 10);\n      },\n      onPointerMove: (_, pe) => {\n        const drag = dragRef.current;\n        if (!drag || !viewport) return;\n\n        /* delta between current pointer position and where the drag started */\n        const dx = pe.clientX - drag.startX;\n        const dy = pe.clientY - drag.startY;\n\n        viewport.scrollTo({\n          x: drag.startLeft - dx,\n          y: drag.startTop - dy,\n        });\n      },\n      onPointerUp: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerLeave: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n      onPointerCancel: () => {\n        const drag = dragRef.current;\n        if (!drag) return;\n\n        dragRef.current = null;\n        removeCursor('panMode');\n      },\n    }),\n    [viewport, setCursor, removeCursor],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return <></>;\n};\n"],"mappings":";AAAA,SAAS,eAAe,iBAAiB;AACzC,SAAS,uCAAuC;AAChD,SAAS,iBAAiB;AAC1B,SAAS,WAAW,gBAAgB;AAE7B,IAAM,eAAe,MAAM,UAAqB,UAAU,EAAE;AAC5D,IAAM,mBAAmB,MAAM,cAAyB,UAAU,EAAE;AAEpE,IAAM,SAAS,MAAM;AAC1B,QAAM,EAAE,SAAS,IAAI,iBAAiB;AACtC,QAAM,EAAE,UAAU,mBAAmB,IAAI,gCAAgC;AAEzE,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAEhD,YAAU,MAAM;AACd,QAAI,CAAC,mBAAoB;AACzB,WAAO,mBAAmB,cAAc,CAAC,UAAU;AACjD,mBAAa,MAAM,eAAe,SAAS;AAAA,IAC7C,CAAC;AAAA,EACH,GAAG,CAAC,kBAAkB,CAAC;AAEvB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;;;ACzBA,SAAS,aAAAA,YAAW,SAAS,cAAc;AAE3C,SAAS,WAAW,0BAA0B;AAC9C,SAAS,6BAA6B;AAyE7B;AAvEF,IAAM,UAAU,MAAM;AAC3B,QAAM,EAAE,SAAS,IAAI,mBAAmB,EAAE,QAAQ,UAAU,CAAC;AAC7D,QAAM,EAAE,WAAW,aAAa,IAAI,UAAU;AAC9C,QAAM,EAAE,UAAU,SAAS,IAAI,sBAAsB;AAErD,QAAM,UAAU,OAKN,IAAI;AAEd,QAAM,WAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,GAAG,OAAO;AACxB,YAAI,CAAC,SAAU;AAEf,cAAM,UAAU,SAAS,WAAW;AAEpC,gBAAQ,UAAU;AAAA,UAChB,QAAQ,GAAG;AAAA,UACX,QAAQ,GAAG;AAAA,UACX,WAAW,QAAQ;AAAA,UACnB,UAAU,QAAQ;AAAA,QACpB;AAEA,kBAAU,WAAW,YAAY,EAAE;AAAA,MACrC;AAAA,MACA,eAAe,CAAC,GAAG,OAAO;AACxB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,QAAQ,CAAC,SAAU;AAGxB,cAAM,KAAK,GAAG,UAAU,KAAK;AAC7B,cAAM,KAAK,GAAG,UAAU,KAAK;AAE7B,iBAAS,SAAS;AAAA,UAChB,GAAG,KAAK,YAAY;AAAA,UACpB,GAAG,KAAK,WAAW;AAAA,QACrB,CAAC;AAAA,MACH;AAAA,MACA,aAAa,MAAM;AACjB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,gBAAgB,MAAM;AACpB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,MACA,iBAAiB,MAAM;AACrB,cAAM,OAAO,QAAQ;AACrB,YAAI,CAAC,KAAM;AAEX,gBAAQ,UAAU;AAClB,qBAAa,SAAS;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,UAAU,WAAW,YAAY;AAAA,EACpC;AAEA,EAAAA,WAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SAAO,gCAAE;AACX;","names":["useEffect"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@embedpdf/plugin-pan",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -27,17 +27,17 @@
     "@types/react": "^18.2.0",
     "tsup": "^8.0.0",
     "typescript": "^5.0.0",
-    "@embedpdf/plugin-interaction-manager": "1.0.1",
-    "@embedpdf/models": "1.0.1",
-    "@embedpdf/plugin-viewport": "1.0.1"
+    "@embedpdf/plugin-interaction-manager": "1.0.2",
+    "@embedpdf/plugin-viewport": "1.0.2",
+    "@embedpdf/models": "1.0.2"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "preact": "^10.26.4",
-    "@embedpdf/plugin-interaction-manager": "1.0.1",
-    "@embedpdf/core": "1.0.1",
-    "@embedpdf/plugin-viewport": "1.0.1"
+    "@embedpdf/plugin-interaction-manager": "1.0.2",
+    "@embedpdf/plugin-viewport": "1.0.2",
+    "@embedpdf/core": "1.0.2"
   },
   "files": [
     "dist",