@embedpdf/plugin-render 1.3.15 → 1.4.0

package/dist/shared/components/index.d.ts

@@ -0,0 +1 @@
+export * from './render-layer';

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

@@ -0,0 +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, scale, scaleFactor, dpr, style, ...props }: RenderLayerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/shared/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from './use-render';

package/dist/shared/hooks/use-render.d.ts

@@ -0,0 +1,11 @@
+import { RenderPlugin } from '../../index.ts';
+export declare const useRenderPlugin: () => {
+    plugin: RenderPlugin | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+export declare const useRenderCapability: () => {
+    provides: Readonly<import('../../index.ts').RenderCapability> | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};

package/dist/shared/index.d.ts

@@ -0,0 +1,3 @@
+export * from './components';
+export * from './hooks';
+export * from '../index.ts';

package/dist/svelte/components/RenderLayer.svelte.d.ts

@@ -0,0 +1,10 @@
+import { HTMLImgAttributes } from 'svelte/elements';
+interface RenderLayerProps extends Omit<HTMLImgAttributes, 'style'> {
+    pageIndex: number;
+    scale?: number;
+    dpr?: number;
+    class?: string;
+}
+declare const RenderLayer: import('svelte', { with: { "resolution-mode": "import" } }).Component<RenderLayerProps, {}, "">;
+type RenderLayer = ReturnType<typeof RenderLayer>;
+export default RenderLayer;

package/dist/svelte/components/index.d.ts

@@ -0,0 +1 @@
+export { default as RenderLayer } from './RenderLayer.svelte';

package/dist/svelte/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from './use-render';

package/dist/svelte/hooks/use-render.d.ts

@@ -0,0 +1,11 @@
+import { RenderPlugin } from '../../lib/index.ts';
+export declare const useRenderPlugin: () => {
+    plugin: RenderPlugin | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+export declare const useRenderCapability: () => {
+    provides: Readonly<import('../../lib/index.ts').RenderCapability> | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};

package/dist/svelte/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"}),require("svelte/internal/disclose-version");const e=require("svelte/internal/client"),t=require("@embedpdf/models"),r=require("@embedpdf/core/svelte"),n=require("@embedpdf/plugin-render");function s(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e)for(const r in e)if("default"!==r){const n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:()=>e[r]})}return t.default=e,Object.freeze(t)}const l=s(e),o=()=>r.usePlugin(n.RenderPlugin.id),i=()=>r.useCapability(n.RenderPlugin.id);var a=l.from_html("<img/>");exports.RenderLayer=function(e,r){l.push(r,!0);let n=l.rest_props(r,["$$slots","$$events","$$legacy","pageIndex","scale","dpr","class"]);const s=i(),c=o(),d=l.derived((()=>r.scale??1));let u=l.state(null),p=null,f=l.state(0);function g(){p&&(URL.revokeObjectURL(p),p=null)}l.user_effect((()=>{if(c.plugin)return c.plugin.onRefreshPages((e=>{e.includes(r.pageIndex)&&l.update(f)}))})),l.user_effect((()=>{l.get(f);const e=s.provides;if(!e)return;const n=e.renderPage({pageIndex:r.pageIndex,options:{scaleFactor:l.get(d),dpr:r.dpr||window.devicePixelRatio}});return n.wait((e=>{const t=URL.createObjectURL(e);p&&URL.revokeObjectURL(p),l.set(u,t,!0),p=t}),t.ignore),()=>{p?(URL.revokeObjectURL(p),p=null):n.abort({code:t.PdfErrorCode.Cancelled,message:"canceled render task"})}}));var b=l.comment(),v=l.first_child(b),y=e=>{var t=a();l.attribute_effect(t,(()=>({src:l.get(u),onload:g,...n,style:"width: 100%; height: 100%;",class:r.class,alt:""}))),l.replay_events(t),l.append(e,t)};l.if(v,(e=>{l.get(u)&&e(y)})),l.append(e,b),l.pop()},exports.useRenderCapability=i,exports.useRenderPlugin=o,Object.keys(n).forEach((e=>{"default"===e||Object.prototype.hasOwnProperty.call(exports,e)||Object.defineProperty(exports,e,{enumerable:!0,get:()=>n[e]})}));
+//# sourceMappingURL=index.cjs.map

package/dist/svelte/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/svelte/hooks/use-render.ts","../../src/svelte/components/RenderLayer.svelte"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/svelte';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","<script lang=\"ts\">\n  import type { HTMLImgAttributes } from 'svelte/elements';\n  import { ignore, type PdfDocumentObject, PdfErrorCode } from '@embedpdf/models';\n  import { useRenderCapability, useRenderPlugin } from '../hooks';\n\n  interface RenderLayerProps extends Omit<HTMLImgAttributes, 'style'> {\n    pageIndex: number;\n    scale?: number;\n    dpr?: number;\n    class?: string;\n  }\n\n  let { pageIndex, scale, dpr, class: propsClass, ...props }: RenderLayerProps = $props();\n\n  const renderCapability = useRenderCapability();\n  const renderPlugin = useRenderPlugin();\n\n  const actualScale = $derived(scale ?? 1);\n\n  let imageUrl = $state<string | null>(null);\n  let urlRef: string | null = null;\n  let refreshTick = $state(0);\n\n  // Subscribe/unsubscribe whenever the plugin instance changes (not just on mount)\n  $effect(() => {\n    if (!renderPlugin.plugin) return; // nothing yet; try again when it appears\n    return renderPlugin.plugin.onRefreshPages((pages) => {\n      if (pages.includes(pageIndex)) {\n        refreshTick++; // trigger a re-render\n      }\n    });\n  });\n\n  // Render whenever inputs change (pageIndex, scale, dpr, provides, refreshTick)\n  $effect(() => {\n    // Explicitly read refreshTick so the effect tracks it\n    const _tick = refreshTick;\n\n    const provides = renderCapability.provides;\n    if (!provides) return;\n\n    const task = provides.renderPage({\n      pageIndex,\n      options: { scaleFactor: actualScale, dpr: dpr || window.devicePixelRatio },\n    });\n\n    task.wait((blob) => {\n      const url = URL.createObjectURL(blob);\n      // revoke any previous URL before swapping to avoid leaks\n      if (urlRef) {\n        URL.revokeObjectURL(urlRef);\n      }\n\n      imageUrl = url;\n      urlRef = url;\n    }, ignore);\n\n    return () => {\n      if (urlRef) {\n        URL.revokeObjectURL(urlRef);\n        urlRef = null;\n      } else {\n        task.abort({\n          code: PdfErrorCode.Cancelled,\n          message: 'canceled render task',\n        });\n      }\n    };\n  });\n\n  function handleImageLoad() {\n    // Additional safety: once the image has loaded, revoke the last ref if still present\n    if (urlRef) {\n      URL.revokeObjectURL(urlRef);\n      urlRef = null;\n    }\n  }\n</script>\n\n{#if imageUrl}\n  <img\n    src={imageUrl}\n    onload={handleImageLoad}\n    {...props}\n    style=\"width: 100%; height: 100%;\"\n    class={propsClass}\n    alt=\"\"\n  />\n{/if}\n"],"names":["useRenderPlugin","usePlugin","RenderPlugin","id","useRenderCapability","useCapability","props","$","rest_props","$$props","renderCapability","renderPlugin","actualScale","imageUrl","urlRef","refreshTick","handleImageLoad","URL","revokeObjectURL","user_effect","plugin","onRefreshPages","pages","includes","pageIndex","provides","task","renderPage","options","scaleFactor","dpr","window","devicePixelRatio","wait","blob","url","createObjectURL","$__namespace","set","ignore","abort","code","PdfErrorCode","Cancelled","message","consequent"],"mappings":"oiBAGaA,EAAkB,IAAMC,YAAwBC,EAAAA,aAAaC,IAC7DC,EAAsB,IAAMC,gBAA4BH,EAAAA,aAAaC,+ECQ7B,IAAAG,EAAKC,EAAAC,WAAAC,EAAA,qEAElD,MAAAC,EAAmBN,IACnBO,EAAeX,IAEfY,0BAAgC,IAElC,IAAAC,UAAiC,MACjCC,EAAwB,KACxBC,UAAqB,GAiDhB,SAAAC,IAEHF,IACFG,IAAIC,gBAAgBJ,GACXA,EAAA,KAEb,CApDAP,EAAAY,aAAc,KACP,GAAAR,EAAaS,OACX,OAAAT,EAAaS,OAAOC,gBAAgBC,IACrCA,EAAMC,SAAqBd,EAAAe,qBAC7BT,EACF,GACD,IAIHR,EAAAY,aAAc,WAEEJ,SAERU,EAAWf,EAAiBe,aAC7BA,EAAQ,OAEP,MAAAC,EAAOD,EAASE,WAAU,CAC9BH,UAASf,EAAAe,UACTI,QAAO,CAAIC,kBAAajB,GAAakB,IAAGrB,EAAAqB,KAASC,OAAOC,oBAc7C,OAXRN,EAAAO,MAAMC,IACH,MAAAC,EAAMlB,IAAImB,gBAAgBF,GAE5BpB,GACFG,IAAIC,gBAAgBJ,GAGtBuB,EAAAC,IAAAzB,EAAWsB,GAAG,GACLrB,EAAAqB,CAAA,GACRI,EAAAA,QAEU,KACPzB,GACFG,IAAIC,gBAAgBJ,GACXA,EAAA,MAETY,EAAKc,MAAK,CACRC,KAAMC,EAAYA,aAACC,UACnBC,QAAS,wBAEb,CACD,+FAcI/B,UACGG,KACJV,kHAJHO,MAAQgC,EAAA,yBAFb"}

package/dist/svelte/index.d.ts

@@ -0,0 +1,3 @@
+export * from './components';
+export * from './hooks';
+export * from '../lib/index.ts';

package/dist/svelte/index.js

@@ -0,0 +1,106 @@
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+import { ignore, PdfErrorCode } from "@embedpdf/models";
+import { useCapability, usePlugin } from "@embedpdf/core/svelte";
+import { RenderPlugin } from "@embedpdf/plugin-render";
+export * from "@embedpdf/plugin-render";
+const useRenderPlugin = () => usePlugin(RenderPlugin.id);
+const useRenderCapability = () => useCapability(RenderPlugin.id);
+var root_1 = $.from_html(`<img/>`);
+function RenderLayer($$anchor, $$props) {
+  $.push($$props, true);
+  let props = $.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "pageIndex",
+    "scale",
+    "dpr",
+    "class"
+  ]);
+  const renderCapability = useRenderCapability();
+  const renderPlugin = useRenderPlugin();
+  const actualScale = $.derived(() => $$props.scale ?? 1);
+  let imageUrl = $.state(null);
+  let urlRef = null;
+  let refreshTick = $.state(0);
+  $.user_effect(() => {
+    if (!renderPlugin.plugin) return;
+    return renderPlugin.plugin.onRefreshPages((pages) => {
+      if (pages.includes($$props.pageIndex)) {
+        $.update(
+          refreshTick
+          // trigger a re-render
+        );
+      }
+    });
+  });
+  $.user_effect(() => {
+    $.get(refreshTick);
+    const provides = renderCapability.provides;
+    if (!provides) return;
+    const task = provides.renderPage({
+      pageIndex: $$props.pageIndex,
+      options: {
+        scaleFactor: $.get(actualScale),
+        dpr: $$props.dpr || window.devicePixelRatio
+      }
+    });
+    task.wait(
+      (blob) => {
+        const url = URL.createObjectURL(blob);
+        if (urlRef) {
+          URL.revokeObjectURL(urlRef);
+        }
+        $.set(imageUrl, url, true);
+        urlRef = url;
+      },
+      ignore
+    );
+    return () => {
+      if (urlRef) {
+        URL.revokeObjectURL(urlRef);
+        urlRef = null;
+      } else {
+        task.abort({
+          code: PdfErrorCode.Cancelled,
+          message: "canceled render task"
+        });
+      }
+    };
+  });
+  function handleImageLoad() {
+    if (urlRef) {
+      URL.revokeObjectURL(urlRef);
+      urlRef = null;
+    }
+  }
+  var fragment = $.comment();
+  var node = $.first_child(fragment);
+  {
+    var consequent = ($$anchor2) => {
+      var img = root_1();
+      $.attribute_effect(img, () => ({
+        src: $.get(imageUrl),
+        onload: handleImageLoad,
+        ...props,
+        style: "width: 100%; height: 100%;",
+        class: $$props.class,
+        alt: ""
+      }));
+      $.replay_events(img);
+      $.append($$anchor2, img);
+    };
+    $.if(node, ($$render) => {
+      if ($.get(imageUrl)) $$render(consequent);
+    });
+  }
+  $.append($$anchor, fragment);
+  $.pop();
+}
+export {
+  RenderLayer,
+  useRenderCapability,
+  useRenderPlugin
+};
+//# sourceMappingURL=index.js.map

package/dist/svelte/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/svelte/hooks/use-render.ts","../../src/svelte/components/RenderLayer.svelte"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/svelte';\nimport { RenderPlugin } from '@embedpdf/plugin-render';\n\nexport const useRenderPlugin = () => usePlugin<RenderPlugin>(RenderPlugin.id);\nexport const useRenderCapability = () => useCapability<RenderPlugin>(RenderPlugin.id);\n","<script lang=\"ts\">\n  import type { HTMLImgAttributes } from 'svelte/elements';\n  import { ignore, type PdfDocumentObject, PdfErrorCode } from '@embedpdf/models';\n  import { useRenderCapability, useRenderPlugin } from '../hooks';\n\n  interface RenderLayerProps extends Omit<HTMLImgAttributes, 'style'> {\n    pageIndex: number;\n    scale?: number;\n    dpr?: number;\n    class?: string;\n  }\n\n  let { pageIndex, scale, dpr, class: propsClass, ...props }: RenderLayerProps = $props();\n\n  const renderCapability = useRenderCapability();\n  const renderPlugin = useRenderPlugin();\n\n  const actualScale = $derived(scale ?? 1);\n\n  let imageUrl = $state<string | null>(null);\n  let urlRef: string | null = null;\n  let refreshTick = $state(0);\n\n  // Subscribe/unsubscribe whenever the plugin instance changes (not just on mount)\n  $effect(() => {\n    if (!renderPlugin.plugin) return; // nothing yet; try again when it appears\n    return renderPlugin.plugin.onRefreshPages((pages) => {\n      if (pages.includes(pageIndex)) {\n        refreshTick++; // trigger a re-render\n      }\n    });\n  });\n\n  // Render whenever inputs change (pageIndex, scale, dpr, provides, refreshTick)\n  $effect(() => {\n    // Explicitly read refreshTick so the effect tracks it\n    const _tick = refreshTick;\n\n    const provides = renderCapability.provides;\n    if (!provides) return;\n\n    const task = provides.renderPage({\n      pageIndex,\n      options: { scaleFactor: actualScale, dpr: dpr || window.devicePixelRatio },\n    });\n\n    task.wait((blob) => {\n      const url = URL.createObjectURL(blob);\n      // revoke any previous URL before swapping to avoid leaks\n      if (urlRef) {\n        URL.revokeObjectURL(urlRef);\n      }\n\n      imageUrl = url;\n      urlRef = url;\n    }, ignore);\n\n    return () => {\n      if (urlRef) {\n        URL.revokeObjectURL(urlRef);\n        urlRef = null;\n      } else {\n        task.abort({\n          code: PdfErrorCode.Cancelled,\n          message: 'canceled render task',\n        });\n      }\n    };\n  });\n\n  function handleImageLoad() {\n    // Additional safety: once the image has loaded, revoke the last ref if still present\n    if (urlRef) {\n      URL.revokeObjectURL(urlRef);\n      urlRef = null;\n    }\n  }\n</script>\n\n{#if imageUrl}\n  <img\n    src={imageUrl}\n    onload={handleImageLoad}\n    {...props}\n    style=\"width: 100%; height: 100%;\"\n    class={propsClass}\n    alt=\"\"\n  />\n{/if}\n"],"names":[],"mappings":";;;;;;AAGO,MAAM,kBAAkB,MAAM,UAAwB,aAAa,EAAE;AACrE,MAAM,sBAAsB,MAAM,cAA4B,aAAa,EAAE;;wCCJpF;;MAYqD,QAAK,EAAA,WAAA,SAAA;AAAA;;;;;;;;AAElD,QAAA,mBAAmB,oBAAmB;AACtC,QAAA,eAAe,gBAAe;AAE9B,QAAA,+CAAgC,CAAC;AAEnC,MAAA,mBAAiC,IAAI;AACrC,MAAA,SAAwB;AACxB,MAAA,sBAAqB,CAAC;AAG1B,IAAA,YAAc,MAAA;AACP,QAAA,CAAA,aAAa,OAAM;AACjB,WAAA,aAAa,OAAO,eAAc,CAAE,UAAU;UAC/C,MAAM,SAAqB,QAAA,SAAA,GAAA;;UAC7B;AAAA;AAAA;MACF;AAAA,KACD;AAAA,GACF;AAGD,IAAA,YAAc,MAAA;UAEE,WAAW;UAEnB,WAAW,iBAAiB;SAC7B,SAAQ;UAEP,OAAO,SAAS,WAAU;AAAA,MAC9B,WAAS,QAAA;AAAA,MACT,SAAO;AAAA,QAAI,mBAAa,WAAW;AAAA,QAAE,KAAG,QAAA,OAAS,OAAO;AAAA;;AAG1D,SAAK;AAAA,MAAM,CAAA,SAAS;AACZ,cAAA,MAAM,IAAI,gBAAgB,IAAI;AAEhC,YAAA,QAAQ;AACV,cAAI,gBAAgB,MAAM;AAAA,QAC5B;AAEA,UAAA,IAAA,UAAW,KAAG,IAAA;AACd,iBAAS;AAAA,MACV;AAAA,MAAE;AAAA;AAEU,WAAA,MAAA;AACP,UAAA,QAAQ;AACV,YAAI,gBAAgB,MAAM;AAC1B,iBAAS;AAAA,MACX,OAAO;AACL,aAAK,MAAK;AAAA,UACR,MAAM,aAAa;AAAA,UACnB,SAAS;AAAA;MAEb;AAAA,IACD;AAAA,GACF;AAEQ,WAAA,kBAAkB;AAErB,QAAA,QAAQ;AACV,UAAI,gBAAgB,MAAM;AAC1B,eAAS;AAAA,IACX;AAAA,EACF;;;;;;;mBAKO,QAAQ;AAAA,gBACL;AAAA,WACJ;AAAA;;;;;;;;gBAJH,QAAQ,EAAA,UAAA,UAAA;AAAA;;;;AAFb;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@embedpdf/plugin-render",
-  "version": "1.3.15",
+  "version": "1.4.0",
   "type": "module",
   "license": "MIT",
   "main": "./dist/index.cjs",
@@ -26,23 +26,30 @@
       "types": "./dist/vue/index.d.ts",
       "import": "./dist/vue/index.js",
       "require": "./dist/vue/index.cjs"
+    },
+    "./svelte": {
+      "types": "./dist/svelte/index.d.ts",
+      "svelte": "./dist/svelte/index.js",
+      "import": "./dist/svelte/index.js",
+      "require": "./dist/svelte/index.cjs"
     }
   },
   "dependencies": {
-    "@embedpdf/models": "1.3.15"
+    "@embedpdf/models": "1.4.0"
   },
   "devDependencies": {
     "@types/react": "^18.2.0",
     "typescript": "^5.0.0",
-    "@embedpdf/build": "1.0.1",
-    "@embedpdf/core": "1.3.15"
+    "@embedpdf/build": "1.1.0",
+    "@embedpdf/core": "1.4.0"
   },
   "peerDependencies": {
     "preact": "^10.26.4",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "vue": ">=3.2.0",
-    "@embedpdf/core": "1.3.15"
+    "svelte": ">=5 <6",
+    "@embedpdf/core": "1.4.0"
   },
   "files": [
     "dist",
@@ -65,7 +72,8 @@
     "build:react": "vite build --mode react",
     "build:preact": "vite build --mode preact",
     "build:vue": "vite build --mode vue",
-    "build": "pnpm run clean && concurrently -c auto -n base,react,preact,vue \"vite build --mode base\" \"vite build --mode react\" \"vite build --mode preact\" \"vite build --mode vue\"",
+    "build:svelte": "vite build --mode svelte",
+    "build": "pnpm run clean && concurrently -c auto -n base,react,preact,vue,svelte \"vite build --mode base\" \"vite build --mode react\" \"vite build --mode preact\" \"vite build --mode vue\" \"vite build --mode svelte\"",
     "clean": "rimraf dist",
     "lint": "eslint src --color",
     "lint:fix": "eslint src --color --fix"