@embedpdf/plugin-render 1.0.25 → 1.1.0

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"),o=()=>u.usePlugin(c.RenderPlugin.id),s=()=>u.useCapability(c.RenderPlugin.id);exports.RenderLayer=function({pageIndex:u,scaleFactor:c=1,dpr:i,style:d,...a}){const{provides:l}=s(),{plugin:p}=o(),[g,f]=t.useState(null),b=t.useRef(null),[R,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:c,dpr:i||window.devicePixelRatio}});return e.wait((e=>{const r=URL.createObjectURL(e);f(r),b.current=r}),n.ignore),()=>{b.current?(URL.revokeObjectURL(b.current),b.current=null):e.abort({code:n.PdfErrorCode.Cancelled,message:"canceled render task"})}}}),[u,c,i,l,R]),e.jsx(r.Fragment,{children:g&&e.jsx("img",{src:g,onLoad:()=>{b.current&&(URL.revokeObjectURL(b.current),b.current=null)},...a,style:{width:"100%",height:"100%",...d||{}}})})},exports.useRenderCapability=s,exports.useRenderPlugin=o,Object.keys(c).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>c[e]})}));
+"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"),c=require("@embedpdf/core/preact"),u=require("@embedpdf/plugin-render"),s=()=>c.usePlugin(u.RenderPlugin.id),o=()=>c.useCapability(u.RenderPlugin.id);exports.RenderLayer=function({pageIndex:c,scale:u,scaleFactor:i,dpr:a,style:d,...l}){const{provides:p}=o(),{plugin:g}=s(),f=u??i??1,[b,R]=t.useState(null),x=t.useRef(null),[y,P]=t.useState(0);return t.useEffect((()=>{if(g)return g.onRefreshPages((e=>{e.includes(c)&&P((e=>e+1))}))}),[g]),t.useEffect((()=>{if(p){const e=p.renderPage({pageIndex:c,options:{scaleFactor:f,dpr:a||window.devicePixelRatio}});return e.wait((e=>{const r=URL.createObjectURL(e);R(r),x.current=r}),n.ignore),()=>{x.current?(URL.revokeObjectURL(x.current),x.current=null):e.abort({code:n.PdfErrorCode.Cancelled,message:"canceled render task"})}}}),[c,f,a,p,y]),e.jsx(r.Fragment,{children:b&&e.jsx("img",{src:b,onLoad:()=>{x.current&&(URL.revokeObjectURL(x.current),x.current=null)},...l,style:{width:"100%",height:"100%",...d||{}}})})},exports.useRenderCapability=o,exports.useRenderPlugin=s,Object.keys(u).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>u[e]})}));
 //# 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, 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"}
+{"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  /**\n   * The scale factor for rendering the page.\n   */\n  scale?: number;\n  /**\n   * @deprecated Use `scale` instead. Will be removed in the next major release.\n   */\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scale,\n  scaleFactor,\n  dpr,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const { plugin: renderPlugin } = useRenderPlugin();\n\n  // Handle deprecation: prefer scale over scaleFactor, but fall back to scaleFactor if scale is not provided\n  const actualScale = scale ?? scaleFactor ?? 1;\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: actualScale, 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, actualScale, 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","scale","scaleFactor","dpr","style","props","provides","renderProvides","plugin","renderPlugin","actualScale","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,wBCiB3E,UAAqBG,UAC1BA,EAAAC,MACAA,EAAAC,YACAA,EAAAC,IACAA,EAAAC,MACAA,KACGC,IAEH,MAAQC,SAAUC,GAAmBT,KAC7BU,OAAQC,GAAiBf,IAG3BgB,EAAcT,GAASC,GAAe,GAErCS,EAAUC,GAAeC,EAAAA,SAAwB,MAClDC,EAASC,SAAsB,OAC9BC,EAAaC,GAAkBJ,EAAAA,SAAS,GA6C7C,OA3CFK,EAAAA,WAAU,KACR,GAAKT,EACE,OAAAA,EAAaU,gBAAgBC,IAC9BA,EAAMC,SAASrB,IACFiB,GAACK,GAASA,EAAO,GAAC,GAEpC,GACA,CAACb,IAEJS,EAAAA,WAAU,KACR,GAAIX,EAAgB,CACZ,MAAAgB,EAAOhB,EAAeiB,WAAW,CACrCxB,YACAyB,QAAS,CAAEvB,YAAaQ,EAAaP,IAAKA,GAAOuB,OAAOC,oBAQ1D,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,CAACxC,EAAWU,EAAaP,EAAKI,EAAgBS,MAU/CyB,IAACC,YACEC,SACChC,GAAAiC,EAAAH,IAAC,MAAA,CACCI,IAAKlC,EACLmC,OAZgB,KAClBhC,EAAOmB,UACLF,IAAAI,gBAAgBrB,EAAOmB,SAC3BnB,EAAOmB,QAAU,KAAA,KAUT5B,EACJD,MAAO,CACL2C,MAAO,OACPC,OAAQ,UACJ5C,GAAS,CAAA,MAMzB"}

package/dist/preact/index.js

@@ -9,13 +9,15 @@ const useRenderPlugin = () => usePlugin(RenderPlugin.id);
 const useRenderCapability = () => useCapability(RenderPlugin.id);
 function RenderLayer({
   pageIndex,
-  scaleFactor = 1,
+  scale,
+  scaleFactor,
   dpr,
   style,
   ...props
 }) {
   const { provides: renderProvides } = useRenderCapability();
   const { plugin: renderPlugin } = useRenderPlugin();
+  const actualScale = scale ?? scaleFactor ?? 1;
   const [imageUrl, setImageUrl] = useState(null);
   const urlRef = useRef(null);
   const [refreshTick, setRefreshTick] = useState(0);
@@ -31,7 +33,7 @@ function RenderLayer({
     if (renderProvides) {
       const task = renderProvides.renderPage({
         pageIndex,
-        options: { scaleFactor, dpr: dpr || window.devicePixelRatio }
+        options: { scaleFactor: actualScale, dpr: dpr || window.devicePixelRatio }
       });
       task.wait((blob) => {
         const url = URL.createObjectURL(blob);
@@ -50,7 +52,7 @@ function RenderLayer({
         }
       };
     }
-  }, [pageIndex, scaleFactor, dpr, renderProvides, refreshTick]);
+  }, [pageIndex, actualScale, 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, 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;"}
+{"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  /**\n   * The scale factor for rendering the page.\n   */\n  scale?: number;\n  /**\n   * @deprecated Use `scale` instead. Will be removed in the next major release.\n   */\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scale,\n  scaleFactor,\n  dpr,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const { plugin: renderPlugin } = useRenderPlugin();\n\n  // Handle deprecation: prefer scale over scaleFactor, but fall back to scaleFactor if scale is not provided\n  const actualScale = scale ?? scaleFactor ?? 1;\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: actualScale, 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, actualScale, 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;ACiB7E,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,EAAE,UAAU,eAAe,IAAI,oBAAoB;AACzD,QAAM,EAAE,QAAQ,aAAa,IAAI,gBAAgB;AAG3C,QAAA,cAAc,SAAS,eAAe;AAE5C,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,aAAa,KAAK,OAAO,OAAO,iBAAiB;AAAA,MAAA,CAC1E;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.usePlugin(u.RenderPlugin.id),s=()=>n.useCapability(u.RenderPlugin.id);exports.RenderLayer=function({pageIndex:n,scaleFactor:u=1,dpr:o,style:i,...d}){const{provides:a}=s(),{plugin:l}=c(),[p,g]=r.useState(null),f=r.useRef(null),[b,R]=r.useState(0);return r.useEffect((()=>{if(l)return l.onRefreshPages((e=>{e.includes(n)&&R((e=>e+1))}))}),[l]),r.useEffect((()=>{if(a){const e=a.renderPage({pageIndex:n,options:{scaleFactor:u,dpr:o||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,o,a,b]),e.jsx(r.Fragment,{children:p&&e.jsx("img",{src:p,onLoad:()=>{f.current&&(URL.revokeObjectURL(f.current),f.current=null)},...d,style:{width:"100%",height:"100%",...i||{}}})})},exports.useRenderCapability=s,exports.useRenderPlugin=c,Object.keys(u).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>u[e]})}));
+"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"),c=require("@embedpdf/plugin-render"),u=()=>n.usePlugin(c.RenderPlugin.id),s=()=>n.useCapability(c.RenderPlugin.id);exports.RenderLayer=function({pageIndex:n,scale:c,scaleFactor:o,dpr:i,style:d,...a}){const{provides:l}=s(),{plugin:p}=u(),g=c??o??1,[f,b]=r.useState(null),R=r.useRef(null),[x,y]=r.useState(0);return r.useEffect((()=>{if(p)return p.onRefreshPages((e=>{e.includes(n)&&y((e=>e+1))}))}),[p]),r.useEffect((()=>{if(l){const e=l.renderPage({pageIndex:n,options:{scaleFactor:g,dpr:i||window.devicePixelRatio}});return e.wait((e=>{const r=URL.createObjectURL(e);b(r),R.current=r}),t.ignore),()=>{R.current?(URL.revokeObjectURL(R.current),R.current=null):e.abort({code:t.PdfErrorCode.Cancelled,message:"canceled render task"})}}}),[n,g,i,l,x]),e.jsx(r.Fragment,{children:f&&e.jsx("img",{src:f,onLoad:()=>{R.current&&(URL.revokeObjectURL(R.current),R.current=null)},...a,style:{width:"100%",height:"100%",...d||{}}})})},exports.useRenderCapability=s,exports.useRenderPlugin=u,Object.keys(c).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>c[e]})}));
 //# 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, 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"}
+{"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  /**\n   * The scale factor for rendering the page.\n   */\n  scale?: number;\n  /**\n   * @deprecated Use `scale` instead. Will be removed in the next major release.\n   */\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scale,\n  scaleFactor,\n  dpr,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const { plugin: renderPlugin } = useRenderPlugin();\n\n  // Handle deprecation: prefer scale over scaleFactor, but fall back to scaleFactor if scale is not provided\n  const actualScale = scale ?? scaleFactor ?? 1;\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: actualScale, 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, actualScale, 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","scale","scaleFactor","dpr","style","props","provides","renderProvides","plugin","renderPlugin","actualScale","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,wBCiB3E,UAAqBG,UAC1BA,EAAAC,MACAA,EAAAC,YACAA,EAAAC,IACAA,EAAAC,MACAA,KACGC,IAEH,MAAQC,SAAUC,GAAmBT,KAC7BU,OAAQC,GAAiBf,IAG3BgB,EAAcT,GAASC,GAAe,GAErCS,EAAUC,GAAeC,EAAAA,SAAwB,MAClDC,EAASC,SAAsB,OAC9BC,EAAaC,GAAkBJ,EAAAA,SAAS,GA6C7C,OA3CFK,EAAAA,WAAU,KACR,GAAKT,EACE,OAAAA,EAAaU,gBAAgBC,IAC9BA,EAAMC,SAASrB,IACFiB,GAACK,GAASA,EAAO,GAAC,GAEpC,GACA,CAACb,IAEJS,EAAAA,WAAU,KACR,GAAIX,EAAgB,CACZ,MAAAgB,EAAOhB,EAAeiB,WAAW,CACrCxB,YACAyB,QAAS,CAAEvB,YAAaQ,EAAaP,IAAKA,GAAOuB,OAAOC,oBAQ1D,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,CAACxC,EAAWU,EAAaP,EAAKI,EAAgBS,MAU/CyB,IAACC,YACEC,SACChC,GAAAiC,EAAAH,IAAC,MAAA,CACCI,IAAKlC,EACLmC,OAZgB,KAClBhC,EAAOmB,UACLF,IAAAI,gBAAgBrB,EAAOmB,SAC3BnB,EAAOmB,QAAU,KAAA,KAUT5B,EACJD,MAAO,CACL2C,MAAO,OACPC,OAAQ,UACJ5C,GAAS,CAAA,MAMzB"}

package/dist/react/index.js

@@ -8,13 +8,15 @@ const useRenderPlugin = () => usePlugin(RenderPlugin.id);
 const useRenderCapability = () => useCapability(RenderPlugin.id);
 function RenderLayer({
   pageIndex,
-  scaleFactor = 1,
+  scale,
+  scaleFactor,
   dpr,
   style,
   ...props
 }) {
   const { provides: renderProvides } = useRenderCapability();
   const { plugin: renderPlugin } = useRenderPlugin();
+  const actualScale = scale ?? scaleFactor ?? 1;
   const [imageUrl, setImageUrl] = useState(null);
   const urlRef = useRef(null);
   const [refreshTick, setRefreshTick] = useState(0);
@@ -30,7 +32,7 @@ function RenderLayer({
     if (renderProvides) {
       const task = renderProvides.renderPage({
         pageIndex,
-        options: { scaleFactor, dpr: dpr || window.devicePixelRatio }
+        options: { scaleFactor: actualScale, dpr: dpr || window.devicePixelRatio }
       });
       task.wait((blob) => {
         const url = URL.createObjectURL(blob);
@@ -49,7 +51,7 @@ function RenderLayer({
         }
       };
     }
-  }, [pageIndex, scaleFactor, dpr, renderProvides, refreshTick]);
+  }, [pageIndex, actualScale, 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, 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;"}
+{"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  /**\n   * The scale factor for rendering the page.\n   */\n  scale?: number;\n  /**\n   * @deprecated Use `scale` instead. Will be removed in the next major release.\n   */\n  scaleFactor?: number;\n  dpr?: number;\n  style?: CSSProperties;\n};\n\nexport function RenderLayer({\n  pageIndex,\n  scale,\n  scaleFactor,\n  dpr,\n  style,\n  ...props\n}: RenderLayerProps) {\n  const { provides: renderProvides } = useRenderCapability();\n  const { plugin: renderPlugin } = useRenderPlugin();\n\n  // Handle deprecation: prefer scale over scaleFactor, but fall back to scaleFactor if scale is not provided\n  const actualScale = scale ?? scaleFactor ?? 1;\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: actualScale, 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, actualScale, 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;ACiB7E,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,EAAE,UAAU,eAAe,IAAI,oBAAoB;AACzD,QAAM,EAAE,QAAQ,aAAa,IAAI,gBAAgB;AAG3C,QAAA,cAAc,SAAS,eAAe;AAE5C,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,aAAa,KAAK,OAAO,OAAO,iBAAiB;AAAA,MAAA,CAC1E;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/shared-preact/components/render-layer.d.ts

@@ -1,9 +1,16 @@
 import { CSSProperties, HTMLAttributes } from '../../preact/adapter.ts';
 type RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {
     pageIndex: number;
+    /**
+     * The scale factor for rendering the page.
+     */
+    scale?: number;
+    /**
+     * @deprecated Use `scale` instead. Will be removed in the next major release.
+     */
     scaleFactor?: number;
     dpr?: number;
     style?: CSSProperties;
 };
-export declare function RenderLayer({ pageIndex, scaleFactor, dpr, style, ...props }: RenderLayerProps): import("preact").JSX.Element;
+export declare function RenderLayer({ pageIndex, scale, scaleFactor, dpr, style, ...props }: RenderLayerProps): import("preact").JSX.Element;
 export {};

package/dist/shared-react/components/render-layer.d.ts

@@ -1,9 +1,16 @@
 import { CSSProperties, HTMLAttributes } from '../../react/adapter.ts';
 type RenderLayerProps = Omit<HTMLAttributes<HTMLImageElement>, 'style'> & {
     pageIndex: number;
+    /**
+     * The scale factor for rendering the page.
+     */
+    scale?: number;
+    /**
+     * @deprecated Use `scale` instead. Will be removed in the next major release.
+     */
     scaleFactor?: number;
     dpr?: number;
     style?: CSSProperties;
 };
-export declare function RenderLayer({ pageIndex, scaleFactor, dpr, style, ...props }: RenderLayerProps): import("react/jsx-runtime").JSX.Element;
+export declare function RenderLayer({ pageIndex, scale, scaleFactor, dpr, style, ...props }: RenderLayerProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,9 +1,14 @@
 interface Props {
     pageIndex: number;
+    /**
+     * The scale factor for rendering the page.
+     */
+    scale?: number;
+    /**
+     * @deprecated Use `scale` instead. Will be removed in the next major release.
+     */
     scaleFactor?: number;
     dpr?: number;
 }
-declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
-    scaleFactor: number;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, 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"),t=require("@embedpdf/plugin-render"),l=()=>n.usePlugin(t.RenderPlugin.id),a=()=>n.useCapability(t.RenderPlugin.id),o=["src"],d=e.defineComponent({__name:"render-layer",props:{pageIndex:{},scaleFactor:{default:1},dpr:{}},setup(n){const t=n,{provides:d}=a(),{plugin:u}=l(),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 f(){s&&(URL.revokeObjectURL(s),s=null)}return e.watch(u,((e,r,n)=>{if(e){n(e.onRefreshPages((e=>{e.includes(t.pageIndex)&&c.value++})))}}),{immediate:!0}),e.watch((()=>[t.pageIndex,t.scaleFactor,t.dpr,d.value,c.value]),(function(){if(g(),f(),p=null,!d.value)return;const e=d.value.renderPage({pageIndex:t.pageIndex,options:{scaleFactor:t.scaleFactor,dpr:t.dpr||window.devicePixelRatio}});p=e,e.wait((e=>{s=URL.createObjectURL(e),i.value=s,p=null}),r.ignore)}),{immediate:!0}),e.onBeforeUnmount((()=>{g(),f()})),(r,n)=>i.value?(e.openBlock(),e.createElementBlock("img",{key:0,src:i.value,style:{width:"100%",height:"100%"},onLoad:f},null,40,o)):e.createCommentVNode("",!0)}});exports.RenderLayer=d,exports.useRenderCapability=a,exports.useRenderPlugin=l,Object.keys(t).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})}));
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),r=require("@embedpdf/models"),n=require("@embedpdf/core/vue"),t=require("@embedpdf/plugin-render"),l=()=>n.usePlugin(t.RenderPlugin.id),a=()=>n.useCapability(t.RenderPlugin.id),o=["src"],d=e.defineComponent({__name:"render-layer",props:{pageIndex:{},scale:{},scaleFactor:{},dpr:{}},setup(n){const t=n,d=e.computed((()=>t.scale??t.scaleFactor??1)),{provides:u}=a(),{plugin:i}=l(),c=e.ref(null),s=e.ref(0);let p=null,g=null;function m(){g&&!p&&g.abort({code:r.PdfErrorCode.Cancelled,message:"canceled render task"})}function f(){p&&(URL.revokeObjectURL(p),p=null)}return e.watch(i,((e,r,n)=>{if(e){n(e.onRefreshPages((e=>{e.includes(t.pageIndex)&&s.value++})))}}),{immediate:!0}),e.watch((()=>[t.pageIndex,d.value,t.dpr,u.value,s.value]),(function(){if(m(),f(),g=null,!u.value)return;const e=u.value.renderPage({pageIndex:t.pageIndex,options:{scaleFactor:d.value,dpr:t.dpr||window.devicePixelRatio}});g=e,e.wait((e=>{p=URL.createObjectURL(e),c.value=p,g=null}),r.ignore)}),{immediate:!0}),e.onBeforeUnmount((()=>{m(),f()})),(r,n)=>c.value?(e.openBlock(),e.createElementBlock("img",{key:0,src:c.value,style:{width:"100%",height:"100%"},onLoad:f},null,40,o)):e.createCommentVNode("",!0)}});exports.RenderLayer=d,exports.useRenderCapability=a,exports.useRenderPlugin=l,Object.keys(t).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})}));
 //# 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, 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  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,QA4BFW,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,SA1C1F,WAKM,GAJalB,IACVM,IACOP,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"}
+{"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, computed } from 'vue';\nimport { ignore, PdfErrorCode, PdfErrorReason, Task } from '@embedpdf/models';\n\nimport { useRenderCapability, useRenderPlugin } from '../hooks';\n\ninterface Props {\n  pageIndex: number;\n  /**\n   * The scale factor for rendering the page.\n   */\n  scale?: number;\n  /**\n   * @deprecated Use `scale` instead. Will be removed in the next major release.\n   */\n  scaleFactor?: number;\n  dpr?: number;\n}\n\nconst props = defineProps<Props>();\n\n// Handle deprecation: prefer scale over scaleFactor, but fall back to scaleFactor if scale is not provided\nconst actualScale = computed(() => props.scale ?? props.scaleFactor ?? 1);\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  currentTask = null;\n\n  if (!renderProvides.value) return;\n\n  const task = renderProvides.value.renderPage({\n    pageIndex: props.pageIndex,\n    options: {\n      scaleFactor: actualScale.value,\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, actualScale.value, 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","actualScale","computed","scale","scaleFactor","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","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,sHCelF,MAAMG,EAAQC,EAGRC,EAAcC,EAAAA,UAAS,IAAMH,EAAMI,OAASJ,EAAMK,aAAe,KAE/DC,SAAUC,GAAmBT,KAC7BU,OAAQC,GAAiBf,IAE3BgB,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,QA4BFW,EAAAC,MACEhB,GACA,CAACiB,EAAgBC,EAAGC,KAClB,GAAIF,EAAgB,CAMlBE,EALoBF,EAAeG,gBAAgBC,IAC7CA,EAAMC,SAAS/B,EAAMgC,YACXpB,EAAAqB,OAAA,IAGK,IAGzB,CAAEC,WAAW,IAIfV,EAAAC,OACE,IAAM,CAACzB,EAAMgC,UAAW9B,EAAY+B,MAAOjC,EAAMmC,IAAK5B,EAAe0B,MAAOrB,EAAYqB,SA1C1F,WAKM,GAJalB,IACVM,IACOP,EAAA,MAETP,EAAe0B,MAAO,OAErB,MAAAG,EAAO7B,EAAe0B,MAAMI,WAAW,CAC3CL,UAAWhC,EAAMgC,UACjBM,QAAS,CACPjC,YAAaH,EAAY+B,MACzBE,IAAKnC,EAAMmC,KAAOI,OAAOC,oBAIf1B,EAAAsB,EAETA,EAAAK,MAAMC,IACQ7B,EAAAS,IAAIqB,gBAAgBD,GACrChC,EAASuB,MAAQpB,EACHC,EAAA,IAAA,GACb8B,SAAM,GAuBT,CAAEV,WAAW,IAIfW,EAAAA,iBAAgB,KACG9B,IACVM,GAAA,WAKIX,EAAQuB,qBAAnBa,EAAAA,mBAAiG,MAAA,OAA3EC,IAAKrC,EAAQuB,MAAGe,MAAO,CAAiCC,MAAA,OAAAC,OAAA,QAAGC,OAAM9B"}

package/dist/vue/index.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, watch, onBeforeUnmount, createElementBlock, createCommentVNode, openBlock } from "vue";
+import { defineComponent, computed, ref, watch, onBeforeUnmount, createElementBlock, createCommentVNode, openBlock } from "vue";
 import { ignore, PdfErrorCode } from "@embedpdf/models";
 import { useCapability, usePlugin } from "@embedpdf/core/vue";
 import { RenderPlugin } from "@embedpdf/plugin-render";
@@ -10,11 +10,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "render-layer",
   props: {
     pageIndex: {},
-    scaleFactor: { default: 1 },
+    scale: {},
+    scaleFactor: {},
     dpr: {}
   },
   setup(__props) {
     const props = __props;
+    const actualScale = computed(() => props.scale ?? props.scaleFactor ?? 1);
     const { provides: renderProvides } = useRenderCapability();
     const { plugin: renderPlugin } = useRenderPlugin();
     const imageUrl = ref(null);
@@ -43,7 +45,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       const task = renderProvides.value.renderPage({
         pageIndex: props.pageIndex,
         options: {
-          scaleFactor: props.scaleFactor,
+          scaleFactor: actualScale.value,
           dpr: props.dpr || window.devicePixelRatio
         }
       });
@@ -69,7 +71,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       { immediate: true }
     );
     watch(
-      () => [props.pageIndex, props.scaleFactor, props.dpr, renderProvides.value, refreshTick.value],
+      () => [props.pageIndex, actualScale.value, props.dpr, renderProvides.value, refreshTick.value],
       startRender,
       { immediate: true }
     );

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, 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  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;AACO,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;;;;"}
+{"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, computed } from 'vue';\nimport { ignore, PdfErrorCode, PdfErrorReason, Task } from '@embedpdf/models';\n\nimport { useRenderCapability, useRenderPlugin } from '../hooks';\n\ninterface Props {\n  pageIndex: number;\n  /**\n   * The scale factor for rendering the page.\n   */\n  scale?: number;\n  /**\n   * @deprecated Use `scale` instead. Will be removed in the next major release.\n   */\n  scaleFactor?: number;\n  dpr?: number;\n}\n\nconst props = defineProps<Props>();\n\n// Handle deprecation: prefer scale over scaleFactor, but fall back to scaleFactor if scale is not provided\nconst actualScale = computed(() => props.scale ?? props.scaleFactor ?? 1);\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  currentTask = null;\n\n  if (!renderProvides.value) return;\n\n  const task = renderProvides.value.renderPage({\n    pageIndex: props.pageIndex,\n    options: {\n      scaleFactor: actualScale.value,\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, actualScale.value, 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;;;;;;;;;;;ACepF,UAAM,QAAQ;AAGd,UAAM,cAAc,SAAS,MAAM,MAAM,SAAS,MAAM,eAAe,CAAC;AAExE,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;AACO,oBAAA;AAEV,UAAA,CAAC,eAAe,MAAO;AAErB,YAAA,OAAO,eAAe,MAAM,WAAW;AAAA,QAC3C,WAAW,MAAM;AAAA,QACjB,SAAS;AAAA,UACP,aAAa,YAAY;AAAA,UACzB,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,YAAY,OAAO,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.25",
+  "version": "1.1.0",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -28,20 +28,20 @@
     }
   },
   "dependencies": {
-    "@embedpdf/models": "1.0.25"
+    "@embedpdf/models": "1.1.0"
   },
   "devDependencies": {
     "@types/react": "^18.2.0",
     "typescript": "^5.0.0",
-    "@embedpdf/core": "1.0.25",
-    "@embedpdf/build": "1.0.0"
+    "@embedpdf/build": "1.0.0",
+    "@embedpdf/core": "1.1.0"
   },
   "peerDependencies": {
     "preact": "^10.26.4",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "vue": ">=3.2.0",
-    "@embedpdf/core": "1.0.25"
+    "@embedpdf/core": "1.1.0"
   },
   "files": [
     "dist",