@embedpdf/plugin-render 1.0.17 → 1.0.19

package/dist/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),n=require("@embedpdf/models"),t=class extends e.BasePlugin{constructor(e,n,t){super(e,n),this.engine=t}async initialize(e){}buildCapability(){return{renderPage:this.renderPage.bind(this),renderPageRect:this.renderPageRect.bind(this)}}renderPage({pageIndex:e,scaleFactor:t=1,dpr:r=1,rotation:o=n.Rotation.Degree0,options:i={withAnnotations:!1},imageType:d="image/webp"}){const a=this.coreState.core;if(!a.document)throw new Error("document does not open");const s=a.document.pages.find((n=>n.index===e));if(!s)throw new Error("page does not exist");return this.engine.renderPage(a.document,s,t,o,r,i,d)}renderPageRect({pageIndex:e,scaleFactor:t=1,dpr:r=1,rect:o,rotation:i=n.Rotation.Degree0,options:d={withAnnotations:!1},imageType:a="image/webp"}){const s=this.coreState.core;if(!s.document)throw new Error("document does not open");const c=s.document.pages.find((n=>n.index===e));if(!c)throw new Error("page does not exist");return this.engine.renderPageRect(s.document,c,t,i,r,o,d,a)}};t.id="render";let r=t;const o="render",i={manifest:{id:o,name:"Render Plugin",version:"1.0.0",provides:["render"],requires:[],optional:[],defaultConfig:{enabled:!0}},create:(e,n)=>new r(o,e,n),reducer:()=>{},initialState:{}};exports.RenderPlugin=r,exports.RenderPluginPackage=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@embedpdf/core"),r=class extends e.BasePlugin{constructor(r,t){super(r,t),this.refreshPages$=e.createEmitter(),this.coreStore.onAction(e.REFRESH_PAGES,(e=>{this.refreshPages$.emit(e.payload)}))}async initialize(e){}buildCapability(){return{renderPage:this.renderPage.bind(this),renderPageRect:this.renderPageRect.bind(this)}}onRefreshPages(e){return this.refreshPages$.on(e)}renderPage({pageIndex:e,options:r}){const t=this.coreState.core;if(!t.document)throw new Error("document does not open");const n=t.document.pages.find((r=>r.index===e));if(!n)throw new Error("page does not exist");return this.engine.renderPage(t.document,n,r)}renderPageRect({pageIndex:e,rect:r,options:t}){const n=this.coreState.core;if(!n.document)throw new Error("document does not open");const o=n.document.pages.find((r=>r.index===e));if(!o)throw new Error("page does not exist");return this.engine.renderPageRect(n.document,o,r,t)}};r.id="render";let t=r;const n="render",o={manifest:{id:n,name:"Render Plugin",version:"1.0.0",provides:["render"],requires:[],optional:[],defaultConfig:{enabled:!0}},create:e=>new t(n,e),reducer:()=>{},initialState:{}};exports.RenderPlugin=t,exports.RenderPluginPackage=o;
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../src/lib/render-plugin.ts","../src/lib/manifest.ts","../src/lib/index.ts"],"sourcesContent":["import { BasePlugin, PluginRegistry } from '@embedpdf/core';\nimport {\n  RenderCapability,\n  RenderPageOptions,\n  RenderPageRectOptions,\n  RenderPluginConfig,\n} from './types';\nimport { PdfEngine, Rotation } from '@embedpdf/models';\n\nexport class RenderPlugin extends BasePlugin<RenderPluginConfig, RenderCapability> {\n  static readonly id = 'render' as const;\n  private engine: PdfEngine;\n\n  constructor(id: string, registry: PluginRegistry, engine: PdfEngine) {\n    super(id, registry);\n    this.engine = engine;\n  }\n\n  async initialize(_config: RenderPluginConfig): Promise<void> {}\n\n  protected buildCapability(): RenderCapability {\n    return {\n      renderPage: this.renderPage.bind(this),\n      renderPageRect: this.renderPageRect.bind(this),\n    };\n  }\n\n  private renderPage({\n    pageIndex,\n    scaleFactor = 1,\n    dpr = 1,\n    rotation = Rotation.Degree0,\n    options = { withAnnotations: false },\n    imageType = 'image/webp',\n  }: RenderPageOptions) {\n    const coreState = this.coreState.core;\n\n    if (!coreState.document) {\n      throw new Error('document does not open');\n    }\n\n    const page = coreState.document.pages.find((page) => page.index === pageIndex);\n    if (!page) {\n      throw new Error('page does not exist');\n    }\n\n    return this.engine.renderPage(\n      coreState.document,\n      page,\n      scaleFactor,\n      rotation,\n      dpr,\n      options,\n      imageType,\n    );\n  }\n\n  private renderPageRect({\n    pageIndex,\n    scaleFactor = 1,\n    dpr = 1,\n    rect,\n    rotation = Rotation.Degree0,\n    options = { withAnnotations: false },\n    imageType = 'image/webp',\n  }: RenderPageRectOptions) {\n    const coreState = this.coreState.core;\n\n    if (!coreState.document) {\n      throw new Error('document does not open');\n    }\n\n    const page = coreState.document.pages.find((page) => page.index === pageIndex);\n    if (!page) {\n      throw new Error('page does not exist');\n    }\n\n    return this.engine.renderPageRect(\n      coreState.document,\n      page,\n      scaleFactor,\n      rotation,\n      dpr,\n      rect,\n      options,\n      imageType,\n    );\n  }\n}\n","import { PluginManifest } from '@embedpdf/core';\nimport { RenderPluginConfig } from './types';\n\nexport const RENDER_PLUGIN_ID = 'render';\n\nexport const manifest: PluginManifest<RenderPluginConfig> = {\n  id: RENDER_PLUGIN_ID,\n  name: 'Render Plugin',\n  version: '1.0.0',\n  provides: ['render'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { PluginPackage } from '@embedpdf/core';\nimport { RenderPluginConfig } from './types';\nimport { RenderPlugin } from './render-plugin';\nimport { manifest, RENDER_PLUGIN_ID } from './manifest';\n\nexport const RenderPluginPackage: PluginPackage<RenderPlugin, RenderPluginConfig> = {\n  manifest,\n  create: (registry, engine) => new RenderPlugin(RENDER_PLUGIN_ID, registry, engine),\n  reducer: () => {},\n  initialState: {},\n};\n\nexport * from './render-plugin';\nexport * from './types';\n"],"names":["_RenderPlugin","BasePlugin","constructor","id","registry","engine","super","this","initialize","_config","buildCapability","renderPage","bind","renderPageRect","pageIndex","scaleFactor","dpr","rotation","Rotation","Degree0","options","withAnnotations","imageType","coreState","core","document","Error","page","pages","find","index","rect","RenderPlugin","RENDER_PLUGIN_ID","RenderPluginPackage","manifest","name","version","provides","requires","optional","defaultConfig","enabled","create","reducer","initialState"],"mappings":"gJASaA,EAAN,cAA2BC,EAAAA,WAIhC,WAAAC,CAAYC,EAAYC,EAA0BC,GAChDC,MAAMH,EAAIC,GACVG,KAAKF,OAASA,CAAA,CAGhB,gBAAMG,CAAWC,GAA4C,CAEnD,eAAAC,GACD,MAAA,CACLC,WAAYJ,KAAKI,WAAWC,KAAKL,MACjCM,eAAgBN,KAAKM,eAAeD,KAAKL,MAC3C,CAGM,UAAAI,EAAWG,UACjBA,EAAAC,YACAA,EAAc,EAAAC,IACdA,EAAM,EAAAC,SACNA,EAAWC,EAASA,SAAAC,QAAAC,QACpBA,EAAU,CAAEC,iBAAiB,GAAMC,UACnCA,EAAY,eAEN,MAAAC,EAAYhB,KAAKgB,UAAUC,KAE7B,IAACD,EAAUE,SACP,MAAA,IAAIC,MAAM,0BAGZ,MAAAC,EAAOJ,EAAUE,SAASG,MAAMC,MAAMF,GAASA,EAAKG,QAAUhB,IACpE,IAAKa,EACG,MAAA,IAAID,MAAM,uBAGlB,OAAOnB,KAAKF,OAAOM,WACjBY,EAAUE,SACVE,EACAZ,EACAE,EACAD,EACAI,EACAE,EACF,CAGM,cAAAT,EAAeC,UACrBA,EAAAC,YACAA,EAAc,EAAAC,IACdA,EAAM,EAAAe,KACNA,EAAAd,SACAA,EAAWC,EAASA,SAAAC,QAAAC,QACpBA,EAAU,CAAEC,iBAAiB,GAAMC,UACnCA,EAAY,eAEN,MAAAC,EAAYhB,KAAKgB,UAAUC,KAE7B,IAACD,EAAUE,SACP,MAAA,IAAIC,MAAM,0BAGZ,MAAAC,EAAOJ,EAAUE,SAASG,MAAMC,MAAMF,GAASA,EAAKG,QAAUhB,IACpE,IAAKa,EACG,MAAA,IAAID,MAAM,uBAGlB,OAAOnB,KAAKF,OAAOQ,eACjBU,EAAUE,SACVE,EACAZ,EACAE,EACAD,EACAe,EACAX,EACAE,EACF,GA5EFtB,EAAgBG,GAAK,SADhB,IAAM6B,EAANhC,ECNA,MAAMiC,EAAmB,SCEnBC,EAAuE,CAClFC,SDD0D,CAC1DhC,GAAI8B,EACJG,KAAM,gBACNC,QAAS,QACTC,SAAU,CAAC,UACXC,SAAU,GACVC,SAAU,GACVC,cAAe,CACbC,SAAS,ICNXC,OAAQ,CAACvC,EAAUC,IAAW,IAAI2B,EAAaC,EAAkB7B,EAAUC,GAC3EuC,QAAS,OACTC,aAAc,CAAA"}
+{"version":3,"file":"index.cjs","sources":["../src/lib/render-plugin.ts","../src/lib/manifest.ts","../src/lib/index.ts"],"sourcesContent":["import {\n  BasePlugin,\n  createEmitter,\n  PluginRegistry,\n  REFRESH_PAGES,\n  Unsubscribe,\n} from '@embedpdf/core';\nimport {\n  RenderCapability,\n  RenderPageOptions,\n  RenderPageRectOptions,\n  RenderPluginConfig,\n} from './types';\n\nexport class RenderPlugin extends BasePlugin<RenderPluginConfig, RenderCapability> {\n  static readonly id = 'render' as const;\n\n  private readonly refreshPages$ = createEmitter<number[]>();\n\n  constructor(id: string, registry: PluginRegistry) {\n    super(id, registry);\n\n    this.coreStore.onAction(REFRESH_PAGES, (action) => {\n      this.refreshPages$.emit(action.payload);\n    });\n  }\n\n  async initialize(_config: RenderPluginConfig): Promise<void> {}\n\n  protected buildCapability(): RenderCapability {\n    return {\n      renderPage: this.renderPage.bind(this),\n      renderPageRect: this.renderPageRect.bind(this),\n    };\n  }\n\n  public onRefreshPages(fn: (pages: number[]) => void): Unsubscribe {\n    return this.refreshPages$.on(fn);\n  }\n\n  private renderPage({ pageIndex, options }: RenderPageOptions) {\n    const coreState = this.coreState.core;\n\n    if (!coreState.document) {\n      throw new Error('document does not open');\n    }\n\n    const page = coreState.document.pages.find((page) => page.index === pageIndex);\n    if (!page) {\n      throw new Error('page does not exist');\n    }\n\n    return this.engine.renderPage(coreState.document, page, options);\n  }\n\n  private renderPageRect({ pageIndex, rect, options }: RenderPageRectOptions) {\n    const coreState = this.coreState.core;\n\n    if (!coreState.document) {\n      throw new Error('document does not open');\n    }\n\n    const page = coreState.document.pages.find((page) => page.index === pageIndex);\n    if (!page) {\n      throw new Error('page does not exist');\n    }\n\n    return this.engine.renderPageRect(coreState.document, page, rect, options);\n  }\n}\n","import { PluginManifest } from '@embedpdf/core';\nimport { RenderPluginConfig } from './types';\n\nexport const RENDER_PLUGIN_ID = 'render';\n\nexport const manifest: PluginManifest<RenderPluginConfig> = {\n  id: RENDER_PLUGIN_ID,\n  name: 'Render Plugin',\n  version: '1.0.0',\n  provides: ['render'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { PluginPackage } from '@embedpdf/core';\nimport { RenderPluginConfig } from './types';\nimport { RenderPlugin } from './render-plugin';\nimport { manifest, RENDER_PLUGIN_ID } from './manifest';\n\nexport const RenderPluginPackage: PluginPackage<RenderPlugin, RenderPluginConfig> = {\n  manifest,\n  create: (registry) => new RenderPlugin(RENDER_PLUGIN_ID, registry),\n  reducer: () => {},\n  initialState: {},\n};\n\nexport * from './render-plugin';\nexport * from './types';\n"],"names":["_RenderPlugin","BasePlugin","constructor","id","registry","super","this","refreshPages$","createEmitter","coreStore","onAction","REFRESH_PAGES","action","emit","payload","initialize","_config","buildCapability","renderPage","bind","renderPageRect","onRefreshPages","fn","on","pageIndex","options","coreState","core","document","Error","page","pages","find","index","engine","rect","RenderPlugin","RENDER_PLUGIN_ID","RenderPluginPackage","manifest","name","version","provides","requires","optional","defaultConfig","enabled","create","reducer","initialState"],"mappings":"kHAcaA,EAAN,cAA2BC,EAAAA,WAKhC,WAAAC,CAAYC,EAAYC,GACtBC,MAAMF,EAAIC,GAHKE,KAAAC,cAAgBC,kBAK/BF,KAAKG,UAAUC,SAASC,EAAeA,eAACC,IACjCN,KAAAC,cAAcM,KAAKD,EAAOE,QAAO,GACvC,CAGH,gBAAMC,CAAWC,GAA4C,CAEnD,eAAAC,GACD,MAAA,CACLC,WAAYZ,KAAKY,WAAWC,KAAKb,MACjCc,eAAgBd,KAAKc,eAAeD,KAAKb,MAC3C,CAGK,cAAAe,CAAeC,GACb,OAAAhB,KAAKC,cAAcgB,GAAGD,EAAE,CAGzB,UAAAJ,EAAWM,UAAEA,EAAWC,QAAAA,IACxB,MAAAC,EAAYpB,KAAKoB,UAAUC,KAE7B,IAACD,EAAUE,SACP,MAAA,IAAIC,MAAM,0BAGZ,MAAAC,EAAOJ,EAAUE,SAASG,MAAMC,MAAMF,GAASA,EAAKG,QAAUT,IACpE,IAAKM,EACG,MAAA,IAAID,MAAM,uBAGlB,OAAOvB,KAAK4B,OAAOhB,WAAWQ,EAAUE,SAAUE,EAAML,EAAO,CAGzD,cAAAL,EAAeI,UAAEA,EAAWW,KAAAA,EAAAV,QAAMA,IAClC,MAAAC,EAAYpB,KAAKoB,UAAUC,KAE7B,IAACD,EAAUE,SACP,MAAA,IAAIC,MAAM,0BAGZ,MAAAC,EAAOJ,EAAUE,SAASG,MAAMC,MAAMF,GAASA,EAAKG,QAAUT,IACpE,IAAKM,EACG,MAAA,IAAID,MAAM,uBAGlB,OAAOvB,KAAK4B,OAAOd,eAAeM,EAAUE,SAAUE,EAAMK,EAAMV,EAAO,GApD3EzB,EAAgBG,GAAK,SADhB,IAAMiC,EAANpC,ECXA,MAAMqC,EAAmB,SCEnBC,EAAuE,CAClFC,SDD0D,CAC1DpC,GAAIkC,EACJG,KAAM,gBACNC,QAAS,QACTC,SAAU,CAAC,UACXC,SAAU,GACVC,SAAU,GACVC,cAAe,CACbC,SAAS,ICNXC,OAAS3C,GAAa,IAAIgC,EAAaC,EAAkBjC,GACzD4C,QAAS,OACTC,aAAc,CAAA"}

package/dist/index.js

@@ -1,9 +1,11 @@
-import { BasePlugin } from "@embedpdf/core";
-import { Rotation } from "@embedpdf/models";
+import { BasePlugin, createEmitter, REFRESH_PAGES } from "@embedpdf/core";
 const _RenderPlugin = class _RenderPlugin extends BasePlugin {
-  constructor(id, registry, engine) {
+  constructor(id, registry) {
     super(id, registry);
-    this.engine = engine;
+    this.refreshPages$ = createEmitter();
+    this.coreStore.onAction(REFRESH_PAGES, (action) => {
+      this.refreshPages$.emit(action.payload);
+    });
   }
   async initialize(_config) {
   }
@@ -13,14 +15,10 @@ const _RenderPlugin = class _RenderPlugin extends BasePlugin {
       renderPageRect: this.renderPageRect.bind(this)
     };
   }
-  renderPage({
-    pageIndex,
-    scaleFactor = 1,
-    dpr = 1,
-    rotation = Rotation.Degree0,
-    options = { withAnnotations: false },
-    imageType = "image/webp"
-  }) {
+  onRefreshPages(fn) {
+    return this.refreshPages$.on(fn);
+  }
+  renderPage({ pageIndex, options }) {
     const coreState = this.coreState.core;
     if (!coreState.document) {
       throw new Error("document does not open");
@@ -29,25 +27,9 @@ const _RenderPlugin = class _RenderPlugin extends BasePlugin {
     if (!page) {
       throw new Error("page does not exist");
     }
-    return this.engine.renderPage(
-      coreState.document,
-      page,
-      scaleFactor,
-      rotation,
-      dpr,
-      options,
-      imageType
-    );
+    return this.engine.renderPage(coreState.document, page, options);
   }
-  renderPageRect({
-    pageIndex,
-    scaleFactor = 1,
-    dpr = 1,
-    rect,
-    rotation = Rotation.Degree0,
-    options = { withAnnotations: false },
-    imageType = "image/webp"
-  }) {
+  renderPageRect({ pageIndex, rect, options }) {
     const coreState = this.coreState.core;
     if (!coreState.document) {
       throw new Error("document does not open");
@@ -56,16 +38,7 @@ const _RenderPlugin = class _RenderPlugin extends BasePlugin {
     if (!page) {
       throw new Error("page does not exist");
     }
-    return this.engine.renderPageRect(
-      coreState.document,
-      page,
-      scaleFactor,
-      rotation,
-      dpr,
-      rect,
-      options,
-      imageType
-    );
+    return this.engine.renderPageRect(coreState.document, page, rect, options);
   }
 };
 _RenderPlugin.id = "render";
@@ -84,7 +57,7 @@ const manifest = {
 };
 const RenderPluginPackage = {
   manifest,
-  create: (registry, engine) => new RenderPlugin(RENDER_PLUGIN_ID, registry, engine),
+  create: (registry) => new RenderPlugin(RENDER_PLUGIN_ID, registry),
   reducer: () => {
   },
   initialState: {}

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/lib/render-plugin.ts","../src/lib/manifest.ts","../src/lib/index.ts"],"sourcesContent":["import { BasePlugin, PluginRegistry } from '@embedpdf/core';\nimport {\n  RenderCapability,\n  RenderPageOptions,\n  RenderPageRectOptions,\n  RenderPluginConfig,\n} from './types';\nimport { PdfEngine, Rotation } from '@embedpdf/models';\n\nexport class RenderPlugin extends BasePlugin<RenderPluginConfig, RenderCapability> {\n  static readonly id = 'render' as const;\n  private engine: PdfEngine;\n\n  constructor(id: string, registry: PluginRegistry, engine: PdfEngine) {\n    super(id, registry);\n    this.engine = engine;\n  }\n\n  async initialize(_config: RenderPluginConfig): Promise<void> {}\n\n  protected buildCapability(): RenderCapability {\n    return {\n      renderPage: this.renderPage.bind(this),\n      renderPageRect: this.renderPageRect.bind(this),\n    };\n  }\n\n  private renderPage({\n    pageIndex,\n    scaleFactor = 1,\n    dpr = 1,\n    rotation = Rotation.Degree0,\n    options = { withAnnotations: false },\n    imageType = 'image/webp',\n  }: RenderPageOptions) {\n    const coreState = this.coreState.core;\n\n    if (!coreState.document) {\n      throw new Error('document does not open');\n    }\n\n    const page = coreState.document.pages.find((page) => page.index === pageIndex);\n    if (!page) {\n      throw new Error('page does not exist');\n    }\n\n    return this.engine.renderPage(\n      coreState.document,\n      page,\n      scaleFactor,\n      rotation,\n      dpr,\n      options,\n      imageType,\n    );\n  }\n\n  private renderPageRect({\n    pageIndex,\n    scaleFactor = 1,\n    dpr = 1,\n    rect,\n    rotation = Rotation.Degree0,\n    options = { withAnnotations: false },\n    imageType = 'image/webp',\n  }: RenderPageRectOptions) {\n    const coreState = this.coreState.core;\n\n    if (!coreState.document) {\n      throw new Error('document does not open');\n    }\n\n    const page = coreState.document.pages.find((page) => page.index === pageIndex);\n    if (!page) {\n      throw new Error('page does not exist');\n    }\n\n    return this.engine.renderPageRect(\n      coreState.document,\n      page,\n      scaleFactor,\n      rotation,\n      dpr,\n      rect,\n      options,\n      imageType,\n    );\n  }\n}\n","import { PluginManifest } from '@embedpdf/core';\nimport { RenderPluginConfig } from './types';\n\nexport const RENDER_PLUGIN_ID = 'render';\n\nexport const manifest: PluginManifest<RenderPluginConfig> = {\n  id: RENDER_PLUGIN_ID,\n  name: 'Render Plugin',\n  version: '1.0.0',\n  provides: ['render'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { PluginPackage } from '@embedpdf/core';\nimport { RenderPluginConfig } from './types';\nimport { RenderPlugin } from './render-plugin';\nimport { manifest, RENDER_PLUGIN_ID } from './manifest';\n\nexport const RenderPluginPackage: PluginPackage<RenderPlugin, RenderPluginConfig> = {\n  manifest,\n  create: (registry, engine) => new RenderPlugin(RENDER_PLUGIN_ID, registry, engine),\n  reducer: () => {},\n  initialState: {},\n};\n\nexport * from './render-plugin';\nexport * from './types';\n"],"names":["page"],"mappings":";;AASO,MAAM,gBAAN,MAAM,sBAAqB,WAAiD;AAAA,EAIjF,YAAY,IAAY,UAA0B,QAAmB;AACnE,UAAM,IAAI,QAAQ;AAClB,SAAK,SAAS;AAAA,EAAA;AAAA,EAGhB,MAAM,WAAW,SAA4C;AAAA,EAAA;AAAA,EAEnD,kBAAoC;AACrC,WAAA;AAAA,MACL,YAAY,KAAK,WAAW,KAAK,IAAI;AAAA,MACrC,gBAAgB,KAAK,eAAe,KAAK,IAAI;AAAA,IAC/C;AAAA,EAAA;AAAA,EAGM,WAAW;AAAA,IACjB;AAAA,IACA,cAAc;AAAA,IACd,MAAM;AAAA,IACN,WAAW,SAAS;AAAA,IACpB,UAAU,EAAE,iBAAiB,MAAM;AAAA,IACnC,YAAY;AAAA,EAAA,GACQ;AACd,UAAA,YAAY,KAAK,UAAU;AAE7B,QAAA,CAAC,UAAU,UAAU;AACjB,YAAA,IAAI,MAAM,wBAAwB;AAAA,IAAA;AAGpC,UAAA,OAAO,UAAU,SAAS,MAAM,KAAK,CAACA,UAASA,MAAK,UAAU,SAAS;AAC7E,QAAI,CAAC,MAAM;AACH,YAAA,IAAI,MAAM,qBAAqB;AAAA,IAAA;AAGvC,WAAO,KAAK,OAAO;AAAA,MACjB,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAAA,EAGM,eAAe;AAAA,IACrB;AAAA,IACA,cAAc;AAAA,IACd,MAAM;AAAA,IACN;AAAA,IACA,WAAW,SAAS;AAAA,IACpB,UAAU,EAAE,iBAAiB,MAAM;AAAA,IACnC,YAAY;AAAA,EAAA,GACY;AAClB,UAAA,YAAY,KAAK,UAAU;AAE7B,QAAA,CAAC,UAAU,UAAU;AACjB,YAAA,IAAI,MAAM,wBAAwB;AAAA,IAAA;AAGpC,UAAA,OAAO,UAAU,SAAS,MAAM,KAAK,CAACA,UAASA,MAAK,UAAU,SAAS;AAC7E,QAAI,CAAC,MAAM;AACH,YAAA,IAAI,MAAM,qBAAqB;AAAA,IAAA;AAGvC,WAAO,KAAK,OAAO;AAAA,MACjB,UAAU;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAEJ;AA9EE,cAAgB,KAAK;AADhB,IAAM,eAAN;ACNA,MAAM,mBAAmB;AAEzB,MAAM,WAA+C;AAAA,EAC1D,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU,CAAC,QAAQ;AAAA,EACnB,UAAU,CAAC;AAAA,EACX,UAAU,CAAC;AAAA,EACX,eAAe;AAAA,IACb,SAAS;AAAA,EAAA;AAEb;ACVO,MAAM,sBAAuE;AAAA,EAClF;AAAA,EACA,QAAQ,CAAC,UAAU,WAAW,IAAI,aAAa,kBAAkB,UAAU,MAAM;AAAA,EACjF,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,cAAc,CAAA;AAChB;"}
+{"version":3,"file":"index.js","sources":["../src/lib/render-plugin.ts","../src/lib/manifest.ts","../src/lib/index.ts"],"sourcesContent":["import {\n  BasePlugin,\n  createEmitter,\n  PluginRegistry,\n  REFRESH_PAGES,\n  Unsubscribe,\n} from '@embedpdf/core';\nimport {\n  RenderCapability,\n  RenderPageOptions,\n  RenderPageRectOptions,\n  RenderPluginConfig,\n} from './types';\n\nexport class RenderPlugin extends BasePlugin<RenderPluginConfig, RenderCapability> {\n  static readonly id = 'render' as const;\n\n  private readonly refreshPages$ = createEmitter<number[]>();\n\n  constructor(id: string, registry: PluginRegistry) {\n    super(id, registry);\n\n    this.coreStore.onAction(REFRESH_PAGES, (action) => {\n      this.refreshPages$.emit(action.payload);\n    });\n  }\n\n  async initialize(_config: RenderPluginConfig): Promise<void> {}\n\n  protected buildCapability(): RenderCapability {\n    return {\n      renderPage: this.renderPage.bind(this),\n      renderPageRect: this.renderPageRect.bind(this),\n    };\n  }\n\n  public onRefreshPages(fn: (pages: number[]) => void): Unsubscribe {\n    return this.refreshPages$.on(fn);\n  }\n\n  private renderPage({ pageIndex, options }: RenderPageOptions) {\n    const coreState = this.coreState.core;\n\n    if (!coreState.document) {\n      throw new Error('document does not open');\n    }\n\n    const page = coreState.document.pages.find((page) => page.index === pageIndex);\n    if (!page) {\n      throw new Error('page does not exist');\n    }\n\n    return this.engine.renderPage(coreState.document, page, options);\n  }\n\n  private renderPageRect({ pageIndex, rect, options }: RenderPageRectOptions) {\n    const coreState = this.coreState.core;\n\n    if (!coreState.document) {\n      throw new Error('document does not open');\n    }\n\n    const page = coreState.document.pages.find((page) => page.index === pageIndex);\n    if (!page) {\n      throw new Error('page does not exist');\n    }\n\n    return this.engine.renderPageRect(coreState.document, page, rect, options);\n  }\n}\n","import { PluginManifest } from '@embedpdf/core';\nimport { RenderPluginConfig } from './types';\n\nexport const RENDER_PLUGIN_ID = 'render';\n\nexport const manifest: PluginManifest<RenderPluginConfig> = {\n  id: RENDER_PLUGIN_ID,\n  name: 'Render Plugin',\n  version: '1.0.0',\n  provides: ['render'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n  },\n};\n","import { PluginPackage } from '@embedpdf/core';\nimport { RenderPluginConfig } from './types';\nimport { RenderPlugin } from './render-plugin';\nimport { manifest, RENDER_PLUGIN_ID } from './manifest';\n\nexport const RenderPluginPackage: PluginPackage<RenderPlugin, RenderPluginConfig> = {\n  manifest,\n  create: (registry) => new RenderPlugin(RENDER_PLUGIN_ID, registry),\n  reducer: () => {},\n  initialState: {},\n};\n\nexport * from './render-plugin';\nexport * from './types';\n"],"names":["page"],"mappings":";AAcO,MAAM,gBAAN,MAAM,sBAAqB,WAAiD;AAAA,EAKjF,YAAY,IAAY,UAA0B;AAChD,UAAM,IAAI,QAAQ;AAHpB,SAAiB,gBAAgB,cAAwB;AAKvD,SAAK,UAAU,SAAS,eAAe,CAAC,WAAW;AAC5C,WAAA,cAAc,KAAK,OAAO,OAAO;AAAA,IAAA,CACvC;AAAA,EAAA;AAAA,EAGH,MAAM,WAAW,SAA4C;AAAA,EAAA;AAAA,EAEnD,kBAAoC;AACrC,WAAA;AAAA,MACL,YAAY,KAAK,WAAW,KAAK,IAAI;AAAA,MACrC,gBAAgB,KAAK,eAAe,KAAK,IAAI;AAAA,IAC/C;AAAA,EAAA;AAAA,EAGK,eAAe,IAA4C;AACzD,WAAA,KAAK,cAAc,GAAG,EAAE;AAAA,EAAA;AAAA,EAGzB,WAAW,EAAE,WAAW,WAA8B;AACtD,UAAA,YAAY,KAAK,UAAU;AAE7B,QAAA,CAAC,UAAU,UAAU;AACjB,YAAA,IAAI,MAAM,wBAAwB;AAAA,IAAA;AAGpC,UAAA,OAAO,UAAU,SAAS,MAAM,KAAK,CAACA,UAASA,MAAK,UAAU,SAAS;AAC7E,QAAI,CAAC,MAAM;AACH,YAAA,IAAI,MAAM,qBAAqB;AAAA,IAAA;AAGvC,WAAO,KAAK,OAAO,WAAW,UAAU,UAAU,MAAM,OAAO;AAAA,EAAA;AAAA,EAGzD,eAAe,EAAE,WAAW,MAAM,WAAkC;AACpE,UAAA,YAAY,KAAK,UAAU;AAE7B,QAAA,CAAC,UAAU,UAAU;AACjB,YAAA,IAAI,MAAM,wBAAwB;AAAA,IAAA;AAGpC,UAAA,OAAO,UAAU,SAAS,MAAM,KAAK,CAACA,UAASA,MAAK,UAAU,SAAS;AAC7E,QAAI,CAAC,MAAM;AACH,YAAA,IAAI,MAAM,qBAAqB;AAAA,IAAA;AAGvC,WAAO,KAAK,OAAO,eAAe,UAAU,UAAU,MAAM,MAAM,OAAO;AAAA,EAAA;AAE7E;AAtDE,cAAgB,KAAK;AADhB,IAAM,eAAN;ACXA,MAAM,mBAAmB;AAEzB,MAAM,WAA+C;AAAA,EAC1D,IAAI;AAAA,EACJ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,UAAU,CAAC,QAAQ;AAAA,EACnB,UAAU,CAAC;AAAA,EACX,UAAU,CAAC;AAAA,EACX,eAAe;AAAA,IACb,SAAS;AAAA,EAAA;AAEb;ACVO,MAAM,sBAAuE;AAAA,EAClF;AAAA,EACA,QAAQ,CAAC,aAAa,IAAI,aAAa,kBAAkB,QAAQ;AAAA,EACjE,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,cAAc,CAAA;AAChB;"}

package/dist/lib/render-plugin.d.ts

@@ -1,12 +1,12 @@
-import { BasePlugin, PluginRegistry } from '@embedpdf/core';
+import { BasePlugin, PluginRegistry, Unsubscribe } from '@embedpdf/core';
 import { RenderCapability, RenderPluginConfig } from './types';
-import { PdfEngine } from '@embedpdf/models';
 export declare class RenderPlugin extends BasePlugin<RenderPluginConfig, RenderCapability> {
     static readonly id: "render";
-    private engine;
-    constructor(id: string, registry: PluginRegistry, engine: PdfEngine);
+    private readonly refreshPages$;
+    constructor(id: string, registry: PluginRegistry);
     initialize(_config: RenderPluginConfig): Promise<void>;
     protected buildCapability(): RenderCapability;
+    onRefreshPages(fn: (pages: number[]) => void): Unsubscribe;
     private renderPage;
     private renderPageRect;
 }

package/dist/lib/types.d.ts

@@ -1,27 +1,15 @@
 import { BasePluginConfig } from '@embedpdf/core';
-import { ImageConversionTypes, PdfErrorReason, Rect, Rotation, Task } from '@embedpdf/models';
+import { PdfErrorReason, PdfRenderPageOptions, Rect, Task } from '@embedpdf/models';
 export interface RenderPluginConfig extends BasePluginConfig {
 }
 export interface RenderPageRectOptions {
     pageIndex: number;
-    scaleFactor?: number;
-    rotation?: Rotation;
-    dpr?: number;
     rect: Rect;
-    options?: {
-        withAnnotations: boolean;
-    };
-    imageType?: ImageConversionTypes;
+    options: PdfRenderPageOptions;
 }
 export interface RenderPageOptions {
     pageIndex: number;
-    scaleFactor?: number;
-    dpr?: number;
-    rotation?: Rotation;
-    options?: {
-        withAnnotations: boolean;
-    };
-    imageType?: ImageConversionTypes;
+    options: PdfRenderPageOptions;
 }
 export interface RenderCapability {
     renderPage: (options: RenderPageOptions) => Task<Blob, PdfErrorReason>;

package/dist/preact/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("preact/jsx-runtime"),r=require("preact"),t=require("preact/hooks"),n=require("@embedpdf/models"),u=require("@embedpdf/core/preact"),c=require("@embedpdf/plugin-render"),d=()=>u.useCapability(c.RenderPlugin.id);exports.RenderLayer=function({pageIndex:u,scaleFactor:c=1,dpr:s=1,style:i,...o}){const{provides:a}=d(),[l,p]=t.useState(null),g=t.useRef(null);return t.useEffect((()=>{if(a){const e=a.renderPage({pageIndex:u,scaleFactor:c,dpr:s});return e.wait((e=>{const r=URL.createObjectURL(e);p(r),g.current=r}),n.ignore),()=>{g.current?(URL.revokeObjectURL(g.current),g.current=null):e.abort({code:n.PdfErrorCode.Cancelled,message:"canceled render task"})}}}),[u,c,s,a]),e.jsx(r.Fragment,{children:l&&e.jsx("img",{src:l,onLoad:()=>{g.current&&(URL.revokeObjectURL(g.current),g.current=null)},...o,style:{width:"100%",height:"100%",...i||{}}})})},exports.useRenderCapability=d,exports.useRenderPlugin=()=>u.usePlugin(c.RenderPlugin.id);
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("preact/jsx-runtime"),r=require("preact"),t=require("preact/hooks"),n=require("@embedpdf/models"),u=require("@embedpdf/core/preact"),i=require("@embedpdf/plugin-render"),c=()=>u.usePlugin(i.RenderPlugin.id),s=()=>u.useCapability(i.RenderPlugin.id);exports.RenderLayer=function({pageIndex:u,scaleFactor:i=1,dpr:d,style:o,...a}){const{provides:l}=s(),{plugin:p}=c(),[g,f]=t.useState(null),R=t.useRef(null),[b,x]=t.useState(0);return t.useEffect((()=>{if(p)return p.onRefreshPages((e=>{e.includes(u)&&x((e=>e+1))}))}),[p]),t.useEffect((()=>{if(l){const e=l.renderPage({pageIndex:u,options:{scaleFactor:i,dpr:d||window.devicePixelRatio}});return e.wait((e=>{const r=URL.createObjectURL(e);f(r),R.current=r}),n.ignore),()=>{R.current?(URL.revokeObjectURL(R.current),R.current=null):e.abort({code:n.PdfErrorCode.Cancelled,message:"canceled render task"})}}}),[u,i,d,l,b]),e.jsx(r.Fragment,{children:g&&e.jsx("img",{src:g,onLoad:()=>{R.current&&(URL.revokeObjectURL(R.current),R.current=null)},...a,style:{width:"100%",height:"100%",...o||{}}})})},exports.useRenderCapability=s,exports.useRenderPlugin=c;
 //# sourceMappingURL=index.cjs.map

package/dist/preact/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-render.ts","../../src/shared/components/render-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","import { Fragment, useEffect, useRef, useState } from '@framework';\nimport type { CSSProperties, HTMLAttributes } from '@framework';\n\nimport { ignore, PdfErrorCode } from '@embedpdf/models';\n\nimport { useRenderCapability } from '../hooks/use-render';\n\ntype RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scaleFactor = 1,\n  dpr = 1,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const [imageUrl, setImageUrl] = useState<string | null>(null);\n  const urlRef = useRef<string | null>(null);\n\n  useEffect(() => {\n    if (renderProvides) {\n      const task = renderProvides.renderPage({ pageIndex, scaleFactor, dpr });\n      task.wait((blob) => {\n        const url = URL.createObjectURL(blob);\n        setImageUrl(url);\n        urlRef.current = url;\n      }, ignore);\n\n      return () => {\n        if (urlRef.current) {\n          URL.revokeObjectURL(urlRef.current);\n          urlRef.current = null;\n        } else {\n          task.abort({\n            code: PdfErrorCode.Cancelled,\n            message: 'canceled render task',\n          });\n        }\n      };\n    }\n  }, [pageIndex, scaleFactor, dpr, renderProvides]);\n\n  const handleImageLoad = () => {\n    if (urlRef.current) {\n      URL.revokeObjectURL(urlRef.current);\n      urlRef.current = null;\n    }\n  };\n\n  return (\n    <Fragment>\n      {imageUrl && (\n        <img\n          src={imageUrl}\n          onLoad={handleImageLoad}\n          {...props}\n          style={{\n            width: '100%',\n            height: '100%',\n            ...(style || {}),\n          }}\n        />\n      )}\n    </Fragment>\n  );\n}\n"],"names":["useRenderCapability","useCapability","RenderPlugin","id","pageIndex","scaleFactor","dpr","style","props","provides","renderProvides","imageUrl","setImageUrl","useState","urlRef","useRef","useEffect","task","renderPage","wait","blob","url","URL","createObjectURL","current","ignore","revokeObjectURL","abort","code","PdfErrorCode","Cancelled","message","jsx","Fragment","children","jsxRuntime","src","onLoad","width","height","usePlugin"],"mappings":"0QAIaA,EAAsB,IAAMC,gBAA4BC,EAAAA,aAAaC,wBCU3E,UAAqBC,UAC1BA,EAAAC,YACAA,EAAc,EAAAC,IACdA,EAAM,EAAAC,MACNA,KACGC,IAEH,MAAQC,SAAUC,GAAmBV,KAC9BW,EAAUC,GAAeC,EAAAA,SAAwB,MAClDC,EAASC,SAAsB,MAiCnC,OA/BFC,EAAAA,WAAU,KACR,GAAIN,EAAgB,CAClB,MAAMO,EAAOP,EAAeQ,WAAW,CAAEd,YAAWC,cAAaC,QAOjE,OANKW,EAAAE,MAAMC,IACH,MAAAC,EAAMC,IAAIC,gBAAgBH,GAChCR,EAAYS,GACZP,EAAOU,QAAUH,CAAA,GAChBI,UAEI,KACDX,EAAOU,SACLF,IAAAI,gBAAgBZ,EAAOU,SAC3BV,EAAOU,QAAU,MAEjBP,EAAKU,MAAM,CACTC,KAAMC,EAAaA,aAAAC,UACnBC,QAAS,wBACV,CAEL,IAED,CAAC3B,EAAWC,EAAaC,EAAKI,MAU/BsB,IAACC,YACEC,SACCvB,GAAAwB,EAAAH,IAAC,MAAA,CACCI,IAAKzB,EACL0B,OAZgB,KAClBvB,EAAOU,UACLF,IAAAI,gBAAgBZ,EAAOU,SAC3BV,EAAOU,QAAU,KAAA,KAUThB,EACJD,MAAO,CACL+B,MAAO,OACPC,OAAQ,UACJhC,GAAS,CAAA,MAMzB,wDDpE+B,IAAMiC,YAAwBtC,EAAAA,aAAaC"}
+{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-render.ts","../../src/shared/components/render-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","import { Fragment, useEffect, useRef, useState } from '@framework';\nimport type { CSSProperties, HTMLAttributes } from '@framework';\n\nimport { ignore, PdfErrorCode } from '@embedpdf/models';\n\nimport { useRenderCapability, useRenderPlugin } from '../hooks/use-render';\n\ntype RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scaleFactor = 1,\n  dpr,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const { plugin: renderPlugin } = useRenderPlugin();\n\n  const [imageUrl, setImageUrl] = useState<string | null>(null);\n  const urlRef = useRef<string | null>(null);\n  const [refreshTick, setRefreshTick] = useState(0);\n\n  useEffect(() => {\n    if (!renderPlugin) return;\n    return renderPlugin.onRefreshPages((pages) => {\n      if (pages.includes(pageIndex)) {\n        setRefreshTick((tick) => tick + 1);\n      }\n    });\n  }, [renderPlugin]);\n\n  useEffect(() => {\n    if (renderProvides) {\n      const task = renderProvides.renderPage({\n        pageIndex,\n        options: { scaleFactor, dpr: dpr || window.devicePixelRatio },\n      });\n      task.wait((blob) => {\n        const url = URL.createObjectURL(blob);\n        setImageUrl(url);\n        urlRef.current = url;\n      }, ignore);\n\n      return () => {\n        if (urlRef.current) {\n          URL.revokeObjectURL(urlRef.current);\n          urlRef.current = null;\n        } else {\n          task.abort({\n            code: PdfErrorCode.Cancelled,\n            message: 'canceled render task',\n          });\n        }\n      };\n    }\n  }, [pageIndex, scaleFactor, dpr, renderProvides, refreshTick]);\n\n  const handleImageLoad = () => {\n    if (urlRef.current) {\n      URL.revokeObjectURL(urlRef.current);\n      urlRef.current = null;\n    }\n  };\n\n  return (\n    <Fragment>\n      {imageUrl && (\n        <img\n          src={imageUrl}\n          onLoad={handleImageLoad}\n          {...props}\n          style={{\n            width: '100%',\n            height: '100%',\n            ...(style || {}),\n          }}\n        />\n      )}\n    </Fragment>\n  );\n}\n"],"names":["useRenderPlugin","usePlugin","RenderPlugin","id","useRenderCapability","useCapability","pageIndex","scaleFactor","dpr","style","props","provides","renderProvides","plugin","renderPlugin","imageUrl","setImageUrl","useState","urlRef","useRef","refreshTick","setRefreshTick","useEffect","onRefreshPages","pages","includes","tick","task","renderPage","options","window","devicePixelRatio","wait","blob","url","URL","createObjectURL","current","ignore","revokeObjectURL","abort","code","PdfErrorCode","Cancelled","message","jsx","Fragment","children","jsxRuntime","src","onLoad","width","height"],"mappings":"0QAGaA,EAAkB,IAAMC,YAAwBC,EAAAA,aAAaC,IAC7DC,EAAsB,IAAMC,gBAA4BH,EAAAA,aAAaC,wBCU3E,UAAqBG,UAC1BA,EAAAC,YACAA,EAAc,EAAAC,IACdA,EAAAC,MACAA,KACGC,IAEH,MAAQC,SAAUC,GAAmBR,KAC7BS,OAAQC,GAAiBd,KAE1Be,EAAUC,GAAeC,EAAAA,SAAwB,MAClDC,EAASC,SAAsB,OAC9BC,EAAaC,GAAkBJ,EAAAA,SAAS,GA6C7C,OA3CFK,EAAAA,WAAU,KACR,GAAKR,EACE,OAAAA,EAAaS,gBAAgBC,IAC9BA,EAAMC,SAASnB,IACFe,GAACK,GAASA,EAAO,GAAC,GAEpC,GACA,CAACZ,IAEJQ,EAAAA,WAAU,KACR,GAAIV,EAAgB,CACZ,MAAAe,EAAOf,EAAegB,WAAW,CACrCtB,YACAuB,QAAS,CAAEtB,cAAaC,IAAKA,GAAOsB,OAAOC,oBAQ7C,OANKJ,EAAAK,MAAMC,IACH,MAAAC,EAAMC,IAAIC,gBAAgBH,GAChCjB,EAAYkB,GACZhB,EAAOmB,QAAUH,CAAA,GAChBI,UAEI,KACDpB,EAAOmB,SACLF,IAAAI,gBAAgBrB,EAAOmB,SAC3BnB,EAAOmB,QAAU,MAEjBV,EAAKa,MAAM,CACTC,KAAMC,EAAaA,aAAAC,UACnBC,QAAS,wBACV,CAEL,IAED,CAACtC,EAAWC,EAAaC,EAAKI,EAAgBQ,MAU/CyB,IAACC,YACEC,SACChC,GAAAiC,EAAAH,IAAC,MAAA,CACCI,IAAKlC,EACLmC,OAZgB,KAClBhC,EAAOmB,UACLF,IAAAI,gBAAgBrB,EAAOmB,SAC3BnB,EAAOmB,QAAU,KAAA,KAUT3B,EACJD,MAAO,CACL0C,MAAO,OACPC,OAAQ,UACJ3C,GAAS,CAAA,MAMzB"}

package/dist/preact/index.js

@@ -9,16 +9,29 @@ const useRenderCapability = () => useCapability(RenderPlugin.id);
 function RenderLayer({
   pageIndex,
   scaleFactor = 1,
-  dpr = 1,
+  dpr,
   style,
   ...props
 }) {
   const { provides: renderProvides } = useRenderCapability();
+  const { plugin: renderPlugin } = useRenderPlugin();
   const [imageUrl, setImageUrl] = useState(null);
   const urlRef = useRef(null);
+  const [refreshTick, setRefreshTick] = useState(0);
+  useEffect(() => {
+    if (!renderPlugin) return;
+    return renderPlugin.onRefreshPages((pages) => {
+      if (pages.includes(pageIndex)) {
+        setRefreshTick((tick) => tick + 1);
+      }
+    });
+  }, [renderPlugin]);
   useEffect(() => {
     if (renderProvides) {
-      const task = renderProvides.renderPage({ pageIndex, scaleFactor, dpr });
+      const task = renderProvides.renderPage({
+        pageIndex,
+        options: { scaleFactor, dpr: dpr || window.devicePixelRatio }
+      });
       task.wait((blob) => {
         const url = URL.createObjectURL(blob);
         setImageUrl(url);
@@ -36,7 +49,7 @@ function RenderLayer({
         }
       };
     }
-  }, [pageIndex, scaleFactor, dpr, renderProvides]);
+  }, [pageIndex, scaleFactor, dpr, renderProvides, refreshTick]);
   const handleImageLoad = () => {
     if (urlRef.current) {
       URL.revokeObjectURL(urlRef.current);

package/dist/preact/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-render.ts","../../src/shared/components/render-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","import { Fragment, useEffect, useRef, useState } from '@framework';\nimport type { CSSProperties, HTMLAttributes } from '@framework';\n\nimport { ignore, PdfErrorCode } from '@embedpdf/models';\n\nimport { useRenderCapability } from '../hooks/use-render';\n\ntype RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scaleFactor = 1,\n  dpr = 1,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const [imageUrl, setImageUrl] = useState<string | null>(null);\n  const urlRef = useRef<string | null>(null);\n\n  useEffect(() => {\n    if (renderProvides) {\n      const task = renderProvides.renderPage({ pageIndex, scaleFactor, dpr });\n      task.wait((blob) => {\n        const url = URL.createObjectURL(blob);\n        setImageUrl(url);\n        urlRef.current = url;\n      }, ignore);\n\n      return () => {\n        if (urlRef.current) {\n          URL.revokeObjectURL(urlRef.current);\n          urlRef.current = null;\n        } else {\n          task.abort({\n            code: PdfErrorCode.Cancelled,\n            message: 'canceled render task',\n          });\n        }\n      };\n    }\n  }, [pageIndex, scaleFactor, dpr, renderProvides]);\n\n  const handleImageLoad = () => {\n    if (urlRef.current) {\n      URL.revokeObjectURL(urlRef.current);\n      urlRef.current = null;\n    }\n  };\n\n  return (\n    <Fragment>\n      {imageUrl && (\n        <img\n          src={imageUrl}\n          onLoad={handleImageLoad}\n          {...props}\n          style={{\n            width: '100%',\n            height: '100%',\n            ...(style || {}),\n          }}\n        />\n      )}\n    </Fragment>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAGO,MAAM,kBAAkB,MAAM,UAAwB,aAAa,EAAE;AACrE,MAAM,sBAAsB,MAAM,cAA4B,aAAa,EAAE;ACU7E,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,cAAc;AAAA,EACd,MAAM;AAAA,EACN;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,EAAE,UAAU,eAAe,IAAI,oBAAoB;AACzD,QAAM,CAAC,UAAU,WAAW,IAAI,SAAwB,IAAI;AACtD,QAAA,SAAS,OAAsB,IAAI;AAEzC,YAAU,MAAM;AACd,QAAI,gBAAgB;AAClB,YAAM,OAAO,eAAe,WAAW,EAAE,WAAW,aAAa,KAAK;AACjE,WAAA,KAAK,CAAC,SAAS;AACZ,cAAA,MAAM,IAAI,gBAAgB,IAAI;AACpC,oBAAY,GAAG;AACf,eAAO,UAAU;AAAA,SAChB,MAAM;AAET,aAAO,MAAM;AACX,YAAI,OAAO,SAAS;AACd,cAAA,gBAAgB,OAAO,OAAO;AAClC,iBAAO,UAAU;AAAA,QAAA,OACZ;AACL,eAAK,MAAM;AAAA,YACT,MAAM,aAAa;AAAA,YACnB,SAAS;AAAA,UAAA,CACV;AAAA,QAAA;AAAA,MAEL;AAAA,IAAA;AAAA,KAED,CAAC,WAAW,aAAa,KAAK,cAAc,CAAC;AAEhD,QAAM,kBAAkB,MAAM;AAC5B,QAAI,OAAO,SAAS;AACd,UAAA,gBAAgB,OAAO,OAAO;AAClC,aAAO,UAAU;AAAA,IAAA;AAAA,EAErB;AAGE,SAAA,oBAAC,YACE,UACC,YAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,QAAQ;AAAA,MACP,GAAG;AAAA,MACJ,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,GAAI,SAAS,CAAA;AAAA,MAAC;AAAA,IAChB;AAAA,EAAA,GAGN;AAEJ;"}
+{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-render.ts","../../src/shared/components/render-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","import { Fragment, useEffect, useRef, useState } from '@framework';\nimport type { CSSProperties, HTMLAttributes } from '@framework';\n\nimport { ignore, PdfErrorCode } from '@embedpdf/models';\n\nimport { useRenderCapability, useRenderPlugin } from '../hooks/use-render';\n\ntype RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scaleFactor = 1,\n  dpr,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const { plugin: renderPlugin } = useRenderPlugin();\n\n  const [imageUrl, setImageUrl] = useState<string | null>(null);\n  const urlRef = useRef<string | null>(null);\n  const [refreshTick, setRefreshTick] = useState(0);\n\n  useEffect(() => {\n    if (!renderPlugin) return;\n    return renderPlugin.onRefreshPages((pages) => {\n      if (pages.includes(pageIndex)) {\n        setRefreshTick((tick) => tick + 1);\n      }\n    });\n  }, [renderPlugin]);\n\n  useEffect(() => {\n    if (renderProvides) {\n      const task = renderProvides.renderPage({\n        pageIndex,\n        options: { scaleFactor, dpr: dpr || window.devicePixelRatio },\n      });\n      task.wait((blob) => {\n        const url = URL.createObjectURL(blob);\n        setImageUrl(url);\n        urlRef.current = url;\n      }, ignore);\n\n      return () => {\n        if (urlRef.current) {\n          URL.revokeObjectURL(urlRef.current);\n          urlRef.current = null;\n        } else {\n          task.abort({\n            code: PdfErrorCode.Cancelled,\n            message: 'canceled render task',\n          });\n        }\n      };\n    }\n  }, [pageIndex, scaleFactor, dpr, renderProvides, refreshTick]);\n\n  const handleImageLoad = () => {\n    if (urlRef.current) {\n      URL.revokeObjectURL(urlRef.current);\n      urlRef.current = null;\n    }\n  };\n\n  return (\n    <Fragment>\n      {imageUrl && (\n        <img\n          src={imageUrl}\n          onLoad={handleImageLoad}\n          {...props}\n          style={{\n            width: '100%',\n            height: '100%',\n            ...(style || {}),\n          }}\n        />\n      )}\n    </Fragment>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAGO,MAAM,kBAAkB,MAAM,UAAwB,aAAa,EAAE;AACrE,MAAM,sBAAsB,MAAM,cAA4B,aAAa,EAAE;ACU7E,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,EAAE,UAAU,eAAe,IAAI,oBAAoB;AACzD,QAAM,EAAE,QAAQ,aAAa,IAAI,gBAAgB;AAEjD,QAAM,CAAC,UAAU,WAAW,IAAI,SAAwB,IAAI;AACtD,QAAA,SAAS,OAAsB,IAAI;AACzC,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,CAAC;AAEhD,YAAU,MAAM;AACd,QAAI,CAAC,aAAc;AACZ,WAAA,aAAa,eAAe,CAAC,UAAU;AACxC,UAAA,MAAM,SAAS,SAAS,GAAG;AACd,uBAAA,CAAC,SAAS,OAAO,CAAC;AAAA,MAAA;AAAA,IACnC,CACD;AAAA,EAAA,GACA,CAAC,YAAY,CAAC;AAEjB,YAAU,MAAM;AACd,QAAI,gBAAgB;AACZ,YAAA,OAAO,eAAe,WAAW;AAAA,QACrC;AAAA,QACA,SAAS,EAAE,aAAa,KAAK,OAAO,OAAO,iBAAiB;AAAA,MAAA,CAC7D;AACI,WAAA,KAAK,CAAC,SAAS;AACZ,cAAA,MAAM,IAAI,gBAAgB,IAAI;AACpC,oBAAY,GAAG;AACf,eAAO,UAAU;AAAA,SAChB,MAAM;AAET,aAAO,MAAM;AACX,YAAI,OAAO,SAAS;AACd,cAAA,gBAAgB,OAAO,OAAO;AAClC,iBAAO,UAAU;AAAA,QAAA,OACZ;AACL,eAAK,MAAM;AAAA,YACT,MAAM,aAAa;AAAA,YACnB,SAAS;AAAA,UAAA,CACV;AAAA,QAAA;AAAA,MAEL;AAAA,IAAA;AAAA,EACF,GACC,CAAC,WAAW,aAAa,KAAK,gBAAgB,WAAW,CAAC;AAE7D,QAAM,kBAAkB,MAAM;AAC5B,QAAI,OAAO,SAAS;AACd,UAAA,gBAAgB,OAAO,OAAO;AAClC,aAAO,UAAU;AAAA,IAAA;AAAA,EAErB;AAGE,SAAA,oBAAC,YACE,UACC,YAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,QAAQ;AAAA,MACP,GAAG;AAAA,MACJ,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,GAAI,SAAS,CAAA;AAAA,MAAC;AAAA,IAChB;AAAA,EAAA,GAGN;AAEJ;"}

package/dist/react/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),t=require("@embedpdf/models"),n=require("@embedpdf/core/react"),u=require("@embedpdf/plugin-render"),c=()=>n.useCapability(u.RenderPlugin.id);exports.RenderLayer=function({pageIndex:n,scaleFactor:u=1,dpr:d=1,style:s,...i}){const{provides:a}=c(),[l,o]=r.useState(null),p=r.useRef(null);return r.useEffect((()=>{if(a){const e=a.renderPage({pageIndex:n,scaleFactor:u,dpr:d});return e.wait((e=>{const r=URL.createObjectURL(e);o(r),p.current=r}),t.ignore),()=>{p.current?(URL.revokeObjectURL(p.current),p.current=null):e.abort({code:t.PdfErrorCode.Cancelled,message:"canceled render task"})}}}),[n,u,d,a]),e.jsx(r.Fragment,{children:l&&e.jsx("img",{src:l,onLoad:()=>{p.current&&(URL.revokeObjectURL(p.current),p.current=null)},...i,style:{width:"100%",height:"100%",...s||{}}})})},exports.useRenderCapability=c,exports.useRenderPlugin=()=>n.usePlugin(u.RenderPlugin.id);
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),t=require("@embedpdf/models"),n=require("@embedpdf/core/react"),u=require("@embedpdf/plugin-render"),i=()=>n.usePlugin(u.RenderPlugin.id),c=()=>n.useCapability(u.RenderPlugin.id);exports.RenderLayer=function({pageIndex:n,scaleFactor:u=1,dpr:s,style:d,...o}){const{provides:a}=c(),{plugin:l}=i(),[p,g]=r.useState(null),f=r.useRef(null),[R,b]=r.useState(0);return r.useEffect((()=>{if(l)return l.onRefreshPages((e=>{e.includes(n)&&b((e=>e+1))}))}),[l]),r.useEffect((()=>{if(a){const e=a.renderPage({pageIndex:n,options:{scaleFactor:u,dpr:s||window.devicePixelRatio}});return e.wait((e=>{const r=URL.createObjectURL(e);g(r),f.current=r}),t.ignore),()=>{f.current?(URL.revokeObjectURL(f.current),f.current=null):e.abort({code:t.PdfErrorCode.Cancelled,message:"canceled render task"})}}}),[n,u,s,a,R]),e.jsx(r.Fragment,{children:p&&e.jsx("img",{src:p,onLoad:()=>{f.current&&(URL.revokeObjectURL(f.current),f.current=null)},...o,style:{width:"100%",height:"100%",...d||{}}})})},exports.useRenderCapability=c,exports.useRenderPlugin=i;
 //# sourceMappingURL=index.cjs.map

package/dist/react/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-render.ts","../../src/shared/components/render-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","import { Fragment, useEffect, useRef, useState } from '@framework';\nimport type { CSSProperties, HTMLAttributes } from '@framework';\n\nimport { ignore, PdfErrorCode } from '@embedpdf/models';\n\nimport { useRenderCapability } from '../hooks/use-render';\n\ntype RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scaleFactor = 1,\n  dpr = 1,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const [imageUrl, setImageUrl] = useState<string | null>(null);\n  const urlRef = useRef<string | null>(null);\n\n  useEffect(() => {\n    if (renderProvides) {\n      const task = renderProvides.renderPage({ pageIndex, scaleFactor, dpr });\n      task.wait((blob) => {\n        const url = URL.createObjectURL(blob);\n        setImageUrl(url);\n        urlRef.current = url;\n      }, ignore);\n\n      return () => {\n        if (urlRef.current) {\n          URL.revokeObjectURL(urlRef.current);\n          urlRef.current = null;\n        } else {\n          task.abort({\n            code: PdfErrorCode.Cancelled,\n            message: 'canceled render task',\n          });\n        }\n      };\n    }\n  }, [pageIndex, scaleFactor, dpr, renderProvides]);\n\n  const handleImageLoad = () => {\n    if (urlRef.current) {\n      URL.revokeObjectURL(urlRef.current);\n      urlRef.current = null;\n    }\n  };\n\n  return (\n    <Fragment>\n      {imageUrl && (\n        <img\n          src={imageUrl}\n          onLoad={handleImageLoad}\n          {...props}\n          style={{\n            width: '100%',\n            height: '100%',\n            ...(style || {}),\n          }}\n        />\n      )}\n    </Fragment>\n  );\n}\n"],"names":["useRenderCapability","useCapability","RenderPlugin","id","pageIndex","scaleFactor","dpr","style","props","provides","renderProvides","imageUrl","setImageUrl","useState","urlRef","useRef","useEffect","task","renderPage","wait","blob","url","URL","createObjectURL","current","ignore","revokeObjectURL","abort","code","PdfErrorCode","Cancelled","message","jsx","Fragment","children","jsxRuntime","src","onLoad","width","height","usePlugin"],"mappings":"6OAIaA,EAAsB,IAAMC,gBAA4BC,EAAAA,aAAaC,wBCU3E,UAAqBC,UAC1BA,EAAAC,YACAA,EAAc,EAAAC,IACdA,EAAM,EAAAC,MACNA,KACGC,IAEH,MAAQC,SAAUC,GAAmBV,KAC9BW,EAAUC,GAAeC,EAAAA,SAAwB,MAClDC,EAASC,SAAsB,MAiCnC,OA/BFC,EAAAA,WAAU,KACR,GAAIN,EAAgB,CAClB,MAAMO,EAAOP,EAAeQ,WAAW,CAAEd,YAAWC,cAAaC,QAOjE,OANKW,EAAAE,MAAMC,IACH,MAAAC,EAAMC,IAAIC,gBAAgBH,GAChCR,EAAYS,GACZP,EAAOU,QAAUH,CAAA,GAChBI,UAEI,KACDX,EAAOU,SACLF,IAAAI,gBAAgBZ,EAAOU,SAC3BV,EAAOU,QAAU,MAEjBP,EAAKU,MAAM,CACTC,KAAMC,EAAaA,aAAAC,UACnBC,QAAS,wBACV,CAEL,IAED,CAAC3B,EAAWC,EAAaC,EAAKI,MAU/BsB,IAACC,YACEC,SACCvB,GAAAwB,EAAAH,IAAC,MAAA,CACCI,IAAKzB,EACL0B,OAZgB,KAClBvB,EAAOU,UACLF,IAAAI,gBAAgBZ,EAAOU,SAC3BV,EAAOU,QAAU,KAAA,KAUThB,EACJD,MAAO,CACL+B,MAAO,OACPC,OAAQ,UACJhC,GAAS,CAAA,MAMzB,wDDpE+B,IAAMiC,YAAwBtC,EAAAA,aAAaC"}
+{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-render.ts","../../src/shared/components/render-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","import { Fragment, useEffect, useRef, useState } from '@framework';\nimport type { CSSProperties, HTMLAttributes } from '@framework';\n\nimport { ignore, PdfErrorCode } from '@embedpdf/models';\n\nimport { useRenderCapability, useRenderPlugin } from '../hooks/use-render';\n\ntype RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scaleFactor = 1,\n  dpr,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const { plugin: renderPlugin } = useRenderPlugin();\n\n  const [imageUrl, setImageUrl] = useState<string | null>(null);\n  const urlRef = useRef<string | null>(null);\n  const [refreshTick, setRefreshTick] = useState(0);\n\n  useEffect(() => {\n    if (!renderPlugin) return;\n    return renderPlugin.onRefreshPages((pages) => {\n      if (pages.includes(pageIndex)) {\n        setRefreshTick((tick) => tick + 1);\n      }\n    });\n  }, [renderPlugin]);\n\n  useEffect(() => {\n    if (renderProvides) {\n      const task = renderProvides.renderPage({\n        pageIndex,\n        options: { scaleFactor, dpr: dpr || window.devicePixelRatio },\n      });\n      task.wait((blob) => {\n        const url = URL.createObjectURL(blob);\n        setImageUrl(url);\n        urlRef.current = url;\n      }, ignore);\n\n      return () => {\n        if (urlRef.current) {\n          URL.revokeObjectURL(urlRef.current);\n          urlRef.current = null;\n        } else {\n          task.abort({\n            code: PdfErrorCode.Cancelled,\n            message: 'canceled render task',\n          });\n        }\n      };\n    }\n  }, [pageIndex, scaleFactor, dpr, renderProvides, refreshTick]);\n\n  const handleImageLoad = () => {\n    if (urlRef.current) {\n      URL.revokeObjectURL(urlRef.current);\n      urlRef.current = null;\n    }\n  };\n\n  return (\n    <Fragment>\n      {imageUrl && (\n        <img\n          src={imageUrl}\n          onLoad={handleImageLoad}\n          {...props}\n          style={{\n            width: '100%',\n            height: '100%',\n            ...(style || {}),\n          }}\n        />\n      )}\n    </Fragment>\n  );\n}\n"],"names":["useRenderPlugin","usePlugin","RenderPlugin","id","useRenderCapability","useCapability","pageIndex","scaleFactor","dpr","style","props","provides","renderProvides","plugin","renderPlugin","imageUrl","setImageUrl","useState","urlRef","useRef","refreshTick","setRefreshTick","useEffect","onRefreshPages","pages","includes","tick","task","renderPage","options","window","devicePixelRatio","wait","blob","url","URL","createObjectURL","current","ignore","revokeObjectURL","abort","code","PdfErrorCode","Cancelled","message","jsx","Fragment","children","jsxRuntime","src","onLoad","width","height"],"mappings":"6OAGaA,EAAkB,IAAMC,YAAwBC,EAAAA,aAAaC,IAC7DC,EAAsB,IAAMC,gBAA4BH,EAAAA,aAAaC,wBCU3E,UAAqBG,UAC1BA,EAAAC,YACAA,EAAc,EAAAC,IACdA,EAAAC,MACAA,KACGC,IAEH,MAAQC,SAAUC,GAAmBR,KAC7BS,OAAQC,GAAiBd,KAE1Be,EAAUC,GAAeC,EAAAA,SAAwB,MAClDC,EAASC,SAAsB,OAC9BC,EAAaC,GAAkBJ,EAAAA,SAAS,GA6C7C,OA3CFK,EAAAA,WAAU,KACR,GAAKR,EACE,OAAAA,EAAaS,gBAAgBC,IAC9BA,EAAMC,SAASnB,IACFe,GAACK,GAASA,EAAO,GAAC,GAEpC,GACA,CAACZ,IAEJQ,EAAAA,WAAU,KACR,GAAIV,EAAgB,CACZ,MAAAe,EAAOf,EAAegB,WAAW,CACrCtB,YACAuB,QAAS,CAAEtB,cAAaC,IAAKA,GAAOsB,OAAOC,oBAQ7C,OANKJ,EAAAK,MAAMC,IACH,MAAAC,EAAMC,IAAIC,gBAAgBH,GAChCjB,EAAYkB,GACZhB,EAAOmB,QAAUH,CAAA,GAChBI,UAEI,KACDpB,EAAOmB,SACLF,IAAAI,gBAAgBrB,EAAOmB,SAC3BnB,EAAOmB,QAAU,MAEjBV,EAAKa,MAAM,CACTC,KAAMC,EAAaA,aAAAC,UACnBC,QAAS,wBACV,CAEL,IAED,CAACtC,EAAWC,EAAaC,EAAKI,EAAgBQ,MAU/CyB,IAACC,YACEC,SACChC,GAAAiC,EAAAH,IAAC,MAAA,CACCI,IAAKlC,EACLmC,OAZgB,KAClBhC,EAAOmB,UACLF,IAAAI,gBAAgBrB,EAAOmB,SAC3BnB,EAAOmB,QAAU,KAAA,KAUT3B,EACJD,MAAO,CACL0C,MAAO,OACPC,OAAQ,UACJ3C,GAAS,CAAA,MAMzB"}

package/dist/react/index.js

@@ -8,16 +8,29 @@ const useRenderCapability = () => useCapability(RenderPlugin.id);
 function RenderLayer({
   pageIndex,
   scaleFactor = 1,
-  dpr = 1,
+  dpr,
   style,
   ...props
 }) {
   const { provides: renderProvides } = useRenderCapability();
+  const { plugin: renderPlugin } = useRenderPlugin();
   const [imageUrl, setImageUrl] = useState(null);
   const urlRef = useRef(null);
+  const [refreshTick, setRefreshTick] = useState(0);
+  useEffect(() => {
+    if (!renderPlugin) return;
+    return renderPlugin.onRefreshPages((pages) => {
+      if (pages.includes(pageIndex)) {
+        setRefreshTick((tick) => tick + 1);
+      }
+    });
+  }, [renderPlugin]);
   useEffect(() => {
     if (renderProvides) {
-      const task = renderProvides.renderPage({ pageIndex, scaleFactor, dpr });
+      const task = renderProvides.renderPage({
+        pageIndex,
+        options: { scaleFactor, dpr: dpr || window.devicePixelRatio }
+      });
       task.wait((blob) => {
         const url = URL.createObjectURL(blob);
         setImageUrl(url);
@@ -35,7 +48,7 @@ function RenderLayer({
         }
       };
     }
-  }, [pageIndex, scaleFactor, dpr, renderProvides]);
+  }, [pageIndex, scaleFactor, dpr, renderProvides, refreshTick]);
   const handleImageLoad = () => {
     if (urlRef.current) {
       URL.revokeObjectURL(urlRef.current);

package/dist/react/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-render.ts","../../src/shared/components/render-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","import { Fragment, useEffect, useRef, useState } from '@framework';\nimport type { CSSProperties, HTMLAttributes } from '@framework';\n\nimport { ignore, PdfErrorCode } from '@embedpdf/models';\n\nimport { useRenderCapability } from '../hooks/use-render';\n\ntype RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scaleFactor = 1,\n  dpr = 1,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const [imageUrl, setImageUrl] = useState<string | null>(null);\n  const urlRef = useRef<string | null>(null);\n\n  useEffect(() => {\n    if (renderProvides) {\n      const task = renderProvides.renderPage({ pageIndex, scaleFactor, dpr });\n      task.wait((blob) => {\n        const url = URL.createObjectURL(blob);\n        setImageUrl(url);\n        urlRef.current = url;\n      }, ignore);\n\n      return () => {\n        if (urlRef.current) {\n          URL.revokeObjectURL(urlRef.current);\n          urlRef.current = null;\n        } else {\n          task.abort({\n            code: PdfErrorCode.Cancelled,\n            message: 'canceled render task',\n          });\n        }\n      };\n    }\n  }, [pageIndex, scaleFactor, dpr, renderProvides]);\n\n  const handleImageLoad = () => {\n    if (urlRef.current) {\n      URL.revokeObjectURL(urlRef.current);\n      urlRef.current = null;\n    }\n  };\n\n  return (\n    <Fragment>\n      {imageUrl && (\n        <img\n          src={imageUrl}\n          onLoad={handleImageLoad}\n          {...props}\n          style={{\n            width: '100%',\n            height: '100%',\n            ...(style || {}),\n          }}\n        />\n      )}\n    </Fragment>\n  );\n}\n"],"names":[],"mappings":";;;;;AAGO,MAAM,kBAAkB,MAAM,UAAwB,aAAa,EAAE;AACrE,MAAM,sBAAsB,MAAM,cAA4B,aAAa,EAAE;ACU7E,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,cAAc;AAAA,EACd,MAAM;AAAA,EACN;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,EAAE,UAAU,eAAe,IAAI,oBAAoB;AACzD,QAAM,CAAC,UAAU,WAAW,IAAI,SAAwB,IAAI;AACtD,QAAA,SAAS,OAAsB,IAAI;AAEzC,YAAU,MAAM;AACd,QAAI,gBAAgB;AAClB,YAAM,OAAO,eAAe,WAAW,EAAE,WAAW,aAAa,KAAK;AACjE,WAAA,KAAK,CAAC,SAAS;AACZ,cAAA,MAAM,IAAI,gBAAgB,IAAI;AACpC,oBAAY,GAAG;AACf,eAAO,UAAU;AAAA,SAChB,MAAM;AAET,aAAO,MAAM;AACX,YAAI,OAAO,SAAS;AACd,cAAA,gBAAgB,OAAO,OAAO;AAClC,iBAAO,UAAU;AAAA,QAAA,OACZ;AACL,eAAK,MAAM;AAAA,YACT,MAAM,aAAa;AAAA,YACnB,SAAS;AAAA,UAAA,CACV;AAAA,QAAA;AAAA,MAEL;AAAA,IAAA;AAAA,KAED,CAAC,WAAW,aAAa,KAAK,cAAc,CAAC;AAEhD,QAAM,kBAAkB,MAAM;AAC5B,QAAI,OAAO,SAAS;AACd,UAAA,gBAAgB,OAAO,OAAO;AAClC,aAAO,UAAU;AAAA,IAAA;AAAA,EAErB;AAGE,SAAA,oBAAC,YACE,UACC,YAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,QAAQ;AAAA,MACP,GAAG;AAAA,MACJ,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,GAAI,SAAS,CAAA;AAAA,MAAC;AAAA,IAChB;AAAA,EAAA,GAGN;AAEJ;"}
+{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-render.ts","../../src/shared/components/render-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","import { Fragment, useEffect, useRef, useState } from '@framework';\nimport type { CSSProperties, HTMLAttributes } from '@framework';\n\nimport { ignore, PdfErrorCode } from '@embedpdf/models';\n\nimport { useRenderCapability, useRenderPlugin } from '../hooks/use-render';\n\ntype RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scaleFactor = 1,\n  dpr,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const { plugin: renderPlugin } = useRenderPlugin();\n\n  const [imageUrl, setImageUrl] = useState<string | null>(null);\n  const urlRef = useRef<string | null>(null);\n  const [refreshTick, setRefreshTick] = useState(0);\n\n  useEffect(() => {\n    if (!renderPlugin) return;\n    return renderPlugin.onRefreshPages((pages) => {\n      if (pages.includes(pageIndex)) {\n        setRefreshTick((tick) => tick + 1);\n      }\n    });\n  }, [renderPlugin]);\n\n  useEffect(() => {\n    if (renderProvides) {\n      const task = renderProvides.renderPage({\n        pageIndex,\n        options: { scaleFactor, dpr: dpr || window.devicePixelRatio },\n      });\n      task.wait((blob) => {\n        const url = URL.createObjectURL(blob);\n        setImageUrl(url);\n        urlRef.current = url;\n      }, ignore);\n\n      return () => {\n        if (urlRef.current) {\n          URL.revokeObjectURL(urlRef.current);\n          urlRef.current = null;\n        } else {\n          task.abort({\n            code: PdfErrorCode.Cancelled,\n            message: 'canceled render task',\n          });\n        }\n      };\n    }\n  }, [pageIndex, scaleFactor, dpr, renderProvides, refreshTick]);\n\n  const handleImageLoad = () => {\n    if (urlRef.current) {\n      URL.revokeObjectURL(urlRef.current);\n      urlRef.current = null;\n    }\n  };\n\n  return (\n    <Fragment>\n      {imageUrl && (\n        <img\n          src={imageUrl}\n          onLoad={handleImageLoad}\n          {...props}\n          style={{\n            width: '100%',\n            height: '100%',\n            ...(style || {}),\n          }}\n        />\n      )}\n    </Fragment>\n  );\n}\n"],"names":[],"mappings":";;;;;AAGO,MAAM,kBAAkB,MAAM,UAAwB,aAAa,EAAE;AACrE,MAAM,sBAAsB,MAAM,cAA4B,aAAa,EAAE;ACU7E,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,EAAE,UAAU,eAAe,IAAI,oBAAoB;AACzD,QAAM,EAAE,QAAQ,aAAa,IAAI,gBAAgB;AAEjD,QAAM,CAAC,UAAU,WAAW,IAAI,SAAwB,IAAI;AACtD,QAAA,SAAS,OAAsB,IAAI;AACzC,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,CAAC;AAEhD,YAAU,MAAM;AACd,QAAI,CAAC,aAAc;AACZ,WAAA,aAAa,eAAe,CAAC,UAAU;AACxC,UAAA,MAAM,SAAS,SAAS,GAAG;AACd,uBAAA,CAAC,SAAS,OAAO,CAAC;AAAA,MAAA;AAAA,IACnC,CACD;AAAA,EAAA,GACA,CAAC,YAAY,CAAC;AAEjB,YAAU,MAAM;AACd,QAAI,gBAAgB;AACZ,YAAA,OAAO,eAAe,WAAW;AAAA,QACrC;AAAA,QACA,SAAS,EAAE,aAAa,KAAK,OAAO,OAAO,iBAAiB;AAAA,MAAA,CAC7D;AACI,WAAA,KAAK,CAAC,SAAS;AACZ,cAAA,MAAM,IAAI,gBAAgB,IAAI;AACpC,oBAAY,GAAG;AACf,eAAO,UAAU;AAAA,SAChB,MAAM;AAET,aAAO,MAAM;AACX,YAAI,OAAO,SAAS;AACd,cAAA,gBAAgB,OAAO,OAAO;AAClC,iBAAO,UAAU;AAAA,QAAA,OACZ;AACL,eAAK,MAAM;AAAA,YACT,MAAM,aAAa;AAAA,YACnB,SAAS;AAAA,UAAA,CACV;AAAA,QAAA;AAAA,MAEL;AAAA,IAAA;AAAA,EACF,GACC,CAAC,WAAW,aAAa,KAAK,gBAAgB,WAAW,CAAC;AAE7D,QAAM,kBAAkB,MAAM;AAC5B,QAAI,OAAO,SAAS;AACd,UAAA,gBAAgB,OAAO,OAAO;AAClC,aAAO,UAAU;AAAA,IAAA;AAAA,EAErB;AAGE,SAAA,oBAAC,YACE,UACC,YAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,QAAQ;AAAA,MACP,GAAG;AAAA,MACJ,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,GAAI,SAAS,CAAA;AAAA,MAAC;AAAA,IAChB;AAAA,EAAA,GAGN;AAEJ;"}

package/dist/vue/components/render-layer.vue.d.ts

@@ -5,6 +5,5 @@ interface Props {
 }
 declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
     scaleFactor: number;
-    dpr: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/vue/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),r=require("@embedpdf/models"),n=require("@embedpdf/core/vue"),l=require("@embedpdf/plugin-render"),t=()=>n.useCapability(l.RenderPlugin.id),a=["src"],u=e.defineComponent({__name:"render-layer",props:{pageIndex:{},scaleFactor:{default:1},dpr:{default:1}},setup(n){const l=n,{provides:u}=t(),d=e.ref(null);let o=null,c=null;function i(){c&&!o&&c.abort({code:r.PdfErrorCode.Cancelled,message:"canceled render task"})}function s(){o&&(URL.revokeObjectURL(o),o=null)}return e.watch((()=>[l.pageIndex,l.scaleFactor,l.dpr,u.value]),(function(){if(i(),s(),d.value=null,c=null,!u.value)return;const e=u.value.renderPage({pageIndex:l.pageIndex,scaleFactor:l.scaleFactor,dpr:l.dpr});c=e,e.wait((e=>{o=URL.createObjectURL(e),d.value=o,c=null}),r.ignore)}),{immediate:!0}),e.onBeforeUnmount((()=>{i(),s()})),(r,n)=>d.value?(e.openBlock(),e.createElementBlock("img",{key:0,src:d.value,style:{width:"100%",height:"100%"},onLoad:s},null,40,a)):e.createCommentVNode("",!0)}});exports.RenderLayer=u,exports.useRenderCapability=t,exports.useRenderPlugin=()=>n.usePlugin(l.RenderPlugin.id);
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),r=require("@embedpdf/models"),n=require("@embedpdf/core/vue"),l=require("@embedpdf/plugin-render"),a=()=>n.usePlugin(l.RenderPlugin.id),t=()=>n.useCapability(l.RenderPlugin.id),d=["src"],o=e.defineComponent({__name:"render-layer",props:{pageIndex:{},scaleFactor:{default:1},dpr:{}},setup(n){const l=n,{provides:o}=t(),{plugin:u}=a(),i=e.ref(null),c=e.ref(0);let s=null,p=null;function g(){p&&!s&&p.abort({code:r.PdfErrorCode.Cancelled,message:"canceled render task"})}function m(){s&&(URL.revokeObjectURL(s),s=null)}return e.watch(u,((e,r,n)=>{if(e){n(e.onRefreshPages((e=>{e.includes(l.pageIndex)&&c.value++})))}}),{immediate:!0}),e.watch((()=>[l.pageIndex,l.scaleFactor,l.dpr,o.value,c.value]),(function(){if(g(),m(),i.value=null,p=null,!o.value)return;const e=o.value.renderPage({pageIndex:l.pageIndex,options:{scaleFactor:l.scaleFactor,dpr:l.dpr||window.devicePixelRatio}});p=e,e.wait((e=>{s=URL.createObjectURL(e),i.value=s,p=null}),r.ignore)}),{immediate:!0}),e.onBeforeUnmount((()=>{g(),m()})),(r,n)=>i.value?(e.openBlock(),e.createElementBlock("img",{key:0,src:i.value,style:{width:"100%",height:"100%"},onLoad:m},null,40,d)):e.createCommentVNode("",!0)}});exports.RenderLayer=o,exports.useRenderCapability=t,exports.useRenderPlugin=a;
 //# sourceMappingURL=index.cjs.map

package/dist/vue/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/vue/hooks/use-render.ts","../../src/vue/components/render-layer.vue"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","<script setup lang=\"ts\">\nimport { ref, watch, onBeforeUnmount } from 'vue';\nimport { ignore, PdfErrorCode, PdfErrorReason, Task } from '@embedpdf/models';\n\nimport { useRenderCapability } from '../hooks';\n\ninterface Props {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  scaleFactor: 1,\n  dpr: 1,\n});\n\nconst { provides: renderProvides } = useRenderCapability();\n\nconst imageUrl = ref<string | null>(null);\nlet currentBlobUrl: string | null = null;\nlet currentTask: Task<Blob, PdfErrorReason> | null = null; // Track current render task\n\n/* ------------------------------------------ */\n/* Helper function to abort current task */\n/* ------------------------------------------ */\nfunction abortCurrentTask() {\n  if (currentTask && !currentBlobUrl) {\n    currentTask.abort({\n      code: PdfErrorCode.Cancelled,\n      message: 'canceled render task',\n    });\n  }\n}\n\n/* ------------------------------------------ */\n/* render whenever pageIndex/scale/dpr change */\n/* ------------------------------------------ */\nfunction revoke() {\n  if (currentBlobUrl) {\n    URL.revokeObjectURL(currentBlobUrl);\n    currentBlobUrl = null;\n  }\n}\n\nfunction startRender() {\n  // Abort any existing task\n  abortCurrentTask();\n\n  revoke();\n  imageUrl.value = null;\n  currentTask = null;\n\n  if (!renderProvides.value) return;\n\n  const task = renderProvides.value.renderPage({\n    pageIndex: props.pageIndex,\n    scaleFactor: props.scaleFactor,\n    dpr: props.dpr,\n  });\n\n  currentTask = task;\n\n  task.wait((blob) => {\n    currentBlobUrl = URL.createObjectURL(blob);\n    imageUrl.value = currentBlobUrl;\n    currentTask = null; // Task completed\n  }, ignore);\n}\n\nwatch(() => [props.pageIndex, props.scaleFactor, props.dpr, renderProvides.value], startRender, {\n  immediate: true,\n});\n\n/* ------------------------------------------ */\nonBeforeUnmount(() => {\n  // Abort any pending task when component unmounts\n  abortCurrentTask();\n  revoke();\n});\n</script>\n\n<template>\n  <img v-if=\"imageUrl\" :src=\"imageUrl\" :style=\"{ width: '100%', height: '100%' }\" @load=\"revoke\" />\n</template>\n"],"names":["useRenderCapability","useCapability","RenderPlugin","id","props","__props","provides","renderProvides","imageUrl","ref","currentBlobUrl","currentTask","abortCurrentTask","abort","code","PdfErrorCode","Cancelled","message","revoke","URL","revokeObjectURL","watch","pageIndex","scaleFactor","dpr","value","task","renderPage","wait","blob","createObjectURL","ignore","immediate","onBeforeUnmount","_createElementBlock","src","style","width","height","onLoad","usePlugin"],"mappings":"0MAIaA,EAAsB,IAAMC,gBAA4BC,EAAAA,aAAaC,+HCQlF,MAAMC,EAAQC,GAKNC,SAAUC,GAAmBP,IAE/BQ,EAAWC,MAAmB,MACpC,IAAIC,EAAgC,KAChCC,EAAiD,KAKrD,SAASC,IACHD,IAAgBD,GAClBC,EAAYE,MAAM,CAChBC,KAAMC,EAAaA,aAAAC,UACnBC,QAAS,wBAEb,CAMF,SAASC,IACHR,IACFS,IAAIC,gBAAgBV,GACHA,EAAA,KACnB,QA4BIW,EAAAA,OAAA,IAAM,CAACjB,EAAMkB,UAAWlB,EAAMmB,YAAanB,EAAMoB,IAAKjB,EAAekB,SAzB3E,WAQM,GANab,IAEVM,IACPV,EAASiB,MAAQ,KACHd,EAAA,MAETJ,EAAekB,MAAO,OAErB,MAAAC,EAAOnB,EAAekB,MAAME,WAAW,CAC3CL,UAAWlB,EAAMkB,UACjBC,YAAanB,EAAMmB,YACnBC,IAAKpB,EAAMoB,MAGCb,EAAAe,EAETA,EAAAE,MAAMC,IACQnB,EAAAS,IAAIW,gBAAgBD,GACrCrB,EAASiB,MAAQf,EACHC,EAAA,IAAA,GACboB,SAAM,GAGqF,CAC9FC,WAAW,IAIbC,EAAAA,iBAAgB,KAEGrB,IACVM,GAAA,WAKIV,EAAQiB,qBAAnBS,EAAAA,mBAAiG,MAAA,OAA3EC,IAAK3B,EAAQiB,MAAGW,MAAO,CAAiCC,MAAA,OAAAC,OAAA,QAAGC,OAAMrB,0HDhF1D,IAAMsB,YAAwBtC,EAAAA,aAAaC"}
+{"version":3,"file":"index.cjs","sources":["../../src/vue/hooks/use-render.ts","../../src/vue/components/render-layer.vue"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","<script setup lang=\"ts\">\nimport { ref, watch, onBeforeUnmount } from 'vue';\nimport { ignore, PdfErrorCode, PdfErrorReason, Task } from '@embedpdf/models';\n\nimport { useRenderCapability, useRenderPlugin } from '../hooks';\n\ninterface Props {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  scaleFactor: 1,\n});\n\nconst { provides: renderProvides } = useRenderCapability();\nconst { plugin: renderPlugin } = useRenderPlugin();\n\nconst imageUrl = ref<string | null>(null);\nconst refreshTick = ref(0);\n\nlet currentBlobUrl: string | null = null;\nlet currentTask: Task<Blob, PdfErrorReason> | null = null;\n\n/* ------------------------------------------ */\n/* Helper function to abort current task */\n/* ------------------------------------------ */\nfunction abortCurrentTask() {\n  if (currentTask && !currentBlobUrl) {\n    currentTask.abort({\n      code: PdfErrorCode.Cancelled,\n      message: 'canceled render task',\n    });\n  }\n}\n\n/* ------------------------------------------ */\n/* render whenever pageIndex/scale/dpr/tick change */\n/* ------------------------------------------ */\nfunction revoke() {\n  if (currentBlobUrl) {\n    URL.revokeObjectURL(currentBlobUrl);\n    currentBlobUrl = null;\n  }\n}\n\nfunction startRender() {\n  abortCurrentTask();\n  revoke();\n  imageUrl.value = null;\n  currentTask = null;\n\n  if (!renderProvides.value) return;\n\n  const task = renderProvides.value.renderPage({\n    pageIndex: props.pageIndex,\n    options: {\n      scaleFactor: props.scaleFactor,\n      dpr: props.dpr || window.devicePixelRatio,\n    },\n  });\n\n  currentTask = task;\n\n  task.wait((blob) => {\n    currentBlobUrl = URL.createObjectURL(blob);\n    imageUrl.value = currentBlobUrl;\n    currentTask = null;\n  }, ignore);\n}\n\n// Watch for external refresh events\nwatch(\n  renderPlugin,\n  (pluginInstance, _, onCleanup) => {\n    if (pluginInstance) {\n      const unsubscribe = pluginInstance.onRefreshPages((pages: number[]) => {\n        if (pages.includes(props.pageIndex)) {\n          refreshTick.value++;\n        }\n      });\n      onCleanup(unsubscribe);\n    }\n  },\n  { immediate: true },\n);\n\n// Watch for changes that require a re-render\nwatch(\n  () => [props.pageIndex, props.scaleFactor, props.dpr, renderProvides.value, refreshTick.value],\n  startRender,\n  { immediate: true },\n);\n\n/* ------------------------------------------ */\nonBeforeUnmount(() => {\n  abortCurrentTask();\n  revoke();\n});\n</script>\n\n<template>\n  <img v-if=\"imageUrl\" :src=\"imageUrl\" :style=\"{ width: '100%', height: '100%' }\" @load=\"revoke\" />\n</template>\n"],"names":["useRenderPlugin","usePlugin","RenderPlugin","id","useRenderCapability","useCapability","props","__props","provides","renderProvides","plugin","renderPlugin","imageUrl","ref","refreshTick","currentBlobUrl","currentTask","abortCurrentTask","abort","code","PdfErrorCode","Cancelled","message","revoke","URL","revokeObjectURL","vue$1","watch","pluginInstance","_","onCleanup","onRefreshPages","pages","includes","pageIndex","value","immediate","scaleFactor","dpr","task","renderPage","options","window","devicePixelRatio","wait","blob","createObjectURL","ignore","onBeforeUnmount","_createElementBlock","src","style","width","height","onLoad"],"mappings":"0MAGaA,EAAkB,IAAMC,YAAwBC,EAAAA,aAAaC,IAC7DC,EAAsB,IAAMC,gBAA4BH,EAAAA,aAAaC,sHCQlF,MAAMG,EAAQC,GAINC,SAAUC,GAAmBL,KAC7BM,OAAQC,GAAiBX,IAE3BY,EAAWC,MAAmB,MAC9BC,EAAcD,MAAI,GAExB,IAAIE,EAAgC,KAChCC,EAAiD,KAKrD,SAASC,IACHD,IAAgBD,GAClBC,EAAYE,MAAM,CAChBC,KAAMC,EAAaA,aAAAC,UACnBC,QAAS,wBAEb,CAMF,SAASC,IACHR,IACFS,IAAIC,gBAAgBV,GACHA,EAAA,KACnB,QA6BFW,EAAAC,MACEhB,GACA,CAACiB,EAAgBC,EAAGC,KAClB,GAAIF,EAAgB,CAMlBE,EALoBF,EAAeG,gBAAgBC,IAC7CA,EAAMC,SAAS3B,EAAM4B,YACXpB,EAAAqB,OAAA,IAGK,IAGzB,CAAEC,WAAW,IAIfV,EAAAC,OACE,IAAM,CAACrB,EAAM4B,UAAW5B,EAAM+B,YAAa/B,EAAMgC,IAAK7B,EAAe0B,MAAOrB,EAAYqB,SA3C1F,WAMM,GALalB,IACVM,IACPX,EAASuB,MAAQ,KACHnB,EAAA,MAETP,EAAe0B,MAAO,OAErB,MAAAI,EAAO9B,EAAe0B,MAAMK,WAAW,CAC3CN,UAAW5B,EAAM4B,UACjBO,QAAS,CACPJ,YAAa/B,EAAM+B,YACnBC,IAAKhC,EAAMgC,KAAOI,OAAOC,oBAIf3B,EAAAuB,EAETA,EAAAK,MAAMC,IACQ9B,EAAAS,IAAIsB,gBAAgBD,GACrCjC,EAASuB,MAAQpB,EACHC,EAAA,IAAA,GACb+B,SAAM,GAuBT,CAAEX,WAAW,IAIfY,EAAAA,iBAAgB,KACG/B,IACVM,GAAA,WAKIX,EAAQuB,qBAAnBc,EAAAA,mBAAiG,MAAA,OAA3EC,IAAKtC,EAAQuB,MAAGgB,MAAO,CAAiCC,MAAA,OAAAC,OAAA,QAAGC,OAAM/B"}

package/dist/vue/index.js

@@ -10,12 +10,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   props: {
     pageIndex: {},
     scaleFactor: { default: 1 },
-    dpr: { default: 1 }
+    dpr: {}
   },
   setup(__props) {
     const props = __props;
     const { provides: renderProvides } = useRenderCapability();
+    const { plugin: renderPlugin } = useRenderPlugin();
     const imageUrl = ref(null);
+    const refreshTick = ref(0);
     let currentBlobUrl = null;
     let currentTask = null;
     function abortCurrentTask() {
@@ -40,8 +42,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (!renderProvides.value) return;
       const task = renderProvides.value.renderPage({
         pageIndex: props.pageIndex,
-        scaleFactor: props.scaleFactor,
-        dpr: props.dpr
+        options: {
+          scaleFactor: props.scaleFactor,
+          dpr: props.dpr || window.devicePixelRatio
+        }
       });
       currentTask = task;
       task.wait((blob) => {
@@ -50,9 +54,25 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         currentTask = null;
       }, ignore);
     }
-    watch(() => [props.pageIndex, props.scaleFactor, props.dpr, renderProvides.value], startRender, {
-      immediate: true
-    });
+    watch(
+      renderPlugin,
+      (pluginInstance, _, onCleanup) => {
+        if (pluginInstance) {
+          const unsubscribe = pluginInstance.onRefreshPages((pages) => {
+            if (pages.includes(props.pageIndex)) {
+              refreshTick.value++;
+            }
+          });
+          onCleanup(unsubscribe);
+        }
+      },
+      { immediate: true }
+    );
+    watch(
+      () => [props.pageIndex, props.scaleFactor, props.dpr, renderProvides.value, refreshTick.value],
+      startRender,
+      { immediate: true }
+    );
     onBeforeUnmount(() => {
       abortCurrentTask();
       revoke();

package/dist/vue/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/vue/hooks/use-render.ts","../../src/vue/components/render-layer.vue"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","<script setup lang=\"ts\">\nimport { ref, watch, onBeforeUnmount } from 'vue';\nimport { ignore, PdfErrorCode, PdfErrorReason, Task } from '@embedpdf/models';\n\nimport { useRenderCapability } from '../hooks';\n\ninterface Props {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  scaleFactor: 1,\n  dpr: 1,\n});\n\nconst { provides: renderProvides } = useRenderCapability();\n\nconst imageUrl = ref<string | null>(null);\nlet currentBlobUrl: string | null = null;\nlet currentTask: Task<Blob, PdfErrorReason> | null = null; // Track current render task\n\n/* ------------------------------------------ */\n/* Helper function to abort current task */\n/* ------------------------------------------ */\nfunction abortCurrentTask() {\n  if (currentTask && !currentBlobUrl) {\n    currentTask.abort({\n      code: PdfErrorCode.Cancelled,\n      message: 'canceled render task',\n    });\n  }\n}\n\n/* ------------------------------------------ */\n/* render whenever pageIndex/scale/dpr change */\n/* ------------------------------------------ */\nfunction revoke() {\n  if (currentBlobUrl) {\n    URL.revokeObjectURL(currentBlobUrl);\n    currentBlobUrl = null;\n  }\n}\n\nfunction startRender() {\n  // Abort any existing task\n  abortCurrentTask();\n\n  revoke();\n  imageUrl.value = null;\n  currentTask = null;\n\n  if (!renderProvides.value) return;\n\n  const task = renderProvides.value.renderPage({\n    pageIndex: props.pageIndex,\n    scaleFactor: props.scaleFactor,\n    dpr: props.dpr,\n  });\n\n  currentTask = task;\n\n  task.wait((blob) => {\n    currentBlobUrl = URL.createObjectURL(blob);\n    imageUrl.value = currentBlobUrl;\n    currentTask = null; // Task completed\n  }, ignore);\n}\n\nwatch(() => [props.pageIndex, props.scaleFactor, props.dpr, renderProvides.value], startRender, {\n  immediate: true,\n});\n\n/* ------------------------------------------ */\nonBeforeUnmount(() => {\n  // Abort any pending task when component unmounts\n  abortCurrentTask();\n  revoke();\n});\n</script>\n\n<template>\n  <img v-if=\"imageUrl\" :src=\"imageUrl\" :style=\"{ width: '100%', height: '100%' }\" @load=\"revoke\" />\n</template>\n"],"names":["_createElementBlock"],"mappings":";;;;AAGO,MAAM,kBAAkB,MAAM,UAAwB,aAAa,EAAE;AACrE,MAAM,sBAAsB,MAAM,cAA4B,aAAa,EAAE;;;;;;;;;;ACQpF,UAAM,QAAQ;AAKd,UAAM,EAAE,UAAU,eAAe,IAAI,oBAAoB;AAEnD,UAAA,WAAW,IAAmB,IAAI;AACxC,QAAI,iBAAgC;AACpC,QAAI,cAAiD;AAKrD,aAAS,mBAAmB;AACtB,UAAA,eAAe,CAAC,gBAAgB;AAClC,oBAAY,MAAM;AAAA,UAChB,MAAM,aAAa;AAAA,UACnB,SAAS;AAAA,QAAA,CACV;AAAA,MAAA;AAAA,IACH;AAMF,aAAS,SAAS;AAChB,UAAI,gBAAgB;AAClB,YAAI,gBAAgB,cAAc;AACjB,yBAAA;AAAA,MAAA;AAAA,IACnB;AAGF,aAAS,cAAc;AAEJ,uBAAA;AAEV,aAAA;AACP,eAAS,QAAQ;AACH,oBAAA;AAEV,UAAA,CAAC,eAAe,MAAO;AAErB,YAAA,OAAO,eAAe,MAAM,WAAW;AAAA,QAC3C,WAAW,MAAM;AAAA,QACjB,aAAa,MAAM;AAAA,QACnB,KAAK,MAAM;AAAA,MAAA,CACZ;AAEa,oBAAA;AAET,WAAA,KAAK,CAAC,SAAS;AACD,yBAAA,IAAI,gBAAgB,IAAI;AACzC,iBAAS,QAAQ;AACH,sBAAA;AAAA,SACb,MAAM;AAAA,IAAA;AAGL,UAAA,MAAM,CAAC,MAAM,WAAW,MAAM,aAAa,MAAM,KAAK,eAAe,KAAK,GAAG,aAAa;AAAA,MAC9F,WAAW;AAAA,IAAA,CACZ;AAGD,oBAAgB,MAAM;AAEH,uBAAA;AACV,aAAA;AAAA,IAAA,CACR;;aAIY,SAAQ,sBAAnBA,mBAAiG,OAAA;AAAA;QAA3E,KAAK,SAAQ;AAAA,QAAG,OAAO,EAAiC,OAAA,QAAA,QAAA,OAAA;AAAA,QAAG,QAAM;AAAA,MAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../src/vue/hooks/use-render.ts","../../src/vue/components/render-layer.vue"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/vue';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","<script setup lang=\"ts\">\nimport { ref, watch, onBeforeUnmount } from 'vue';\nimport { ignore, PdfErrorCode, PdfErrorReason, Task } from '@embedpdf/models';\n\nimport { useRenderCapability, useRenderPlugin } from '../hooks';\n\ninterface Props {\n  pageIndex: number;\n  scaleFactor?: number;\n  dpr?: number;\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  scaleFactor: 1,\n});\n\nconst { provides: renderProvides } = useRenderCapability();\nconst { plugin: renderPlugin } = useRenderPlugin();\n\nconst imageUrl = ref<string | null>(null);\nconst refreshTick = ref(0);\n\nlet currentBlobUrl: string | null = null;\nlet currentTask: Task<Blob, PdfErrorReason> | null = null;\n\n/* ------------------------------------------ */\n/* Helper function to abort current task */\n/* ------------------------------------------ */\nfunction abortCurrentTask() {\n  if (currentTask && !currentBlobUrl) {\n    currentTask.abort({\n      code: PdfErrorCode.Cancelled,\n      message: 'canceled render task',\n    });\n  }\n}\n\n/* ------------------------------------------ */\n/* render whenever pageIndex/scale/dpr/tick change */\n/* ------------------------------------------ */\nfunction revoke() {\n  if (currentBlobUrl) {\n    URL.revokeObjectURL(currentBlobUrl);\n    currentBlobUrl = null;\n  }\n}\n\nfunction startRender() {\n  abortCurrentTask();\n  revoke();\n  imageUrl.value = null;\n  currentTask = null;\n\n  if (!renderProvides.value) return;\n\n  const task = renderProvides.value.renderPage({\n    pageIndex: props.pageIndex,\n    options: {\n      scaleFactor: props.scaleFactor,\n      dpr: props.dpr || window.devicePixelRatio,\n    },\n  });\n\n  currentTask = task;\n\n  task.wait((blob) => {\n    currentBlobUrl = URL.createObjectURL(blob);\n    imageUrl.value = currentBlobUrl;\n    currentTask = null;\n  }, ignore);\n}\n\n// Watch for external refresh events\nwatch(\n  renderPlugin,\n  (pluginInstance, _, onCleanup) => {\n    if (pluginInstance) {\n      const unsubscribe = pluginInstance.onRefreshPages((pages: number[]) => {\n        if (pages.includes(props.pageIndex)) {\n          refreshTick.value++;\n        }\n      });\n      onCleanup(unsubscribe);\n    }\n  },\n  { immediate: true },\n);\n\n// Watch for changes that require a re-render\nwatch(\n  () => [props.pageIndex, props.scaleFactor, props.dpr, renderProvides.value, refreshTick.value],\n  startRender,\n  { immediate: true },\n);\n\n/* ------------------------------------------ */\nonBeforeUnmount(() => {\n  abortCurrentTask();\n  revoke();\n});\n</script>\n\n<template>\n  <img v-if=\"imageUrl\" :src=\"imageUrl\" :style=\"{ width: '100%', height: '100%' }\" @load=\"revoke\" />\n</template>\n"],"names":["_createElementBlock"],"mappings":";;;;AAGO,MAAM,kBAAkB,MAAM,UAAwB,aAAa,EAAE;AACrE,MAAM,sBAAsB,MAAM,cAA4B,aAAa,EAAE;;;;;;;;;;ACQpF,UAAM,QAAQ;AAId,UAAM,EAAE,UAAU,eAAe,IAAI,oBAAoB;AACzD,UAAM,EAAE,QAAQ,aAAa,IAAI,gBAAgB;AAE3C,UAAA,WAAW,IAAmB,IAAI;AAClC,UAAA,cAAc,IAAI,CAAC;AAEzB,QAAI,iBAAgC;AACpC,QAAI,cAAiD;AAKrD,aAAS,mBAAmB;AACtB,UAAA,eAAe,CAAC,gBAAgB;AAClC,oBAAY,MAAM;AAAA,UAChB,MAAM,aAAa;AAAA,UACnB,SAAS;AAAA,QAAA,CACV;AAAA,MAAA;AAAA,IACH;AAMF,aAAS,SAAS;AAChB,UAAI,gBAAgB;AAClB,YAAI,gBAAgB,cAAc;AACjB,yBAAA;AAAA,MAAA;AAAA,IACnB;AAGF,aAAS,cAAc;AACJ,uBAAA;AACV,aAAA;AACP,eAAS,QAAQ;AACH,oBAAA;AAEV,UAAA,CAAC,eAAe,MAAO;AAErB,YAAA,OAAO,eAAe,MAAM,WAAW;AAAA,QAC3C,WAAW,MAAM;AAAA,QACjB,SAAS;AAAA,UACP,aAAa,MAAM;AAAA,UACnB,KAAK,MAAM,OAAO,OAAO;AAAA,QAAA;AAAA,MAC3B,CACD;AAEa,oBAAA;AAET,WAAA,KAAK,CAAC,SAAS;AACD,yBAAA,IAAI,gBAAgB,IAAI;AACzC,iBAAS,QAAQ;AACH,sBAAA;AAAA,SACb,MAAM;AAAA,IAAA;AAIX;AAAA,MACE;AAAA,MACA,CAAC,gBAAgB,GAAG,cAAc;AAChC,YAAI,gBAAgB;AAClB,gBAAM,cAAc,eAAe,eAAe,CAAC,UAAoB;AACrE,gBAAI,MAAM,SAAS,MAAM,SAAS,GAAG;AACvB,0BAAA;AAAA,YAAA;AAAA,UACd,CACD;AACD,oBAAU,WAAW;AAAA,QAAA;AAAA,MAEzB;AAAA,MACA,EAAE,WAAW,KAAK;AAAA,IACpB;AAGA;AAAA,MACE,MAAM,CAAC,MAAM,WAAW,MAAM,aAAa,MAAM,KAAK,eAAe,OAAO,YAAY,KAAK;AAAA,MAC7F;AAAA,MACA,EAAE,WAAW,KAAK;AAAA,IACpB;AAGA,oBAAgB,MAAM;AACH,uBAAA;AACV,aAAA;AAAA,IAAA,CACR;;aAIY,SAAQ,sBAAnBA,mBAAiG,OAAA;AAAA;QAA3E,KAAK,SAAQ;AAAA,QAAG,OAAO,EAAiC,OAAA,QAAA,QAAA,OAAA;AAAA,QAAG,QAAM;AAAA,MAAA;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@embedpdf/plugin-render",
-  "version": "1.0.17",
+  "version": "1.0.19",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -28,20 +28,20 @@
     }
   },
   "dependencies": {
-    "@embedpdf/models": "1.0.17"
+    "@embedpdf/models": "1.0.19"
   },
   "devDependencies": {
     "@types/react": "^18.2.0",
     "typescript": "^5.0.0",
-    "@embedpdf/core": "1.0.17",
-    "@embedpdf/build": "1.0.0"
+    "@embedpdf/build": "1.0.0",
+    "@embedpdf/core": "1.0.19"
   },
   "peerDependencies": {
     "preact": "^10.26.4",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "vue": ">=3.2.0",
-    "@embedpdf/core": "1.0.17"
+    "@embedpdf/core": "1.0.19"
   },
   "files": [
     "dist",