@embedpdf/plugin-viewport 1.0.11 → 1.0.12

package/dist/lib/reducer.d.ts

@@ -0,0 +1,5 @@
+import { Reducer } from '@embedpdf/core';
+import { ViewportAction } from './actions';
+import { ViewportState } from './types';
+export declare const initialState: ViewportState;
+export declare const viewportReducer: Reducer<ViewportState, ViewportAction>;

package/dist/lib/types.d.ts

@@ -0,0 +1,52 @@
+import { BasePluginConfig, EventHook } from '@embedpdf/core';
+import { Rect } from '@embedpdf/models';
+export interface ViewportState {
+    viewportGap: number;
+    viewportMetrics: ViewportMetrics;
+    isScrolling: boolean;
+}
+export interface ViewportPluginConfig extends BasePluginConfig {
+    viewportGap?: number;
+    scrollEndDelay?: number;
+}
+export interface ViewportInputMetrics {
+    width: number;
+    height: number;
+    scrollTop: number;
+    scrollLeft: number;
+    clientWidth: number;
+    clientHeight: number;
+    scrollWidth: number;
+    scrollHeight: number;
+}
+export interface ViewportMetrics extends ViewportInputMetrics {
+    relativePosition: {
+        x: number;
+        y: number;
+    };
+}
+export interface ViewportScrollMetrics {
+    scrollTop: number;
+    scrollLeft: number;
+}
+export interface ScrollControlOptions {
+    mode: 'debounce' | 'throttle';
+    wait: number;
+}
+export interface ScrollToPayload {
+    x: number;
+    y: number;
+    behavior?: ScrollBehavior;
+    center?: boolean;
+}
+export interface ViewportCapability {
+    getViewportGap: () => number;
+    getMetrics: () => ViewportMetrics;
+    scrollTo(position: ScrollToPayload): void;
+    onViewportChange: EventHook<ViewportMetrics>;
+    onViewportResize: EventHook<ViewportMetrics>;
+    onScrollChange: EventHook<ViewportScrollMetrics>;
+    onScrollActivity: EventHook<boolean>;
+    isScrolling: () => boolean;
+    getBoundingRect(): Rect;
+}

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

@@ -0,0 +1,27 @@
+import { BasePlugin, PluginRegistry, Listener } from '@embedpdf/core';
+import { ViewportAction } from './actions';
+import { ViewportPluginConfig, ViewportState, ViewportCapability, ViewportScrollMetrics, ViewportInputMetrics, ScrollToPayload } from './types';
+import { Rect } from '@embedpdf/models';
+export declare class ViewportPlugin extends BasePlugin<ViewportPluginConfig, ViewportCapability, ViewportState, ViewportAction> {
+    readonly id: string;
+    static readonly id: "viewport";
+    private readonly viewportResize$;
+    private readonly viewportMetrics$;
+    private readonly scrollMetrics$;
+    private readonly scrollReq$;
+    private readonly scrollActivity$;
+    private rectProvider;
+    private scrollEndTimer?;
+    private readonly scrollEndDelay;
+    constructor(id: string, registry: PluginRegistry, config: ViewportPluginConfig);
+    protected buildCapability(): ViewportCapability;
+    setViewportResizeMetrics(viewportMetrics: ViewportInputMetrics): void;
+    setViewportScrollMetrics(scrollMetrics: ViewportScrollMetrics): void;
+    onScrollRequest(listener: Listener<ScrollToPayload>): import('@embedpdf/core').Unsubscribe;
+    registerBoundingRectProvider(provider: (() => Rect) | null): void;
+    private bumpScrollActivity;
+    private scrollTo;
+    onStoreUpdated(prevState: ViewportState, newState: ViewportState): void;
+    initialize(_config: ViewportPluginConfig): Promise<void>;
+    destroy(): Promise<void>;
+}

package/dist/preact/adapter.d.ts

@@ -0,0 +1,5 @@
+export { Fragment } from 'preact';
+export { useEffect, useRef, useState, useCallback, useMemo, useLayoutEffect } from 'preact/hooks';
+export type { ComponentChildren as ReactNode } from 'preact';
+export type CSSProperties = import('preact').JSX.CSSProperties;
+export type HTMLAttributes<T = any> = import('preact').JSX.HTMLAttributes<T extends EventTarget ? T : never>;

package/dist/preact/core.d.ts

@@ -0,0 +1 @@
+export * from '@embedpdf/core/preact';

package/dist/preact/index.cjs

@@ -1,123 +1,2 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/preact/index.ts
-var preact_exports = {};
-__export(preact_exports, {
-  Viewport: () => Viewport,
-  useViewportCapability: () => useViewportCapability,
-  useViewportPlugin: () => useViewportPlugin
-});
-module.exports = __toCommonJS(preact_exports);
-
-// src/preact/hooks/use-viewport.ts
-var import_preact = require("@embedpdf/core/preact");
-var import_plugin_viewport = require("@embedpdf/plugin-viewport");
-var useViewportPlugin = () => (0, import_preact.usePlugin)(import_plugin_viewport.ViewportPlugin.id);
-var useViewportCapability = () => (0, import_preact.useCapability)(import_plugin_viewport.ViewportPlugin.id);
-
-// src/preact/components/viewport.tsx
-var import_hooks2 = require("preact/hooks");
-
-// src/preact/hooks/use-viewport-ref.ts
-var import_hooks = require("preact/hooks");
-function useViewportRef() {
-  const { plugin: viewportPlugin } = useViewportPlugin();
-  const containerRef = (0, import_hooks.useRef)(null);
-  (0, import_hooks.useLayoutEffect)(() => {
-    if (!viewportPlugin) return;
-    const container = containerRef.current;
-    if (!container) return;
-    const provideRect = () => {
-      const r = container.getBoundingClientRect();
-      return {
-        origin: { x: r.left, y: r.top },
-        size: { width: r.width, height: r.height }
-      };
-    };
-    viewportPlugin.registerBoundingRectProvider(provideRect);
-    const onScroll = () => {
-      viewportPlugin.setViewportScrollMetrics({
-        scrollTop: container.scrollTop,
-        scrollLeft: container.scrollLeft
-      });
-    };
-    container.addEventListener("scroll", onScroll);
-    const resizeObserver = new ResizeObserver(() => {
-      viewportPlugin.setViewportResizeMetrics({
-        width: container.offsetWidth,
-        height: container.offsetHeight,
-        clientWidth: container.clientWidth,
-        clientHeight: container.clientHeight,
-        scrollTop: container.scrollTop,
-        scrollLeft: container.scrollLeft,
-        scrollWidth: container.scrollWidth,
-        scrollHeight: container.scrollHeight
-      });
-    });
-    resizeObserver.observe(container);
-    const unsubscribeScrollRequest = viewportPlugin.onScrollRequest(
-      ({ x, y, behavior = "auto" }) => {
-        requestAnimationFrame(() => {
-          container.scrollTo({ left: x, top: y, behavior });
-        });
-      }
-    );
-    return () => {
-      viewportPlugin.registerBoundingRectProvider(null);
-      container.removeEventListener("scroll", onScroll);
-      resizeObserver.disconnect();
-      unsubscribeScrollRequest();
-    };
-  }, [viewportPlugin]);
-  return containerRef;
-}
-
-// src/preact/components/viewport.tsx
-var import_jsx_runtime = require("preact/jsx-runtime");
-function Viewport({ children, ...props }) {
-  const [viewportGap, setViewportGap] = (0, import_hooks2.useState)(0);
-  const viewportRef = useViewportRef();
-  const { provides: viewportProvides } = useViewportCapability();
-  (0, import_hooks2.useEffect)(() => {
-    if (viewportProvides) {
-      setViewportGap(viewportProvides.getViewportGap());
-    }
-  }, [viewportProvides]);
-  const { style, ...restProps } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    "div",
-    {
-      ...restProps,
-      ref: viewportRef,
-      style: {
-        ...typeof style === "object" ? style : {},
-        padding: `${viewportGap}px`
-      },
-      children
-    }
-  );
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Viewport,
-  useViewportCapability,
-  useViewportPlugin
-});
-//# sourceMappingURL=index.cjs.map
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("preact/jsx-runtime");require("preact");const t=require("preact/hooks"),r=require("@embedpdf/core/preact"),i=require("@embedpdf/plugin-viewport"),o=()=>r.usePlugin(i.ViewportPlugin.id),s=()=>r.useCapability(i.ViewportPlugin.id);function l(){const{plugin:e}=o(),r=t.useRef(null);return t.useLayoutEffect((()=>{if(!e)return;const t=r.current;if(!t)return;e.registerBoundingRectProvider((()=>{const e=t.getBoundingClientRect();return{origin:{x:e.left,y:e.top},size:{width:e.width,height:e.height}}}));const i=()=>{e.setViewportScrollMetrics({scrollTop:t.scrollTop,scrollLeft:t.scrollLeft})};t.addEventListener("scroll",i);const o=new ResizeObserver((()=>{e.setViewportResizeMetrics({width:t.offsetWidth,height:t.offsetHeight,clientWidth:t.clientWidth,clientHeight:t.clientHeight,scrollTop:t.scrollTop,scrollLeft:t.scrollLeft,scrollWidth:t.scrollWidth,scrollHeight:t.scrollHeight})}));o.observe(t);const s=e.onScrollRequest((({x:e,y:r,behavior:i="auto"})=>{requestAnimationFrame((()=>{t.scrollTo({left:e,top:r,behavior:i})}))}));return()=>{e.registerBoundingRectProvider(null),t.removeEventListener("scroll",i),o.disconnect(),s()}}),[e]),r}exports.Viewport=function({children:r,...i}){const[o,n]=t.useState(0),c=l(),{provides:u}=s();t.useEffect((()=>{u&&n(u.getViewportGap())}),[u]);const{style:p,...d}=i;return e.jsx("div",{...d,ref:c,style:{..."object"==typeof p?p:{},padding:`${o}px`},children:r})},exports.useViewportCapability=s,exports.useViewportPlugin=o,exports.useViewportRef=l;
+//# sourceMappingURL=index.cjs.map

package/dist/preact/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/preact/index.ts","../../src/preact/hooks/use-viewport.ts","../../src/preact/components/viewport.tsx","../../src/preact/hooks/use-viewport-ref.ts"],"sourcesContent":["export * from './hooks';\nexport * from './components';\n","import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { ViewportPlugin } from '@embedpdf/plugin-viewport';\n\nexport const useViewportPlugin = () => usePlugin<ViewportPlugin>(ViewportPlugin.id);\nexport const useViewportCapability = () => useCapability<ViewportPlugin>(ViewportPlugin.id);\n","/** @jsxImportSource preact */\nimport { ComponentChildren, JSX } from 'preact';\nimport { useEffect, useState } from 'preact/hooks';\n\nimport { useViewportCapability } from '../hooks';\nimport { useViewportRef } from '../hooks/use-viewport-ref';\n\ntype ViewportProps = JSX.HTMLAttributes<HTMLDivElement> & {\n  children: ComponentChildren;\n};\n\nexport function Viewport({ children, ...props }: ViewportProps) {\n  const [viewportGap, setViewportGap] = useState(0);\n  const viewportRef = useViewportRef();\n  const { provides: viewportProvides } = useViewportCapability();\n\n  useEffect(() => {\n    if (viewportProvides) {\n      setViewportGap(viewportProvides.getViewportGap());\n    }\n  }, [viewportProvides]);\n\n  const { style, ...restProps } = props;\n  return (\n    <div\n      {...restProps}\n      ref={viewportRef}\n      style={{\n        ...(typeof style === 'object' ? style : {}),\n        padding: `${viewportGap}px`,\n      }}\n    >\n      {children}\n    </div>\n  );\n}\n","import { Rect } from '@embedpdf/models';\nimport { useLayoutEffect, useRef } from 'preact/hooks';\n\nimport { useViewportPlugin } from './use-viewport';\n\nexport function useViewportRef() {\n  const { plugin: viewportPlugin } = useViewportPlugin();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!viewportPlugin) return;\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    /* ---------- live rect provider --------------------------------- */\n    const provideRect = (): Rect => {\n      const r = container.getBoundingClientRect();\n      return {\n        origin: { x: r.left, y: r.top },\n        size: { width: r.width, height: r.height },\n      };\n    };\n    viewportPlugin.registerBoundingRectProvider(provideRect);\n\n    // Example: On scroll, call setMetrics\n    const onScroll = () => {\n      viewportPlugin.setViewportScrollMetrics({\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n      });\n    };\n    container.addEventListener('scroll', onScroll);\n\n    // Example: On resize, call setMetrics\n    const resizeObserver = new ResizeObserver(() => {\n      viewportPlugin.setViewportResizeMetrics({\n        width: container.offsetWidth,\n        height: container.offsetHeight,\n        clientWidth: container.clientWidth,\n        clientHeight: container.clientHeight,\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n        scrollWidth: container.scrollWidth,\n        scrollHeight: container.scrollHeight,\n      });\n    });\n    resizeObserver.observe(container);\n\n    const unsubscribeScrollRequest = viewportPlugin.onScrollRequest(\n      ({ x, y, behavior = 'auto' }) => {\n        requestAnimationFrame(() => {\n          container.scrollTo({ left: x, top: y, behavior });\n        });\n      },\n    );\n\n    // Cleanup\n    return () => {\n      viewportPlugin.registerBoundingRectProvider(null);\n      container.removeEventListener('scroll', onScroll);\n      resizeObserver.disconnect();\n      unsubscribeScrollRequest();\n    };\n  }, [viewportPlugin]);\n\n  // Return the ref so your React code can attach it to a div\n  return containerRef;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAAyC;AACzC,6BAA+B;AAExB,IAAM,oBAAoB,UAAM,yBAA0B,sCAAe,EAAE;AAC3E,IAAM,wBAAwB,UAAM,6BAA8B,sCAAe,EAAE;;;ACF1F,IAAAA,gBAAoC;;;ACDpC,mBAAwC;AAIjC,SAAS,iBAAiB;AAC/B,QAAM,EAAE,QAAQ,eAAe,IAAI,kBAAkB;AACrD,QAAM,mBAAe,qBAAuB,IAAI;AAEhD,oCAAgB,MAAM;AACpB,QAAI,CAAC,eAAgB;AAErB,UAAM,YAAY,aAAa;AAC/B,QAAI,CAAC,UAAW;AAGhB,UAAM,cAAc,MAAY;AAC9B,YAAM,IAAI,UAAU,sBAAsB;AAC1C,aAAO;AAAA,QACL,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,EAAE,IAAI;AAAA,QAC9B,MAAM,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,OAAO;AAAA,MAC3C;AAAA,IACF;AACA,mBAAe,6BAA6B,WAAW;AAGvD,UAAM,WAAW,MAAM;AACrB,qBAAe,yBAAyB;AAAA,QACtC,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AACA,cAAU,iBAAiB,UAAU,QAAQ;AAG7C,UAAM,iBAAiB,IAAI,eAAe,MAAM;AAC9C,qBAAe,yBAAyB;AAAA,QACtC,OAAO,UAAU;AAAA,QACjB,QAAQ,UAAU;AAAA,QAClB,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,QACxB,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,QACtB,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,MAC1B,CAAC;AAAA,IACH,CAAC;AACD,mBAAe,QAAQ,SAAS;AAEhC,UAAM,2BAA2B,eAAe;AAAA,MAC9C,CAAC,EAAE,GAAG,GAAG,WAAW,OAAO,MAAM;AAC/B,8BAAsB,MAAM;AAC1B,oBAAU,SAAS,EAAE,MAAM,GAAG,KAAK,GAAG,SAAS,CAAC;AAAA,QAClD,CAAC;AAAA,MACH;AAAA,IACF;AAGA,WAAO,MAAM;AACX,qBAAe,6BAA6B,IAAI;AAChD,gBAAU,oBAAoB,UAAU,QAAQ;AAChD,qBAAe,WAAW;AAC1B,+BAAyB;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,cAAc,CAAC;AAGnB,SAAO;AACT;;;AD5CI;AAbG,SAAS,SAAS,EAAE,UAAU,GAAG,MAAM,GAAkB;AAC9D,QAAM,CAAC,aAAa,cAAc,QAAI,wBAAS,CAAC;AAChD,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,UAAU,iBAAiB,IAAI,sBAAsB;AAE7D,+BAAU,MAAM;AACd,QAAI,kBAAkB;AACpB,qBAAe,iBAAiB,eAAe,CAAC;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,gBAAgB,CAAC;AAErB,QAAM,EAAE,OAAO,GAAG,UAAU,IAAI;AAChC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,OAAO;AAAA,QACL,GAAI,OAAO,UAAU,WAAW,QAAQ,CAAC;AAAA,QACzC,SAAS,GAAG,WAAW;AAAA,MACzB;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":["import_hooks"]}
+{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-viewport.ts","../../src/shared/hooks/use-viewport-ref.ts","../../src/shared/components/viewport.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { ViewportPlugin } from '@embedpdf/plugin-viewport';\n\nexport const useViewportPlugin = () => usePlugin<ViewportPlugin>(ViewportPlugin.id);\nexport const useViewportCapability = () => useCapability<ViewportPlugin>(ViewportPlugin.id);\n","import { Rect } from '@embedpdf/models';\nimport { useLayoutEffect, useRef } from '@framework';\n\nimport { useViewportPlugin } from './use-viewport';\n\nexport function useViewportRef() {\n  const { plugin: viewportPlugin } = useViewportPlugin();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!viewportPlugin) return;\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    /* ---------- live rect provider --------------------------------- */\n    const provideRect = (): Rect => {\n      const r = container.getBoundingClientRect();\n      return {\n        origin: { x: r.left, y: r.top },\n        size: { width: r.width, height: r.height },\n      };\n    };\n    viewportPlugin.registerBoundingRectProvider(provideRect);\n\n    // Example: On scroll, call setMetrics\n    const onScroll = () => {\n      viewportPlugin.setViewportScrollMetrics({\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n      });\n    };\n    container.addEventListener('scroll', onScroll);\n\n    // Example: On resize, call setMetrics\n    const resizeObserver = new ResizeObserver(() => {\n      viewportPlugin.setViewportResizeMetrics({\n        width: container.offsetWidth,\n        height: container.offsetHeight,\n        clientWidth: container.clientWidth,\n        clientHeight: container.clientHeight,\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n        scrollWidth: container.scrollWidth,\n        scrollHeight: container.scrollHeight,\n      });\n    });\n    resizeObserver.observe(container);\n\n    const unsubscribeScrollRequest = viewportPlugin.onScrollRequest(\n      ({ x, y, behavior = 'auto' }) => {\n        requestAnimationFrame(() => {\n          container.scrollTo({ left: x, top: y, behavior });\n        });\n      },\n    );\n\n    // Cleanup\n    return () => {\n      viewportPlugin.registerBoundingRectProvider(null);\n      container.removeEventListener('scroll', onScroll);\n      resizeObserver.disconnect();\n      unsubscribeScrollRequest();\n    };\n  }, [viewportPlugin]);\n\n  // Return the ref so your React code can attach it to a div\n  return containerRef;\n}\n","import { ReactNode, useEffect, useState, HTMLAttributes } from '@framework';\n\nimport { useViewportCapability } from '../hooks';\nimport { useViewportRef } from '../hooks/use-viewport-ref';\n\ntype ViewportProps = HTMLAttributes<HTMLDivElement> & {\n  children: ReactNode;\n};\n\nexport function Viewport({ children, ...props }: ViewportProps) {\n  const [viewportGap, setViewportGap] = useState(0);\n  const viewportRef = useViewportRef();\n  const { provides: viewportProvides } = useViewportCapability();\n\n  useEffect(() => {\n    if (viewportProvides) {\n      setViewportGap(viewportProvides.getViewportGap());\n    }\n  }, [viewportProvides]);\n\n  const { style, ...restProps } = props;\n  return (\n    <div\n      {...restProps}\n      ref={viewportRef}\n      style={{\n        ...(typeof style === 'object' ? style : {}),\n        padding: `${viewportGap}px`,\n      }}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["useViewportPlugin","usePlugin","ViewportPlugin","id","useViewportCapability","useCapability","useViewportRef","plugin","viewportPlugin","containerRef","useRef","useLayoutEffect","container","current","registerBoundingRectProvider","r","getBoundingClientRect","origin","x","left","y","top","size","width","height","onScroll","setViewportScrollMetrics","scrollTop","scrollLeft","addEventListener","resizeObserver","ResizeObserver","setViewportResizeMetrics","offsetWidth","offsetHeight","clientWidth","clientHeight","scrollWidth","scrollHeight","observe","unsubscribeScrollRequest","onScrollRequest","behavior","requestAnimationFrame","scrollTo","removeEventListener","disconnect","children","props","viewportGap","setViewportGap","useState","viewportRef","provides","viewportProvides","useEffect","getViewportGap","style","restProps","jsxRuntime","jsx","ref","padding"],"mappings":"kPAGaA,EAAoB,IAAMC,YAA0BC,EAAAA,eAAeC,IACnEC,EAAwB,IAAMC,gBAA8BH,EAAAA,eAAeC,ICCjF,SAASG,IACd,MAAQC,OAAQC,GAAmBR,IAC7BS,EAAeC,SAAuB,MA4DrC,OA1DPC,EAAAA,iBAAgB,KACd,IAAKH,EAAgB,OAErB,MAAMI,EAAYH,EAAaI,QAC/B,IAAKD,EAAW,OAUhBJ,EAAeM,8BAPK,KACZ,MAAAC,EAAIH,EAAUI,wBACb,MAAA,CACLC,OAAQ,CAAEC,EAAGH,EAAEI,KAAMC,EAAGL,EAAEM,KAC1BC,KAAM,CAAEC,MAAOR,EAAEQ,MAAOC,OAAQT,EAAES,QACpC,IAKF,MAAMC,EAAW,KACfjB,EAAekB,yBAAyB,CACtCC,UAAWf,EAAUe,UACrBC,WAAYhB,EAAUgB,YACvB,EAEOhB,EAAAiB,iBAAiB,SAAUJ,GAG/B,MAAAK,EAAiB,IAAIC,gBAAe,KACxCvB,EAAewB,yBAAyB,CACtCT,MAAOX,EAAUqB,YACjBT,OAAQZ,EAAUsB,aAClBC,YAAavB,EAAUuB,YACvBC,aAAcxB,EAAUwB,aACxBT,UAAWf,EAAUe,UACrBC,WAAYhB,EAAUgB,WACtBS,YAAazB,EAAUyB,YACvBC,aAAc1B,EAAU0B,cACzB,IAEHR,EAAeS,QAAQ3B,GAEvB,MAAM4B,EAA2BhC,EAAeiC,iBAC9C,EAAGvB,IAAGE,IAAGsB,WAAW,WAClBC,uBAAsB,KACpB/B,EAAUgC,SAAS,CAAEzB,KAAMD,EAAGG,IAAKD,EAAGsB,YAAU,GACjD,IAKL,MAAO,KACLlC,EAAeM,6BAA6B,MAClCF,EAAAiC,oBAAoB,SAAUpB,GACxCK,EAAegB,aACUN,GAAA,CAC3B,GACC,CAAChC,IAGGC,CACT,kBC3DO,UAAkBsC,SAAEA,KAAaC,IACtC,MAAOC,EAAaC,GAAkBC,EAAAA,SAAS,GACzCC,EAAc9C,KACZ+C,SAAUC,GAAqBlD,IAEvCmD,EAAAA,WAAU,KACJD,GACaJ,EAAAI,EAAiBE,iBAAgB,GAEjD,CAACF,IAEJ,MAAMG,MAAEA,KAAUC,GAAcV,EAE9B,OAAAW,EAAAC,IAAC,MAAA,IACKF,EACJG,IAAKT,EACLK,MAAO,IACgB,iBAAVA,EAAqBA,EAAQ,CAAC,EACzCK,QAAS,GAAGb,OAGbF,YAGP"}

package/dist/preact/index.d.ts

@@ -1,23 +1 @@
-import * as _embedpdf_plugin_viewport from '@embedpdf/plugin-viewport';
-import { ViewportPlugin } from '@embedpdf/plugin-viewport';
-import { JSX, ComponentChildren } from 'preact';
-
-declare const useViewportPlugin: () => {
-    plugin: ViewportPlugin | null;
-    isLoading: boolean;
-    ready: Promise<void>;
-};
-declare const useViewportCapability: () => {
-    provides: Readonly<_embedpdf_plugin_viewport.ViewportCapability> | null;
-    isLoading: boolean;
-    ready: Promise<void>;
-};
-
-/** @jsxImportSource preact */
-
-type ViewportProps = JSX.HTMLAttributes<HTMLDivElement> & {
-    children: ComponentChildren;
-};
-declare function Viewport({ children, ...props }: ViewportProps): JSX.Element;
-
-export { Viewport, useViewportCapability, useViewportPlugin };
+export * from '../shared-preact';

package/dist/preact/index.js

@@ -1,14 +1,10 @@
-// src/preact/hooks/use-viewport.ts
-import { useCapability, usePlugin } from "@embedpdf/core/preact";
+import { jsx } from "preact/jsx-runtime";
+import "preact";
+import { useRef, useLayoutEffect, useState, useEffect } from "preact/hooks";
+import { usePlugin, useCapability } from "@embedpdf/core/preact";
 import { ViewportPlugin } from "@embedpdf/plugin-viewport";
-var useViewportPlugin = () => usePlugin(ViewportPlugin.id);
-var useViewportCapability = () => useCapability(ViewportPlugin.id);
-
-// src/preact/components/viewport.tsx
-import { useEffect, useState } from "preact/hooks";
-
-// src/preact/hooks/use-viewport-ref.ts
-import { useLayoutEffect, useRef } from "preact/hooks";
+const useViewportPlugin = () => usePlugin(ViewportPlugin.id);
+const useViewportCapability = () => useCapability(ViewportPlugin.id);
 function useViewportRef() {
   const { plugin: viewportPlugin } = useViewportPlugin();
   const containerRef = useRef(null);
@@ -60,9 +56,6 @@ function useViewportRef() {
   }, [viewportPlugin]);
   return containerRef;
 }
-
-// src/preact/components/viewport.tsx
-import { jsx } from "preact/jsx-runtime";
 function Viewport({ children, ...props }) {
   const [viewportGap, setViewportGap] = useState(0);
   const viewportRef = useViewportRef();
@@ -89,6 +82,7 @@ function Viewport({ children, ...props }) {
 export {
   Viewport,
   useViewportCapability,
-  useViewportPlugin
+  useViewportPlugin,
+  useViewportRef
 };
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/preact/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/preact/hooks/use-viewport.ts","../../src/preact/components/viewport.tsx","../../src/preact/hooks/use-viewport-ref.ts"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { ViewportPlugin } from '@embedpdf/plugin-viewport';\n\nexport const useViewportPlugin = () => usePlugin<ViewportPlugin>(ViewportPlugin.id);\nexport const useViewportCapability = () => useCapability<ViewportPlugin>(ViewportPlugin.id);\n","/** @jsxImportSource preact */\nimport { ComponentChildren, JSX } from 'preact';\nimport { useEffect, useState } from 'preact/hooks';\n\nimport { useViewportCapability } from '../hooks';\nimport { useViewportRef } from '../hooks/use-viewport-ref';\n\ntype ViewportProps = JSX.HTMLAttributes<HTMLDivElement> & {\n  children: ComponentChildren;\n};\n\nexport function Viewport({ children, ...props }: ViewportProps) {\n  const [viewportGap, setViewportGap] = useState(0);\n  const viewportRef = useViewportRef();\n  const { provides: viewportProvides } = useViewportCapability();\n\n  useEffect(() => {\n    if (viewportProvides) {\n      setViewportGap(viewportProvides.getViewportGap());\n    }\n  }, [viewportProvides]);\n\n  const { style, ...restProps } = props;\n  return (\n    <div\n      {...restProps}\n      ref={viewportRef}\n      style={{\n        ...(typeof style === 'object' ? style : {}),\n        padding: `${viewportGap}px`,\n      }}\n    >\n      {children}\n    </div>\n  );\n}\n","import { Rect } from '@embedpdf/models';\nimport { useLayoutEffect, useRef } from 'preact/hooks';\n\nimport { useViewportPlugin } from './use-viewport';\n\nexport function useViewportRef() {\n  const { plugin: viewportPlugin } = useViewportPlugin();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!viewportPlugin) return;\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    /* ---------- live rect provider --------------------------------- */\n    const provideRect = (): Rect => {\n      const r = container.getBoundingClientRect();\n      return {\n        origin: { x: r.left, y: r.top },\n        size: { width: r.width, height: r.height },\n      };\n    };\n    viewportPlugin.registerBoundingRectProvider(provideRect);\n\n    // Example: On scroll, call setMetrics\n    const onScroll = () => {\n      viewportPlugin.setViewportScrollMetrics({\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n      });\n    };\n    container.addEventListener('scroll', onScroll);\n\n    // Example: On resize, call setMetrics\n    const resizeObserver = new ResizeObserver(() => {\n      viewportPlugin.setViewportResizeMetrics({\n        width: container.offsetWidth,\n        height: container.offsetHeight,\n        clientWidth: container.clientWidth,\n        clientHeight: container.clientHeight,\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n        scrollWidth: container.scrollWidth,\n        scrollHeight: container.scrollHeight,\n      });\n    });\n    resizeObserver.observe(container);\n\n    const unsubscribeScrollRequest = viewportPlugin.onScrollRequest(\n      ({ x, y, behavior = 'auto' }) => {\n        requestAnimationFrame(() => {\n          container.scrollTo({ left: x, top: y, behavior });\n        });\n      },\n    );\n\n    // Cleanup\n    return () => {\n      viewportPlugin.registerBoundingRectProvider(null);\n      container.removeEventListener('scroll', onScroll);\n      resizeObserver.disconnect();\n      unsubscribeScrollRequest();\n    };\n  }, [viewportPlugin]);\n\n  // Return the ref so your React code can attach it to a div\n  return containerRef;\n}\n"],"mappings":";AAAA,SAAS,eAAe,iBAAiB;AACzC,SAAS,sBAAsB;AAExB,IAAM,oBAAoB,MAAM,UAA0B,eAAe,EAAE;AAC3E,IAAM,wBAAwB,MAAM,cAA8B,eAAe,EAAE;;;ACF1F,SAAS,WAAW,gBAAgB;;;ACDpC,SAAS,iBAAiB,cAAc;AAIjC,SAAS,iBAAiB;AAC/B,QAAM,EAAE,QAAQ,eAAe,IAAI,kBAAkB;AACrD,QAAM,eAAe,OAAuB,IAAI;AAEhD,kBAAgB,MAAM;AACpB,QAAI,CAAC,eAAgB;AAErB,UAAM,YAAY,aAAa;AAC/B,QAAI,CAAC,UAAW;AAGhB,UAAM,cAAc,MAAY;AAC9B,YAAM,IAAI,UAAU,sBAAsB;AAC1C,aAAO;AAAA,QACL,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,EAAE,IAAI;AAAA,QAC9B,MAAM,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,OAAO;AAAA,MAC3C;AAAA,IACF;AACA,mBAAe,6BAA6B,WAAW;AAGvD,UAAM,WAAW,MAAM;AACrB,qBAAe,yBAAyB;AAAA,QACtC,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AACA,cAAU,iBAAiB,UAAU,QAAQ;AAG7C,UAAM,iBAAiB,IAAI,eAAe,MAAM;AAC9C,qBAAe,yBAAyB;AAAA,QACtC,OAAO,UAAU;AAAA,QACjB,QAAQ,UAAU;AAAA,QAClB,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,QACxB,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,QACtB,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,MAC1B,CAAC;AAAA,IACH,CAAC;AACD,mBAAe,QAAQ,SAAS;AAEhC,UAAM,2BAA2B,eAAe;AAAA,MAC9C,CAAC,EAAE,GAAG,GAAG,WAAW,OAAO,MAAM;AAC/B,8BAAsB,MAAM;AAC1B,oBAAU,SAAS,EAAE,MAAM,GAAG,KAAK,GAAG,SAAS,CAAC;AAAA,QAClD,CAAC;AAAA,MACH;AAAA,IACF;AAGA,WAAO,MAAM;AACX,qBAAe,6BAA6B,IAAI;AAChD,gBAAU,oBAAoB,UAAU,QAAQ;AAChD,qBAAe,WAAW;AAC1B,+BAAyB;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,cAAc,CAAC;AAGnB,SAAO;AACT;;;AD5CI;AAbG,SAAS,SAAS,EAAE,UAAU,GAAG,MAAM,GAAkB;AAC9D,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,CAAC;AAChD,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,UAAU,iBAAiB,IAAI,sBAAsB;AAE7D,YAAU,MAAM;AACd,QAAI,kBAAkB;AACpB,qBAAe,iBAAiB,eAAe,CAAC;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,gBAAgB,CAAC;AAErB,QAAM,EAAE,OAAO,GAAG,UAAU,IAAI;AAChC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,OAAO;AAAA,QACL,GAAI,OAAO,UAAU,WAAW,QAAQ,CAAC;AAAA,QACzC,SAAS,GAAG,WAAW;AAAA,MACzB;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":[]}
+{"version":3,"file":"index.js","sources":["../../src/shared/hooks/use-viewport.ts","../../src/shared/hooks/use-viewport-ref.ts","../../src/shared/components/viewport.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { ViewportPlugin } from '@embedpdf/plugin-viewport';\n\nexport const useViewportPlugin = () => usePlugin<ViewportPlugin>(ViewportPlugin.id);\nexport const useViewportCapability = () => useCapability<ViewportPlugin>(ViewportPlugin.id);\n","import { Rect } from '@embedpdf/models';\nimport { useLayoutEffect, useRef } from '@framework';\n\nimport { useViewportPlugin } from './use-viewport';\n\nexport function useViewportRef() {\n  const { plugin: viewportPlugin } = useViewportPlugin();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!viewportPlugin) return;\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    /* ---------- live rect provider --------------------------------- */\n    const provideRect = (): Rect => {\n      const r = container.getBoundingClientRect();\n      return {\n        origin: { x: r.left, y: r.top },\n        size: { width: r.width, height: r.height },\n      };\n    };\n    viewportPlugin.registerBoundingRectProvider(provideRect);\n\n    // Example: On scroll, call setMetrics\n    const onScroll = () => {\n      viewportPlugin.setViewportScrollMetrics({\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n      });\n    };\n    container.addEventListener('scroll', onScroll);\n\n    // Example: On resize, call setMetrics\n    const resizeObserver = new ResizeObserver(() => {\n      viewportPlugin.setViewportResizeMetrics({\n        width: container.offsetWidth,\n        height: container.offsetHeight,\n        clientWidth: container.clientWidth,\n        clientHeight: container.clientHeight,\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n        scrollWidth: container.scrollWidth,\n        scrollHeight: container.scrollHeight,\n      });\n    });\n    resizeObserver.observe(container);\n\n    const unsubscribeScrollRequest = viewportPlugin.onScrollRequest(\n      ({ x, y, behavior = 'auto' }) => {\n        requestAnimationFrame(() => {\n          container.scrollTo({ left: x, top: y, behavior });\n        });\n      },\n    );\n\n    // Cleanup\n    return () => {\n      viewportPlugin.registerBoundingRectProvider(null);\n      container.removeEventListener('scroll', onScroll);\n      resizeObserver.disconnect();\n      unsubscribeScrollRequest();\n    };\n  }, [viewportPlugin]);\n\n  // Return the ref so your React code can attach it to a div\n  return containerRef;\n}\n","import { ReactNode, useEffect, useState, HTMLAttributes } from '@framework';\n\nimport { useViewportCapability } from '../hooks';\nimport { useViewportRef } from '../hooks/use-viewport-ref';\n\ntype ViewportProps = HTMLAttributes<HTMLDivElement> & {\n  children: ReactNode;\n};\n\nexport function Viewport({ children, ...props }: ViewportProps) {\n  const [viewportGap, setViewportGap] = useState(0);\n  const viewportRef = useViewportRef();\n  const { provides: viewportProvides } = useViewportCapability();\n\n  useEffect(() => {\n    if (viewportProvides) {\n      setViewportGap(viewportProvides.getViewportGap());\n    }\n  }, [viewportProvides]);\n\n  const { style, ...restProps } = props;\n  return (\n    <div\n      {...restProps}\n      ref={viewportRef}\n      style={{\n        ...(typeof style === 'object' ? style : {}),\n        padding: `${viewportGap}px`,\n      }}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;AAGO,MAAM,oBAAoB,MAAM,UAA0B,eAAe,EAAE;AAC3E,MAAM,wBAAwB,MAAM,cAA8B,eAAe,EAAE;ACCnF,SAAS,iBAAiB;AAC/B,QAAM,EAAE,QAAQ,eAAe,IAAI,kBAAkB;AAC/C,QAAA,eAAe,OAAuB,IAAI;AAEhD,kBAAgB,MAAM;AACpB,QAAI,CAAC,eAAgB;AAErB,UAAM,YAAY,aAAa;AAC/B,QAAI,CAAC,UAAW;AAGhB,UAAM,cAAc,MAAY;AACxB,YAAA,IAAI,UAAU,sBAAsB;AACnC,aAAA;AAAA,QACL,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,EAAE,IAAI;AAAA,QAC9B,MAAM,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,OAAO;AAAA,MAC3C;AAAA,IACF;AACA,mBAAe,6BAA6B,WAAW;AAGvD,UAAM,WAAW,MAAM;AACrB,qBAAe,yBAAyB;AAAA,QACtC,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,MAAA,CACvB;AAAA,IACH;AACU,cAAA,iBAAiB,UAAU,QAAQ;AAGvC,UAAA,iBAAiB,IAAI,eAAe,MAAM;AAC9C,qBAAe,yBAAyB;AAAA,QACtC,OAAO,UAAU;AAAA,QACjB,QAAQ,UAAU;AAAA,QAClB,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,QACxB,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,QACtB,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,MAAA,CACzB;AAAA,IAAA,CACF;AACD,mBAAe,QAAQ,SAAS;AAEhC,UAAM,2BAA2B,eAAe;AAAA,MAC9C,CAAC,EAAE,GAAG,GAAG,WAAW,aAAa;AAC/B,8BAAsB,MAAM;AAC1B,oBAAU,SAAS,EAAE,MAAM,GAAG,KAAK,GAAG,UAAU;AAAA,QAAA,CACjD;AAAA,MAAA;AAAA,IAEL;AAGA,WAAO,MAAM;AACX,qBAAe,6BAA6B,IAAI;AACtC,gBAAA,oBAAoB,UAAU,QAAQ;AAChD,qBAAe,WAAW;AACD,+BAAA;AAAA,IAC3B;AAAA,EAAA,GACC,CAAC,cAAc,CAAC;AAGZ,SAAA;AACT;AC3DO,SAAS,SAAS,EAAE,UAAU,GAAG,SAAwB;AAC9D,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,CAAC;AAChD,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,UAAU,iBAAiB,IAAI,sBAAsB;AAE7D,YAAU,MAAM;AACd,QAAI,kBAAkB;AACL,qBAAA,iBAAiB,gBAAgB;AAAA,IAAA;AAAA,EAClD,GACC,CAAC,gBAAgB,CAAC;AAErB,QAAM,EAAE,OAAO,GAAG,UAAA,IAAc;AAE9B,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,OAAO;AAAA,QACL,GAAI,OAAO,UAAU,WAAW,QAAQ,CAAC;AAAA,QACzC,SAAS,GAAG,WAAW;AAAA,MACzB;AAAA,MAEC;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/react/adapter.d.ts

@@ -0,0 +1,2 @@
+export { Fragment, useEffect, useRef, useState, useCallback, useMemo, useLayoutEffect, } from 'react';
+export type { ReactNode, HTMLAttributes, CSSProperties } from 'react';

package/dist/react/core.d.ts

@@ -0,0 +1 @@
+export * from '@embedpdf/core/react';

package/dist/react/index.cjs

@@ -1,125 +1,2 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/react/index.ts
-var react_exports = {};
-__export(react_exports, {
-  Viewport: () => Viewport,
-  useViewportCapability: () => useViewportCapability,
-  useViewportPlugin: () => useViewportPlugin,
-  useViewportRef: () => useViewportRef
-});
-module.exports = __toCommonJS(react_exports);
-
-// src/react/components/viewport.tsx
-var import_react3 = require("react");
-
-// src/react/hooks/use-viewport.ts
-var import_react = require("@embedpdf/core/react");
-var import_plugin_viewport = require("@embedpdf/plugin-viewport");
-var useViewportPlugin = () => (0, import_react.usePlugin)(import_plugin_viewport.ViewportPlugin.id);
-var useViewportCapability = () => (0, import_react.useCapability)(import_plugin_viewport.ViewportPlugin.id);
-
-// src/react/hooks/use-viewport-ref.ts
-var import_react2 = require("react");
-function useViewportRef() {
-  const { plugin: viewportPlugin } = useViewportPlugin();
-  const containerRef = (0, import_react2.useRef)(null);
-  (0, import_react2.useLayoutEffect)(() => {
-    if (!viewportPlugin) return;
-    const container = containerRef.current;
-    if (!container) return;
-    const provideRect = () => {
-      const r = container.getBoundingClientRect();
-      return {
-        origin: { x: r.left, y: r.top },
-        size: { width: r.width, height: r.height }
-      };
-    };
-    viewportPlugin.registerBoundingRectProvider(provideRect);
-    const onScroll = () => {
-      viewportPlugin.setViewportScrollMetrics({
-        scrollTop: container.scrollTop,
-        scrollLeft: container.scrollLeft
-      });
-    };
-    container.addEventListener("scroll", onScroll);
-    const resizeObserver = new ResizeObserver(() => {
-      viewportPlugin.setViewportResizeMetrics({
-        width: container.offsetWidth,
-        height: container.offsetHeight,
-        clientWidth: container.clientWidth,
-        clientHeight: container.clientHeight,
-        scrollTop: container.scrollTop,
-        scrollLeft: container.scrollLeft,
-        scrollWidth: container.scrollWidth,
-        scrollHeight: container.scrollHeight
-      });
-    });
-    resizeObserver.observe(container);
-    const unsubscribeScrollRequest = viewportPlugin.onScrollRequest(
-      ({ x, y, behavior = "auto" }) => {
-        requestAnimationFrame(() => {
-          container.scrollTo({ left: x, top: y, behavior });
-        });
-      }
-    );
-    return () => {
-      viewportPlugin.registerBoundingRectProvider(null);
-      container.removeEventListener("scroll", onScroll);
-      resizeObserver.disconnect();
-      unsubscribeScrollRequest();
-    };
-  }, [viewportPlugin]);
-  return containerRef;
-}
-
-// src/react/components/viewport.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-function Viewport({ children, ...props }) {
-  const [viewportGap, setViewportGap] = (0, import_react3.useState)(0);
-  const viewportRef = useViewportRef();
-  const { provides: viewportProvides } = useViewportCapability();
-  (0, import_react3.useEffect)(() => {
-    if (viewportProvides) {
-      setViewportGap(viewportProvides.getViewportGap());
-    }
-  }, [viewportProvides]);
-  const { style, ...restProps } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    "div",
-    {
-      ...restProps,
-      ref: viewportRef,
-      style: {
-        ...typeof style === "object" ? style : {},
-        padding: `${viewportGap}px`
-      },
-      children
-    }
-  );
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Viewport,
-  useViewportCapability,
-  useViewportPlugin,
-  useViewportRef
-});
-//# sourceMappingURL=index.cjs.map
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),r=require("@embedpdf/core/react"),i=require("@embedpdf/plugin-viewport"),o=()=>r.usePlugin(i.ViewportPlugin.id),s=()=>r.useCapability(i.ViewportPlugin.id);function l(){const{plugin:e}=o(),r=t.useRef(null);return t.useLayoutEffect((()=>{if(!e)return;const t=r.current;if(!t)return;e.registerBoundingRectProvider((()=>{const e=t.getBoundingClientRect();return{origin:{x:e.left,y:e.top},size:{width:e.width,height:e.height}}}));const i=()=>{e.setViewportScrollMetrics({scrollTop:t.scrollTop,scrollLeft:t.scrollLeft})};t.addEventListener("scroll",i);const o=new ResizeObserver((()=>{e.setViewportResizeMetrics({width:t.offsetWidth,height:t.offsetHeight,clientWidth:t.clientWidth,clientHeight:t.clientHeight,scrollTop:t.scrollTop,scrollLeft:t.scrollLeft,scrollWidth:t.scrollWidth,scrollHeight:t.scrollHeight})}));o.observe(t);const s=e.onScrollRequest((({x:e,y:r,behavior:i="auto"})=>{requestAnimationFrame((()=>{t.scrollTo({left:e,top:r,behavior:i})}))}));return()=>{e.registerBoundingRectProvider(null),t.removeEventListener("scroll",i),o.disconnect(),s()}}),[e]),r}exports.Viewport=function({children:r,...i}){const[o,n]=t.useState(0),c=l(),{provides:u}=s();t.useEffect((()=>{u&&n(u.getViewportGap())}),[u]);const{style:p,...d}=i;return e.jsx("div",{...d,ref:c,style:{..."object"==typeof p?p:{},padding:`${o}px`},children:r})},exports.useViewportCapability=s,exports.useViewportPlugin=o,exports.useViewportRef=l;
+//# sourceMappingURL=index.cjs.map

package/dist/react/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/react/index.ts","../../src/react/components/viewport.tsx","../../src/react/hooks/use-viewport.ts","../../src/react/hooks/use-viewport-ref.ts"],"sourcesContent":["export * from './components';\nexport * from './hooks';\n","import React, { ReactNode, useEffect, useState } from 'react';\n\nimport { useViewportCapability } from '../hooks';\nimport { useViewportRef } from '../hooks/use-viewport-ref';\n\ntype ViewportProps = React.HTMLAttributes<HTMLDivElement> & {\n  children: ReactNode;\n};\n\nexport function Viewport({ children, ...props }: ViewportProps) {\n  const [viewportGap, setViewportGap] = useState(0);\n  const viewportRef = useViewportRef();\n  const { provides: viewportProvides } = useViewportCapability();\n\n  useEffect(() => {\n    if (viewportProvides) {\n      setViewportGap(viewportProvides.getViewportGap());\n    }\n  }, [viewportProvides]);\n\n  const { style, ...restProps } = props;\n  return (\n    <div\n      {...restProps}\n      ref={viewportRef}\n      style={{\n        ...(typeof style === 'object' ? style : {}),\n        padding: `${viewportGap}px`,\n      }}\n    >\n      {children}\n    </div>\n  );\n}\n","import { useCapability, usePlugin } from '@embedpdf/core/react';\nimport { ViewportPlugin } from '@embedpdf/plugin-viewport';\n\nexport const useViewportPlugin = () => usePlugin<ViewportPlugin>(ViewportPlugin.id);\nexport const useViewportCapability = () => useCapability<ViewportPlugin>(ViewportPlugin.id);\n","import { Rect } from '@embedpdf/models';\nimport { useLayoutEffect, useRef } from 'react';\n\nimport { useViewportPlugin } from './use-viewport';\n\nexport function useViewportRef() {\n  const { plugin: viewportPlugin } = useViewportPlugin();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!viewportPlugin) return;\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    /* ---------- live rect provider --------------------------------- */\n    const provideRect = (): Rect => {\n      const r = container.getBoundingClientRect();\n      return {\n        origin: { x: r.left, y: r.top },\n        size: { width: r.width, height: r.height },\n      };\n    };\n    viewportPlugin.registerBoundingRectProvider(provideRect);\n\n    // Example: On scroll, call setMetrics\n    const onScroll = () => {\n      viewportPlugin.setViewportScrollMetrics({\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n      });\n    };\n    container.addEventListener('scroll', onScroll);\n\n    // Example: On resize, call setMetrics\n    const resizeObserver = new ResizeObserver(() => {\n      viewportPlugin.setViewportResizeMetrics({\n        width: container.offsetWidth,\n        height: container.offsetHeight,\n        clientWidth: container.clientWidth,\n        clientHeight: container.clientHeight,\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n        scrollWidth: container.scrollWidth,\n        scrollHeight: container.scrollHeight,\n      });\n    });\n    resizeObserver.observe(container);\n\n    const unsubscribeScrollRequest = viewportPlugin.onScrollRequest(\n      ({ x, y, behavior = 'auto' }) => {\n        requestAnimationFrame(() => {\n          container.scrollTo({ left: x, top: y, behavior });\n        });\n      },\n    );\n\n    // Cleanup\n    return () => {\n      viewportPlugin.registerBoundingRectProvider(null);\n      container.removeEventListener('scroll', onScroll);\n      resizeObserver.disconnect();\n      unsubscribeScrollRequest();\n    };\n  }, [viewportPlugin]);\n\n  // Return the ref so your React code can attach it to a div\n  return containerRef;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,gBAAsD;;;ACAtD,mBAAyC;AACzC,6BAA+B;AAExB,IAAM,oBAAoB,UAAM,wBAA0B,sCAAe,EAAE;AAC3E,IAAM,wBAAwB,UAAM,4BAA8B,sCAAe,EAAE;;;ACH1F,IAAAC,gBAAwC;AAIjC,SAAS,iBAAiB;AAC/B,QAAM,EAAE,QAAQ,eAAe,IAAI,kBAAkB;AACrD,QAAM,mBAAe,sBAAuB,IAAI;AAEhD,qCAAgB,MAAM;AACpB,QAAI,CAAC,eAAgB;AAErB,UAAM,YAAY,aAAa;AAC/B,QAAI,CAAC,UAAW;AAGhB,UAAM,cAAc,MAAY;AAC9B,YAAM,IAAI,UAAU,sBAAsB;AAC1C,aAAO;AAAA,QACL,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,EAAE,IAAI;AAAA,QAC9B,MAAM,EAAE,OAAO,EAAE,OAAO,QAAQ,EAAE,OAAO;AAAA,MAC3C;AAAA,IACF;AACA,mBAAe,6BAA6B,WAAW;AAGvD,UAAM,WAAW,MAAM;AACrB,qBAAe,yBAAyB;AAAA,QACtC,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AACA,cAAU,iBAAiB,UAAU,QAAQ;AAG7C,UAAM,iBAAiB,IAAI,eAAe,MAAM;AAC9C,qBAAe,yBAAyB;AAAA,QACtC,OAAO,UAAU;AAAA,QACjB,QAAQ,UAAU;AAAA,QAClB,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,QACxB,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,QACtB,aAAa,UAAU;AAAA,QACvB,cAAc,UAAU;AAAA,MAC1B,CAAC;AAAA,IACH,CAAC;AACD,mBAAe,QAAQ,SAAS;AAEhC,UAAM,2BAA2B,eAAe;AAAA,MAC9C,CAAC,EAAE,GAAG,GAAG,WAAW,OAAO,MAAM;AAC/B,8BAAsB,MAAM;AAC1B,oBAAU,SAAS,EAAE,MAAM,GAAG,KAAK,GAAG,SAAS,CAAC;AAAA,QAClD,CAAC;AAAA,MACH;AAAA,IACF;AAGA,WAAO,MAAM;AACX,qBAAe,6BAA6B,IAAI;AAChD,gBAAU,oBAAoB,UAAU,QAAQ;AAChD,qBAAe,WAAW;AAC1B,+BAAyB;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,cAAc,CAAC;AAGnB,SAAO;AACT;;;AF9CI;AAbG,SAAS,SAAS,EAAE,UAAU,GAAG,MAAM,GAAkB;AAC9D,QAAM,CAAC,aAAa,cAAc,QAAI,wBAAS,CAAC;AAChD,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,UAAU,iBAAiB,IAAI,sBAAsB;AAE7D,+BAAU,MAAM;AACd,QAAI,kBAAkB;AACpB,qBAAe,iBAAiB,eAAe,CAAC;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,gBAAgB,CAAC;AAErB,QAAM,EAAE,OAAO,GAAG,UAAU,IAAI;AAChC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,KAAK;AAAA,MACL,OAAO;AAAA,QACL,GAAI,OAAO,UAAU,WAAW,QAAQ,CAAC;AAAA,QACzC,SAAS,GAAG,WAAW;AAAA,MACzB;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":["import_react","import_react"]}
+{"version":3,"file":"index.cjs","sources":["../../src/shared/hooks/use-viewport.ts","../../src/shared/hooks/use-viewport-ref.ts","../../src/shared/components/viewport.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/@framework';\nimport { ViewportPlugin } from '@embedpdf/plugin-viewport';\n\nexport const useViewportPlugin = () => usePlugin<ViewportPlugin>(ViewportPlugin.id);\nexport const useViewportCapability = () => useCapability<ViewportPlugin>(ViewportPlugin.id);\n","import { Rect } from '@embedpdf/models';\nimport { useLayoutEffect, useRef } from '@framework';\n\nimport { useViewportPlugin } from './use-viewport';\n\nexport function useViewportRef() {\n  const { plugin: viewportPlugin } = useViewportPlugin();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!viewportPlugin) return;\n\n    const container = containerRef.current;\n    if (!container) return;\n\n    /* ---------- live rect provider --------------------------------- */\n    const provideRect = (): Rect => {\n      const r = container.getBoundingClientRect();\n      return {\n        origin: { x: r.left, y: r.top },\n        size: { width: r.width, height: r.height },\n      };\n    };\n    viewportPlugin.registerBoundingRectProvider(provideRect);\n\n    // Example: On scroll, call setMetrics\n    const onScroll = () => {\n      viewportPlugin.setViewportScrollMetrics({\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n      });\n    };\n    container.addEventListener('scroll', onScroll);\n\n    // Example: On resize, call setMetrics\n    const resizeObserver = new ResizeObserver(() => {\n      viewportPlugin.setViewportResizeMetrics({\n        width: container.offsetWidth,\n        height: container.offsetHeight,\n        clientWidth: container.clientWidth,\n        clientHeight: container.clientHeight,\n        scrollTop: container.scrollTop,\n        scrollLeft: container.scrollLeft,\n        scrollWidth: container.scrollWidth,\n        scrollHeight: container.scrollHeight,\n      });\n    });\n    resizeObserver.observe(container);\n\n    const unsubscribeScrollRequest = viewportPlugin.onScrollRequest(\n      ({ x, y, behavior = 'auto' }) => {\n        requestAnimationFrame(() => {\n          container.scrollTo({ left: x, top: y, behavior });\n        });\n      },\n    );\n\n    // Cleanup\n    return () => {\n      viewportPlugin.registerBoundingRectProvider(null);\n      container.removeEventListener('scroll', onScroll);\n      resizeObserver.disconnect();\n      unsubscribeScrollRequest();\n    };\n  }, [viewportPlugin]);\n\n  // Return the ref so your React code can attach it to a div\n  return containerRef;\n}\n","import { ReactNode, useEffect, useState, HTMLAttributes } from '@framework';\n\nimport { useViewportCapability } from '../hooks';\nimport { useViewportRef } from '../hooks/use-viewport-ref';\n\ntype ViewportProps = HTMLAttributes<HTMLDivElement> & {\n  children: ReactNode;\n};\n\nexport function Viewport({ children, ...props }: ViewportProps) {\n  const [viewportGap, setViewportGap] = useState(0);\n  const viewportRef = useViewportRef();\n  const { provides: viewportProvides } = useViewportCapability();\n\n  useEffect(() => {\n    if (viewportProvides) {\n      setViewportGap(viewportProvides.getViewportGap());\n    }\n  }, [viewportProvides]);\n\n  const { style, ...restProps } = props;\n  return (\n    <div\n      {...restProps}\n      ref={viewportRef}\n      style={{\n        ...(typeof style === 'object' ? style : {}),\n        padding: `${viewportGap}px`,\n      }}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["useViewportPlugin","usePlugin","ViewportPlugin","id","useViewportCapability","useCapability","useViewportRef","plugin","viewportPlugin","containerRef","useRef","useLayoutEffect","container","current","registerBoundingRectProvider","r","getBoundingClientRect","origin","x","left","y","top","size","width","height","onScroll","setViewportScrollMetrics","scrollTop","scrollLeft","addEventListener","resizeObserver","ResizeObserver","setViewportResizeMetrics","offsetWidth","offsetHeight","clientWidth","clientHeight","scrollWidth","scrollHeight","observe","unsubscribeScrollRequest","onScrollRequest","behavior","requestAnimationFrame","scrollTo","removeEventListener","disconnect","children","props","viewportGap","setViewportGap","useState","viewportRef","provides","viewportProvides","useEffect","getViewportGap","style","restProps","jsxRuntime","jsx","ref","padding"],"mappings":"iNAGaA,EAAoB,IAAMC,YAA0BC,EAAAA,eAAeC,IACnEC,EAAwB,IAAMC,gBAA8BH,EAAAA,eAAeC,ICCjF,SAASG,IACd,MAAQC,OAAQC,GAAmBR,IAC7BS,EAAeC,SAAuB,MA4DrC,OA1DPC,EAAAA,iBAAgB,KACd,IAAKH,EAAgB,OAErB,MAAMI,EAAYH,EAAaI,QAC/B,IAAKD,EAAW,OAUhBJ,EAAeM,8BAPK,KACZ,MAAAC,EAAIH,EAAUI,wBACb,MAAA,CACLC,OAAQ,CAAEC,EAAGH,EAAEI,KAAMC,EAAGL,EAAEM,KAC1BC,KAAM,CAAEC,MAAOR,EAAEQ,MAAOC,OAAQT,EAAES,QACpC,IAKF,MAAMC,EAAW,KACfjB,EAAekB,yBAAyB,CACtCC,UAAWf,EAAUe,UACrBC,WAAYhB,EAAUgB,YACvB,EAEOhB,EAAAiB,iBAAiB,SAAUJ,GAG/B,MAAAK,EAAiB,IAAIC,gBAAe,KACxCvB,EAAewB,yBAAyB,CACtCT,MAAOX,EAAUqB,YACjBT,OAAQZ,EAAUsB,aAClBC,YAAavB,EAAUuB,YACvBC,aAAcxB,EAAUwB,aACxBT,UAAWf,EAAUe,UACrBC,WAAYhB,EAAUgB,WACtBS,YAAazB,EAAUyB,YACvBC,aAAc1B,EAAU0B,cACzB,IAEHR,EAAeS,QAAQ3B,GAEvB,MAAM4B,EAA2BhC,EAAeiC,iBAC9C,EAAGvB,IAAGE,IAAGsB,WAAW,WAClBC,uBAAsB,KACpB/B,EAAUgC,SAAS,CAAEzB,KAAMD,EAAGG,IAAKD,EAAGsB,YAAU,GACjD,IAKL,MAAO,KACLlC,EAAeM,6BAA6B,MAClCF,EAAAiC,oBAAoB,SAAUpB,GACxCK,EAAegB,aACUN,GAAA,CAC3B,GACC,CAAChC,IAGGC,CACT,kBC3DO,UAAkBsC,SAAEA,KAAaC,IACtC,MAAOC,EAAaC,GAAkBC,EAAAA,SAAS,GACzCC,EAAc9C,KACZ+C,SAAUC,GAAqBlD,IAEvCmD,EAAAA,WAAU,KACJD,GACaJ,EAAAI,EAAiBE,iBAAgB,GAEjD,CAACF,IAEJ,MAAMG,MAAEA,KAAUC,GAAcV,EAE9B,OAAAW,EAAAC,IAAC,MAAA,IACKF,EACJG,IAAKT,EACLK,MAAO,IACgB,iBAAVA,EAAqBA,EAAQ,CAAC,EACzCK,QAAS,GAAGb,OAGbF,YAGP"}

package/dist/react/index.d.ts

@@ -1,25 +1 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React from 'react';
-import React__default, { ReactNode } from 'react';
-import * as _embedpdf_plugin_viewport from '@embedpdf/plugin-viewport';
-import { ViewportPlugin } from '@embedpdf/plugin-viewport';
-
-type ViewportProps = React__default.HTMLAttributes<HTMLDivElement> & {
-    children: ReactNode;
-};
-declare function Viewport({ children, ...props }: ViewportProps): react_jsx_runtime.JSX.Element;
-
-declare const useViewportPlugin: () => {
-    plugin: ViewportPlugin | null;
-    isLoading: boolean;
-    ready: Promise<void>;
-};
-declare const useViewportCapability: () => {
-    provides: Readonly<_embedpdf_plugin_viewport.ViewportCapability> | null;
-    isLoading: boolean;
-    ready: Promise<void>;
-};
-
-declare function useViewportRef(): React.RefObject<HTMLDivElement>;
-
-export { Viewport, useViewportCapability, useViewportPlugin, useViewportRef };
+export * from '../shared-react';

package/dist/react/index.js

@@ -1,14 +1,9 @@
-// src/react/components/viewport.tsx
-import { useEffect, useState } from "react";
-
-// src/react/hooks/use-viewport.ts
-import { useCapability, usePlugin } from "@embedpdf/core/react";
+import { jsx } from "react/jsx-runtime";
+import { useRef, useLayoutEffect, useState, useEffect } from "react";
+import { usePlugin, useCapability } from "@embedpdf/core/react";
 import { ViewportPlugin } from "@embedpdf/plugin-viewport";
-var useViewportPlugin = () => usePlugin(ViewportPlugin.id);
-var useViewportCapability = () => useCapability(ViewportPlugin.id);
-
-// src/react/hooks/use-viewport-ref.ts
-import { useLayoutEffect, useRef } from "react";
+const useViewportPlugin = () => usePlugin(ViewportPlugin.id);
+const useViewportCapability = () => useCapability(ViewportPlugin.id);
 function useViewportRef() {
   const { plugin: viewportPlugin } = useViewportPlugin();
   const containerRef = useRef(null);
@@ -60,9 +55,6 @@ function useViewportRef() {
   }, [viewportPlugin]);
   return containerRef;
 }
-
-// src/react/components/viewport.tsx
-import { jsx } from "react/jsx-runtime";
 function Viewport({ children, ...props }) {
   const [viewportGap, setViewportGap] = useState(0);
   const viewportRef = useViewportRef();
@@ -92,4 +84,4 @@ export {
   useViewportPlugin,
   useViewportRef
 };
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map