@embedpdf/plugin-tiling 1.3.16 → 1.4.1

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

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

package/dist/shared/components/tile-img.d.ts

@@ -0,0 +1,9 @@
+import { Tile } from '../../index.ts';
+interface TileImgProps {
+    pageIndex: number;
+    tile: Tile;
+    dpr: number;
+    scale: number;
+}
+export declare function TileImg({ pageIndex, tile, dpr, scale }: TileImgProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

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

@@ -0,0 +1,8 @@
+import { HTMLAttributes, CSSProperties } from '../../react/adapter.ts';
+type TilingLayoutProps = Omit<HTMLAttributes<HTMLDivElement>, 'style'> & {
+    pageIndex: number;
+    scale: number;
+    style?: CSSProperties;
+};
+export declare function TilingLayer({ pageIndex, scale, style, ...props }: TilingLayoutProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

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

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

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

package/dist/shared/index.d.ts

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

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

@@ -0,0 +1,10 @@
+import { Tile } from '../../lib/index.ts';
+interface TileImgProps {
+    pageIndex: number;
+    tile: Tile;
+    dpr: number;
+    scale: number;
+}
+declare const TileImg: import('svelte', { with: { "resolution-mode": "import" } }).Component<TileImgProps, {}, "">;
+type TileImg = ReturnType<typeof TileImg>;
+export default TileImg;

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

@@ -0,0 +1,9 @@
+import { HTMLAttributes } from 'svelte/elements';
+type TilingLayoutProps = HTMLAttributes<HTMLDivElement> & {
+    pageIndex: number;
+    scale: number;
+    class?: string;
+};
+declare const TilingLayer: import('svelte', { with: { "resolution-mode": "import" } }).Component<TilingLayoutProps, {}, "">;
+type TilingLayer = ReturnType<typeof TilingLayer>;
+export default TilingLayer;

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

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

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

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

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

@@ -0,0 +1,11 @@
+import { TilingPlugin } from '../../lib/index.ts';
+export declare const useTilingPlugin: () => {
+    plugin: TilingPlugin | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+export declare const useTilingCapability: () => {
+    provides: Readonly<import('../../lib/index.ts').TilingCapability> | 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/plugin-tiling"),r=require("@embedpdf/core/svelte"),i=require("@embedpdf/models"),n=require("svelte");function l(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e)for(const r in e)if("default"!==r){const i=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,i.get?i:{enumerable:!0,get:()=>e[r]})}return t.default=e,Object.freeze(t)}const s=l(e),o=()=>r.useCapability(t.TilingPlugin.id);var c=s.from_html('<img alt=""/>');function a(e,t){s.push(t,!0);const r=o();let l=s.state(""),a=null;const d=s.derived((()=>t.tile.id)),g=s.derived((()=>t.tile.srcScale)),p=s.derived((()=>t.tile.screenRect)),u=s.derived((()=>t.scale/s.get(g)));s.user_effect((()=>{var e;s.get(d);const o=t.pageIndex;if(a)return;if(!r)return;const c=n.untrack((()=>{return e=t.tile,{...e,pageRect:{origin:{x:e.pageRect.origin.x,y:e.pageRect.origin.y},size:{width:e.pageRect.size.width,height:e.pageRect.size.height}},screenRect:{origin:{x:e.screenRect.origin.x,y:e.screenRect.origin.y},size:{width:e.screenRect.size.width,height:e.screenRect.size.height}}};var e})),g=null==(e=r.provides)?void 0:e.renderTile({pageIndex:o,tile:c,dpr:t.dpr});return null==g||g.wait((e=>{const t=URL.createObjectURL(e);a=t,s.set(l,t,!0)}),i.ignore),()=>{a?(URL.revokeObjectURL(a),a=null):null==g||g.abort({code:i.PdfErrorCode.Cancelled,message:"canceled render task"})}}));const f=()=>{a&&(URL.revokeObjectURL(a),a=null)};var v=s.comment(),h=s.first_child(v),b=e=>{var t=c();let r;s.template_effect((e=>{s.set_attribute(t,"src",s.get(l)),r=s.set_style(t,"",r,e)}),[()=>({position:"absolute",left:s.get(p).origin.x*s.get(u)+"px",top:s.get(p).origin.y*s.get(u)+"px",width:s.get(p).size.width*s.get(u)+"px",height:s.get(p).size.height*s.get(u)+"px",display:"block"})]),s.event("load",t,f),s.replay_events(t),s.append(e,t)};s.if(h,(e=>{s.get(l)&&e(b)})),s.append(e,v),s.pop()}var d=s.from_html("<div></div>");exports.TileImg=a,exports.TilingLayer=function(e,t){s.push(t,!0);let i=s.rest_props(t,["$$slots","$$events","$$legacy","pageIndex","scale","class"]);const n=o();let l=s.state(s.proxy([]));const c=r.useCoreState();s.user_effect((()=>{if(n.provides)return n.provides.onTileRendering((e=>{s.set(l,e[t.pageIndex]??[],!0)}))}));var g=d();s.attribute_effect(g,(()=>({class:t.class,...i}))),s.each(g,21,(()=>s.get(l)),(e=>{var t,r;return`${null==(r=null==(t=c.coreState)?void 0:t.document)?void 0:r.id}-${e.id}`}),((e,r)=>{a(e,{get pageIndex(){return t.pageIndex},get tile(){return s.get(r)},dpr:window.devicePixelRatio,get scale(){return t.scale}})})),s.reset(g),s.append(e,g),s.pop()},exports.useTilingCapability=o,exports.useTilingPlugin=()=>r.usePlugin(t.TilingPlugin.id),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/svelte/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../src/svelte/hooks/use-tiling.ts","../../src/svelte/components/TileImg.svelte","../../src/svelte/components/TilingLayer.svelte"],"sourcesContent":["import { TilingPlugin } from '@embedpdf/plugin-tiling';\nimport { useCapability, usePlugin } from '@embedpdf/core/svelte';\n\nexport const useTilingPlugin = () => usePlugin<TilingPlugin>(TilingPlugin.id);\nexport const useTilingCapability = () => useCapability<TilingPlugin>(TilingPlugin.id);\n","<script lang=\"ts\">\n  import type { Tile } from '@embedpdf/plugin-tiling';\n  import { useTilingCapability } from '../hooks';\n  import { ignore, PdfErrorCode } from '@embedpdf/models';\n  import { untrack } from 'svelte';\n\n  interface TileImgProps {\n    pageIndex: number;\n    tile: Tile;\n    dpr: number;\n    scale: number;\n  }\n\n  let { pageIndex, tile, dpr, scale }: TileImgProps = $props();\n  const tilingCapability = useTilingCapability();\n  let url = $state<string>('');\n  // urlRef is NOT reactive - similar to React's useRef\n  let urlRef: string | null = null;\n\n  // Capture these values once per tile change\n  const tileId = $derived(tile.id);\n  const tileSrcScale = $derived(tile.srcScale);\n  const tileScreenRect = $derived(tile.screenRect);\n  const relativeScale = $derived(scale / tileSrcScale);\n\n  const createPlainTile = (t: Tile): Tile => ({\n    ...t,\n    pageRect: {\n      origin: { x: t.pageRect.origin.x, y: t.pageRect.origin.y },\n      size: { width: t.pageRect.size.width, height: t.pageRect.size.height },\n    },\n    screenRect: {\n      origin: { x: t.screenRect.origin.x, y: t.screenRect.origin.y },\n      size: { width: t.screenRect.size.width, height: t.screenRect.size.height },\n    },\n  });\n\n  /* kick off render exactly once per tile */\n  $effect(() => {\n    // Track only tileId and pageIndex as dependencies (like React's [pageIndex, tile.id])\n    const _tileId = tileId;\n    const _pageIndex = pageIndex;\n\n    // Check if we already have a URL for this tile (already rendered)\n    if (urlRef) return;\n\n    if (!tilingCapability) return;\n\n    // Clone to avoid reactive proxies that Web Workers cannot clone\n    const plainTile = untrack(() => createPlainTile(tile));\n    const task = tilingCapability.provides?.renderTile({\n      pageIndex: _pageIndex,\n      tile: plainTile,\n      dpr,\n    });\n    task?.wait((blob) => {\n      const objectUrl = URL.createObjectURL(blob);\n      urlRef = objectUrl;\n      url = objectUrl;\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  const handleImageLoad = () => {\n    if (urlRef) {\n      URL.revokeObjectURL(urlRef);\n      urlRef = null;\n    }\n  };\n</script>\n\n{#if url}\n  <img\n    src={url}\n    alt=\"\"\n    onload={handleImageLoad}\n    style:position=\"absolute\"\n    style:left={`${tileScreenRect.origin.x * relativeScale}px`}\n    style:top={`${tileScreenRect.origin.y * relativeScale}px`}\n    style:width={`${tileScreenRect.size.width * relativeScale}px`}\n    style:height={`${tileScreenRect.size.height * relativeScale}px`}\n    style:display=\"block\"\n  />\n{/if}\n","<script lang=\"ts\">\n  import type { Tile } from '@embedpdf/plugin-tiling';\n  import { useCoreState } from '@embedpdf/core/svelte';\n  import type { HTMLAttributes } from 'svelte/elements';\n  import TileImg from './TileImg.svelte';\n  import { useTilingCapability } from '../hooks';\n\n  type TilingLayoutProps = HTMLAttributes<HTMLDivElement> & {\n    pageIndex: number;\n    scale: number;\n    class?: string;\n  };\n\n  let { pageIndex, scale, class: propsClass, ...restProps }: TilingLayoutProps = $props();\n\n  const tilingCapability = useTilingCapability();\n  let tiles = $state<Tile[]>([]);\n\n  const core = useCoreState();\n\n  $effect(() => {\n    if (!tilingCapability.provides) return;\n    return tilingCapability.provides.onTileRendering((tilesMap) => {\n      tiles = tilesMap[pageIndex] ?? [];\n    });\n  });\n</script>\n\n<div class={propsClass} {...restProps}>\n  {#each tiles as tile (`${core.coreState?.document?.id}-${tile.id}`)}\n    <TileImg {pageIndex} {tile} dpr={window.devicePixelRatio} {scale} />\n  {/each}\n</div>\n"],"names":["useTilingCapability","useCapability","TilingPlugin","id","tilingCapability","url","urlRef","tileId","tileSrcScale","srcScale","tileScreenRect","screenRect","relativeScale","$","user_effect","_pageIndex","$$props","pageIndex","plainTile","untrack","createPlainTile","t","tile","pageRect","origin","x","y","size","width","height","task","_a","provides","renderTile","dpr","wait","blob","objectUrl","URL","createObjectURL","$__namespace","set","ignore","revokeObjectURL","abort","code","PdfErrorCode","Cancelled","message","handleImageLoad","left","get","top","consequent","restProps","rest_props","tiles","state","proxy","core","useCoreState","onTileRendering","tilesMap","each","div","_b","coreState","document","window","devicePixelRatio","usePlugin"],"mappings":"wjBAIaA,EAAsB,IAAMC,gBAA4BC,EAAAA,aAAaC,oECU1E,MAAAC,EAAmBJ,IACrB,IAAAK,UAAqB,IAErBC,EAAwB,KAGtB,MAAAC,wBAAuBJ,KACvBK,wBAA6BC,WAC7BC,wBAA+BC,aAC/BC,+BAAiCJ,KAevCK,EAAAC,aAAc,iBAEIP,SACVQ,EAAUC,EAAAC,aAGZX,EAAM,WAELF,EAAgB,aAGfc,EAAYC,EAAAA,SAAO,KAAOC,OAxBTC,EAwBwBL,EAAAM,KAxBjB,IAC3BD,EACHE,SAAQ,CACNC,QAAUC,EAAGJ,EAAEE,SAASC,OAAOC,EAAGC,EAAGL,EAAEE,SAASC,OAAOE,GACvDC,MAAQC,MAAOP,EAAEE,SAASI,KAAKC,MAAOC,OAAQR,EAAEE,SAASI,KAAKE,SAEhElB,WAAU,CACRa,QAAUC,EAAGJ,EAAEV,WAAWa,OAAOC,EAAGC,EAAGL,EAAEV,WAAWa,OAAOE,GAC3DC,KAAI,CAAIC,MAAOP,EAAEV,WAAWgB,KAAKC,MAAOC,OAAQR,EAAEV,WAAWgB,KAAKE,cAR7CR,CAwBwB,IACzCS,EAAO,OAAAC,EAAA3B,EAAiB4B,eAAjB,EAAAD,EAA2BE,WAAU,CAChDhB,UAAWF,EACXO,KAAMJ,EACNgB,IAAGlB,EAAAkB,MAQQ,OANP,MAAAJ,GAAAA,EAAAK,MAAMC,IACJ,MAAAC,EAAYC,IAAIC,gBAAgBH,GAC7B9B,EAAA+B,EACTG,EAAAC,IAAApC,EAAMgC,GAAS,EAAA,GACdK,EAAAA,QAEU,KACPpC,GACFgC,IAAIK,gBAAgBrC,GACXA,EAAA,MAET,MAAAwB,GAAAA,EAAMc,MAAK,CACTC,KAAMC,EAAYA,aAACC,UACnBC,QAAS,wBAEb,CACD,IAGG,MAAAC,EAAwB,KACxB3C,IACFgC,IAAIK,gBAAgBrC,GACXA,EAAA,KACX,kHAMKD,yDAIU6C,KAAArC,EAAAsC,IAAAzC,GAAec,OAAOC,QAAIb,GAA1B,KACDwC,IAAAvC,EAAAsC,IAAAzC,GAAec,OAAOE,QAAId,GAA1B,KACEgB,MAAAf,EAAAsC,IAAAzC,GAAeiB,KAAKC,YAAQhB,GAA5B,KACCiB,OAAAhB,EAAAsC,IAAAzC,GAAeiB,KAAKE,aAASjB,GAA7B,0CALTqC,uDAJP5C,MAAGgD,EAAA,yBAFR,mGCnEgD,IAAAC,EAASzC,EAAA0C,WAAAvC,EAAA,+DAEjD,MAAAZ,EAAmBJ,QACrBwD,EAAK3C,EAAA4C,MAAA5C,EAAA6C,MAAA,KAEH,MAAAC,EAAOC,EAAAA,eAEb/C,EAAAC,aAAc,KACP,GAAAV,EAAiB4B,SACf,OAAA5B,EAAiB4B,SAAS6B,iBAAiBC,IAChDtB,EAAAC,IAAAe,EAAQM,EAAQ9C,EAAAC,YAAA,IAAA,EAAA,GACjB,2DAIuBqC,MACnBd,EAAAuB,KAAAC,EAAA,IAAA,IAAAnD,EAAAsC,IAAAK,KAASlC,YAAS,MAAA,GAAA,OAAA2C,EAAA,OAAAlC,EAAA4B,EAAKO,gBAAW,EAAAnC,EAAAoC,mBAAUhE,MAAMmB,EAAKnB,IAAE,OAAhDmB,0EACmBY,IAAAkC,OAAOC,kFAJ5C,wDFvB+B,IAAMC,YAAwBpE,EAAAA,aAAaC"}

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,150 @@
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+import { TilingPlugin } from "@embedpdf/plugin-tiling";
+export * from "@embedpdf/plugin-tiling";
+import { useCapability, usePlugin, useCoreState } from "@embedpdf/core/svelte";
+import { ignore, PdfErrorCode } from "@embedpdf/models";
+import { untrack } from "svelte";
+const useTilingPlugin = () => usePlugin(TilingPlugin.id);
+const useTilingCapability = () => useCapability(TilingPlugin.id);
+var root_1 = $.from_html(`<img alt=""/>`);
+function TileImg($$anchor, $$props) {
+  $.push($$props, true);
+  const tilingCapability = useTilingCapability();
+  let url = $.state("");
+  let urlRef = null;
+  const tileId = $.derived(() => $$props.tile.id);
+  const tileSrcScale = $.derived(() => $$props.tile.srcScale);
+  const tileScreenRect = $.derived(() => $$props.tile.screenRect);
+  const relativeScale = $.derived(() => $$props.scale / $.get(tileSrcScale));
+  const createPlainTile = (t) => ({
+    ...t,
+    pageRect: {
+      origin: { x: t.pageRect.origin.x, y: t.pageRect.origin.y },
+      size: { width: t.pageRect.size.width, height: t.pageRect.size.height }
+    },
+    screenRect: {
+      origin: { x: t.screenRect.origin.x, y: t.screenRect.origin.y },
+      size: {
+        width: t.screenRect.size.width,
+        height: t.screenRect.size.height
+      }
+    }
+  });
+  $.user_effect(() => {
+    var _a;
+    $.get(tileId);
+    const _pageIndex = $$props.pageIndex;
+    if (urlRef) return;
+    if (!tilingCapability) return;
+    const plainTile = untrack(() => createPlainTile($$props.tile));
+    const task = (_a = tilingCapability.provides) == null ? void 0 : _a.renderTile({ pageIndex: _pageIndex, tile: plainTile, dpr: $$props.dpr });
+    task == null ? void 0 : task.wait(
+      (blob) => {
+        const objectUrl = URL.createObjectURL(blob);
+        urlRef = objectUrl;
+        $.set(url, objectUrl, true);
+      },
+      ignore
+    );
+    return () => {
+      if (urlRef) {
+        URL.revokeObjectURL(urlRef);
+        urlRef = null;
+      } else {
+        task == null ? void 0 : task.abort({
+          code: PdfErrorCode.Cancelled,
+          message: "canceled render task"
+        });
+      }
+    };
+  });
+  const handleImageLoad = () => {
+    if (urlRef) {
+      URL.revokeObjectURL(urlRef);
+      urlRef = null;
+    }
+  };
+  var fragment = $.comment();
+  var node = $.first_child(fragment);
+  {
+    var consequent = ($$anchor2) => {
+      var img = root_1();
+      let styles;
+      $.template_effect(
+        ($0) => {
+          $.set_attribute(img, "src", $.get(url));
+          styles = $.set_style(img, "", styles, $0);
+        },
+        [
+          () => ({
+            position: "absolute",
+            left: `${$.get(tileScreenRect).origin.x * $.get(relativeScale)}px`,
+            top: `${$.get(tileScreenRect).origin.y * $.get(relativeScale)}px`,
+            width: `${$.get(tileScreenRect).size.width * $.get(relativeScale)}px`,
+            height: `${$.get(tileScreenRect).size.height * $.get(relativeScale)}px`,
+            display: "block"
+          })
+        ]
+      );
+      $.event("load", img, handleImageLoad);
+      $.replay_events(img);
+      $.append($$anchor2, img);
+    };
+    $.if(node, ($$render) => {
+      if ($.get(url)) $$render(consequent);
+    });
+  }
+  $.append($$anchor, fragment);
+  $.pop();
+}
+var root = $.from_html(`<div></div>`);
+function TilingLayer($$anchor, $$props) {
+  $.push($$props, true);
+  let restProps = $.rest_props($$props, [
+    "$$slots",
+    "$$events",
+    "$$legacy",
+    "pageIndex",
+    "scale",
+    "class"
+  ]);
+  const tilingCapability = useTilingCapability();
+  let tiles = $.state($.proxy([]));
+  const core = useCoreState();
+  $.user_effect(() => {
+    if (!tilingCapability.provides) return;
+    return tilingCapability.provides.onTileRendering((tilesMap) => {
+      $.set(tiles, tilesMap[$$props.pageIndex] ?? [], true);
+    });
+  });
+  var div = root();
+  $.attribute_effect(div, () => ({ class: $$props.class, ...restProps }));
+  $.each(div, 21, () => $.get(tiles), (tile) => {
+    var _a, _b;
+    return `${(_b = (_a = core.coreState) == null ? void 0 : _a.document) == null ? void 0 : _b.id}-${tile.id}`;
+  }, ($$anchor2, tile) => {
+    TileImg($$anchor2, {
+      get pageIndex() {
+        return $$props.pageIndex;
+      },
+      get tile() {
+        return $.get(tile);
+      },
+      dpr: window.devicePixelRatio,
+      get scale() {
+        return $$props.scale;
+      }
+    });
+  });
+  $.reset(div);
+  $.append($$anchor, div);
+  $.pop();
+}
+export {
+  TileImg,
+  TilingLayer,
+  useTilingCapability,
+  useTilingPlugin
+};
+//# sourceMappingURL=index.js.map

package/dist/svelte/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../src/svelte/hooks/use-tiling.ts","../../src/svelte/components/TileImg.svelte","../../src/svelte/components/TilingLayer.svelte"],"sourcesContent":["import { TilingPlugin } from '@embedpdf/plugin-tiling';\nimport { useCapability, usePlugin } from '@embedpdf/core/svelte';\n\nexport const useTilingPlugin = () => usePlugin<TilingPlugin>(TilingPlugin.id);\nexport const useTilingCapability = () => useCapability<TilingPlugin>(TilingPlugin.id);\n","<script lang=\"ts\">\n  import type { Tile } from '@embedpdf/plugin-tiling';\n  import { useTilingCapability } from '../hooks';\n  import { ignore, PdfErrorCode } from '@embedpdf/models';\n  import { untrack } from 'svelte';\n\n  interface TileImgProps {\n    pageIndex: number;\n    tile: Tile;\n    dpr: number;\n    scale: number;\n  }\n\n  let { pageIndex, tile, dpr, scale }: TileImgProps = $props();\n  const tilingCapability = useTilingCapability();\n  let url = $state<string>('');\n  // urlRef is NOT reactive - similar to React's useRef\n  let urlRef: string | null = null;\n\n  // Capture these values once per tile change\n  const tileId = $derived(tile.id);\n  const tileSrcScale = $derived(tile.srcScale);\n  const tileScreenRect = $derived(tile.screenRect);\n  const relativeScale = $derived(scale / tileSrcScale);\n\n  const createPlainTile = (t: Tile): Tile => ({\n    ...t,\n    pageRect: {\n      origin: { x: t.pageRect.origin.x, y: t.pageRect.origin.y },\n      size: { width: t.pageRect.size.width, height: t.pageRect.size.height },\n    },\n    screenRect: {\n      origin: { x: t.screenRect.origin.x, y: t.screenRect.origin.y },\n      size: { width: t.screenRect.size.width, height: t.screenRect.size.height },\n    },\n  });\n\n  /* kick off render exactly once per tile */\n  $effect(() => {\n    // Track only tileId and pageIndex as dependencies (like React's [pageIndex, tile.id])\n    const _tileId = tileId;\n    const _pageIndex = pageIndex;\n\n    // Check if we already have a URL for this tile (already rendered)\n    if (urlRef) return;\n\n    if (!tilingCapability) return;\n\n    // Clone to avoid reactive proxies that Web Workers cannot clone\n    const plainTile = untrack(() => createPlainTile(tile));\n    const task = tilingCapability.provides?.renderTile({\n      pageIndex: _pageIndex,\n      tile: plainTile,\n      dpr,\n    });\n    task?.wait((blob) => {\n      const objectUrl = URL.createObjectURL(blob);\n      urlRef = objectUrl;\n      url = objectUrl;\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  const handleImageLoad = () => {\n    if (urlRef) {\n      URL.revokeObjectURL(urlRef);\n      urlRef = null;\n    }\n  };\n</script>\n\n{#if url}\n  <img\n    src={url}\n    alt=\"\"\n    onload={handleImageLoad}\n    style:position=\"absolute\"\n    style:left={`${tileScreenRect.origin.x * relativeScale}px`}\n    style:top={`${tileScreenRect.origin.y * relativeScale}px`}\n    style:width={`${tileScreenRect.size.width * relativeScale}px`}\n    style:height={`${tileScreenRect.size.height * relativeScale}px`}\n    style:display=\"block\"\n  />\n{/if}\n","<script lang=\"ts\">\n  import type { Tile } from '@embedpdf/plugin-tiling';\n  import { useCoreState } from '@embedpdf/core/svelte';\n  import type { HTMLAttributes } from 'svelte/elements';\n  import TileImg from './TileImg.svelte';\n  import { useTilingCapability } from '../hooks';\n\n  type TilingLayoutProps = HTMLAttributes<HTMLDivElement> & {\n    pageIndex: number;\n    scale: number;\n    class?: string;\n  };\n\n  let { pageIndex, scale, class: propsClass, ...restProps }: TilingLayoutProps = $props();\n\n  const tilingCapability = useTilingCapability();\n  let tiles = $state<Tile[]>([]);\n\n  const core = useCoreState();\n\n  $effect(() => {\n    if (!tilingCapability.provides) return;\n    return tilingCapability.provides.onTileRendering((tilesMap) => {\n      tiles = tilesMap[pageIndex] ?? [];\n    });\n  });\n</script>\n\n<div class={propsClass} {...restProps}>\n  {#each tiles as tile (`${core.coreState?.document?.id}-${tile.id}`)}\n    <TileImg {pageIndex} {tile} dpr={window.devicePixelRatio} {scale} />\n  {/each}\n</div>\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@embedpdf/plugin-tiling",
-  "version": "1.3.16",
+  "version": "1.4.1",
   "type": "module",
   "license": "MIT",
   "main": "./dist/index.cjs",
@@ -26,29 +26,36 @@
       "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.16"
+    "@embedpdf/models": "1.4.1"
   },
   "devDependencies": {
     "@types/react": "^18.2.0",
     "typescript": "^5.0.0",
-    "@embedpdf/core": "1.3.16",
-    "@embedpdf/build": "1.0.1",
-    "@embedpdf/plugin-render": "1.3.16",
-    "@embedpdf/plugin-scroll": "1.3.16",
-    "@embedpdf/plugin-viewport": "1.3.16"
+    "@embedpdf/core": "1.4.1",
+    "@embedpdf/build": "1.1.0",
+    "@embedpdf/plugin-scroll": "1.4.1",
+    "@embedpdf/plugin-viewport": "1.4.1",
+    "@embedpdf/plugin-render": "1.4.1"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "preact": "^10.26.4",
     "vue": ">=3.2.0",
-    "@embedpdf/core": "1.3.16",
-    "@embedpdf/plugin-scroll": "1.3.16",
-    "@embedpdf/plugin-render": "1.3.16",
-    "@embedpdf/plugin-viewport": "1.3.16"
+    "svelte": ">=5 <6",
+    "@embedpdf/plugin-render": "1.4.1",
+    "@embedpdf/plugin-scroll": "1.4.1",
+    "@embedpdf/plugin-viewport": "1.4.1",
+    "@embedpdf/core": "1.4.1"
   },
   "files": [
     "dist",
@@ -71,7 +78,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"