@embedpdf/plugin-viewport 1.0.0

package/dist/index.js

@@ -0,0 +1,216 @@
+// src/lib/manifest.ts
+var VIEWPORT_PLUGIN_ID = "viewport";
+var manifest = {
+  id: VIEWPORT_PLUGIN_ID,
+  name: "Viewport Plugin",
+  version: "1.0.0",
+  provides: ["viewport"],
+  requires: [],
+  optional: [],
+  defaultConfig: {
+    enabled: true,
+    viewportGap: 10,
+    scrollEndDelay: 300
+  }
+};
+
+// src/lib/actions.ts
+var SET_VIEWPORT_METRICS = "SET_VIEWPORT_METRICS";
+var SET_VIEWPORT_SCROLL_METRICS = "SET_VIEWPORT_SCROLL_METRICS";
+var SET_VIEWPORT_GAP = "SET_VIEWPORT_GAP";
+var SET_SCROLL_ACTIVITY = "SET_SCROLL_ACTIVITY";
+function setViewportGap(viewportGap) {
+  return {
+    type: SET_VIEWPORT_GAP,
+    payload: viewportGap
+  };
+}
+function setViewportMetrics(viewportMetrics) {
+  return {
+    type: SET_VIEWPORT_METRICS,
+    payload: viewportMetrics
+  };
+}
+function setViewportScrollMetrics(scrollMetrics) {
+  return {
+    type: SET_VIEWPORT_SCROLL_METRICS,
+    payload: scrollMetrics
+  };
+}
+function setScrollActivity(isScrolling) {
+  return { type: SET_SCROLL_ACTIVITY, payload: isScrolling };
+}
+
+// src/lib/reducer.ts
+var initialState = {
+  viewportGap: 0,
+  viewportMetrics: {
+    width: 0,
+    height: 0,
+    scrollTop: 0,
+    scrollLeft: 0,
+    clientWidth: 0,
+    clientHeight: 0,
+    scrollWidth: 0,
+    scrollHeight: 0,
+    relativePosition: {
+      x: 0,
+      y: 0
+    }
+  },
+  isScrolling: false
+};
+var viewportReducer = (state = initialState, action) => {
+  switch (action.type) {
+    case SET_VIEWPORT_GAP:
+      return { ...state, viewportGap: action.payload };
+    case SET_VIEWPORT_METRICS:
+      return {
+        ...state,
+        viewportMetrics: {
+          width: action.payload.width,
+          height: action.payload.height,
+          scrollTop: action.payload.scrollTop,
+          scrollLeft: action.payload.scrollLeft,
+          clientWidth: action.payload.clientWidth,
+          clientHeight: action.payload.clientHeight,
+          scrollWidth: action.payload.scrollWidth,
+          scrollHeight: action.payload.scrollHeight,
+          relativePosition: {
+            x: action.payload.scrollWidth <= action.payload.clientWidth ? 0 : action.payload.scrollLeft / (action.payload.scrollWidth - action.payload.clientWidth),
+            y: action.payload.scrollHeight <= action.payload.clientHeight ? 0 : action.payload.scrollTop / (action.payload.scrollHeight - action.payload.clientHeight)
+          }
+        }
+      };
+    case SET_VIEWPORT_SCROLL_METRICS:
+      return {
+        ...state,
+        viewportMetrics: {
+          ...state.viewportMetrics,
+          scrollTop: action.payload.scrollTop,
+          scrollLeft: action.payload.scrollLeft
+        },
+        isScrolling: true
+      };
+    case SET_SCROLL_ACTIVITY:
+      return { ...state, isScrolling: action.payload };
+    default:
+      return state;
+  }
+};
+
+// src/lib/viewport-plugin.ts
+import { BasePlugin, createEmitter, createBehaviorEmitter } from "@embedpdf/core";
+var ViewportPlugin = class extends BasePlugin {
+  constructor(id, registry, config) {
+    super(id, registry);
+    this.id = id;
+    this.viewportMetrics$ = createBehaviorEmitter();
+    this.scrollMetrics$ = createBehaviorEmitter();
+    this.scrollReq$ = createEmitter();
+    this.scrollActivity$ = createBehaviorEmitter();
+    /* ------------------------------------------------------------------ */
+    /* “live rect” infrastructure                                          */
+    /* ------------------------------------------------------------------ */
+    this.rectProvider = null;
+    if (config.viewportGap) {
+      this.dispatch(setViewportGap(config.viewportGap));
+    }
+    this.scrollEndDelay = config.scrollEndDelay || 300;
+  }
+  buildCapability() {
+    return {
+      getViewportGap: () => this.state.viewportGap,
+      getMetrics: () => this.state.viewportMetrics,
+      onScrollChange: this.scrollMetrics$.on,
+      onViewportChange: this.viewportMetrics$.on,
+      registerBoundingRectProvider: (fn) => {
+        this.rectProvider = fn;
+      },
+      getBoundingRect: () => this.rectProvider?.() ?? {
+        origin: { x: 0, y: 0 },
+        size: { width: 0, height: 0 }
+      },
+      setViewportMetrics: (viewportMetrics) => {
+        this.dispatch(setViewportMetrics(viewportMetrics));
+      },
+      setViewportScrollMetrics: this.setViewportScrollMetrics.bind(this),
+      scrollTo: (pos) => this.scrollTo(pos),
+      onScrollRequest: this.scrollReq$.on,
+      isScrolling: () => this.state.isScrolling,
+      onScrollActivity: this.scrollActivity$.on
+    };
+  }
+  bumpScrollActivity() {
+    if (this.scrollEndTimer) clearTimeout(this.scrollEndTimer);
+    this.scrollEndTimer = window.setTimeout(() => {
+      this.dispatch(setScrollActivity(false));
+      this.scrollEndTimer = void 0;
+    }, this.scrollEndDelay);
+  }
+  setViewportScrollMetrics(scrollMetrics) {
+    if (scrollMetrics.scrollTop !== this.state.viewportMetrics.scrollTop || scrollMetrics.scrollLeft !== this.state.viewportMetrics.scrollLeft) {
+      this.dispatch(setViewportScrollMetrics(scrollMetrics));
+      this.bumpScrollActivity();
+    }
+  }
+  scrollTo(pos) {
+    const { x, y, center, behavior = "auto" } = pos;
+    if (center) {
+      const metrics = this.state.viewportMetrics;
+      const centeredX = x - metrics.clientWidth / 2;
+      const centeredY = y - metrics.clientHeight / 2;
+      this.scrollReq$.emit({
+        x: centeredX,
+        y: centeredY,
+        behavior
+      });
+    } else {
+      this.scrollReq$.emit({
+        x,
+        y,
+        behavior
+      });
+    }
+  }
+  // Subscribe to store changes to notify onViewportChange
+  onStoreUpdated(prevState, newState) {
+    if (prevState !== newState) {
+      this.viewportMetrics$.emit(newState.viewportMetrics);
+      this.scrollMetrics$.emit({
+        scrollTop: newState.viewportMetrics.scrollTop,
+        scrollLeft: newState.viewportMetrics.scrollLeft
+      });
+      if (prevState.isScrolling !== newState.isScrolling) {
+        this.scrollActivity$.emit(newState.isScrolling);
+      }
+    }
+  }
+  async initialize(_config) {
+  }
+  async destroy() {
+    super.destroy();
+    this.viewportMetrics$.clear();
+    this.scrollMetrics$.clear();
+    this.scrollReq$.clear();
+    this.scrollActivity$.clear();
+    this.rectProvider = null;
+    if (this.scrollEndTimer) clearTimeout(this.scrollEndTimer);
+  }
+};
+ViewportPlugin.id = "viewport";
+
+// src/lib/index.ts
+var ViewportPluginPackage = {
+  manifest,
+  create: (registry, _engine, config) => new ViewportPlugin(VIEWPORT_PLUGIN_ID, registry, config),
+  reducer: viewportReducer,
+  initialState
+};
+export {
+  VIEWPORT_PLUGIN_ID,
+  ViewportPlugin,
+  ViewportPluginPackage,
+  manifest
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/manifest.ts","../src/lib/actions.ts","../src/lib/reducer.ts","../src/lib/viewport-plugin.ts","../src/lib/index.ts"],"sourcesContent":["import { PluginManifest } from '@embedpdf/core';\n\nimport { ViewportPluginConfig } from './types';\n\nexport const VIEWPORT_PLUGIN_ID = 'viewport';\n\nexport const manifest: PluginManifest<ViewportPluginConfig> = {\n  id: VIEWPORT_PLUGIN_ID,\n  name: 'Viewport Plugin',\n  version: '1.0.0',\n  provides: ['viewport'],\n  requires: [],\n  optional: [],\n  defaultConfig: {\n    enabled: true,\n    viewportGap: 10,\n    scrollEndDelay: 300,\n  },\n};\n","import { Action } from '@embedpdf/core';\n\nimport { ViewportInputMetrics, ViewportScrollMetrics } from './types';\n\nexport const SET_VIEWPORT_METRICS = 'SET_VIEWPORT_METRICS';\nexport const SET_VIEWPORT_SCROLL_METRICS = 'SET_VIEWPORT_SCROLL_METRICS';\nexport const SET_VIEWPORT_GAP = 'SET_VIEWPORT_GAP';\nexport const SET_SCROLL_ACTIVITY = 'SET_SCROLL_ACTIVITY';\n\nexport interface SetViewportMetricsAction extends Action {\n  type: typeof SET_VIEWPORT_METRICS;\n  payload: ViewportInputMetrics;\n}\n\nexport interface SetViewportScrollMetricsAction extends Action {\n  type: typeof SET_VIEWPORT_SCROLL_METRICS;\n  payload: ViewportScrollMetrics;\n}\n\nexport interface SetViewportGapAction extends Action {\n  type: typeof SET_VIEWPORT_GAP;\n  payload: number;\n}\n\nexport interface SetScrollActivityAction extends Action {\n  type: typeof SET_SCROLL_ACTIVITY;\n  payload: boolean;\n}\n\nexport type ViewportAction =\n  | SetViewportMetricsAction\n  | SetViewportScrollMetricsAction\n  | SetViewportGapAction\n  | SetScrollActivityAction;\n\nexport function setViewportGap(viewportGap: number): SetViewportGapAction {\n  return {\n    type: SET_VIEWPORT_GAP,\n    payload: viewportGap,\n  };\n}\n\nexport function setViewportMetrics(\n  viewportMetrics: ViewportInputMetrics,\n): SetViewportMetricsAction {\n  return {\n    type: SET_VIEWPORT_METRICS,\n    payload: viewportMetrics,\n  };\n}\n\nexport function setViewportScrollMetrics(\n  scrollMetrics: ViewportScrollMetrics,\n): SetViewportScrollMetricsAction {\n  return {\n    type: SET_VIEWPORT_SCROLL_METRICS,\n    payload: scrollMetrics,\n  };\n}\n\nexport function setScrollActivity(isScrolling: boolean): SetScrollActivityAction {\n  return { type: SET_SCROLL_ACTIVITY, payload: isScrolling };\n}\n","import { Reducer } from '@embedpdf/core';\n\nimport {\n  SET_VIEWPORT_METRICS,\n  SET_VIEWPORT_SCROLL_METRICS,\n  SET_VIEWPORT_GAP,\n  ViewportAction,\n  SET_SCROLL_ACTIVITY,\n} from './actions';\nimport { ViewportState } from './types';\n\nexport const initialState: ViewportState = {\n  viewportGap: 0,\n  viewportMetrics: {\n    width: 0,\n    height: 0,\n    scrollTop: 0,\n    scrollLeft: 0,\n    clientWidth: 0,\n    clientHeight: 0,\n    scrollWidth: 0,\n    scrollHeight: 0,\n    relativePosition: {\n      x: 0,\n      y: 0,\n    },\n  },\n  isScrolling: false,\n};\n\nexport const viewportReducer: Reducer<ViewportState, ViewportAction> = (\n  state = initialState,\n  action,\n) => {\n  switch (action.type) {\n    case SET_VIEWPORT_GAP:\n      return { ...state, viewportGap: action.payload };\n    case SET_VIEWPORT_METRICS:\n      return {\n        ...state,\n        viewportMetrics: {\n          width: action.payload.width,\n          height: action.payload.height,\n          scrollTop: action.payload.scrollTop,\n          scrollLeft: action.payload.scrollLeft,\n          clientWidth: action.payload.clientWidth,\n          clientHeight: action.payload.clientHeight,\n          scrollWidth: action.payload.scrollWidth,\n          scrollHeight: action.payload.scrollHeight,\n          relativePosition: {\n            x:\n              action.payload.scrollWidth <= action.payload.clientWidth\n                ? 0\n                : action.payload.scrollLeft /\n                  (action.payload.scrollWidth - action.payload.clientWidth),\n            y:\n              action.payload.scrollHeight <= action.payload.clientHeight\n                ? 0\n                : action.payload.scrollTop /\n                  (action.payload.scrollHeight - action.payload.clientHeight),\n          },\n        },\n      };\n    case SET_VIEWPORT_SCROLL_METRICS:\n      return {\n        ...state,\n        viewportMetrics: {\n          ...state.viewportMetrics,\n          scrollTop: action.payload.scrollTop,\n          scrollLeft: action.payload.scrollLeft,\n        },\n        isScrolling: true,\n      };\n    case SET_SCROLL_ACTIVITY:\n      return { ...state, isScrolling: action.payload };\n    default:\n      return state;\n  }\n};\n","import { BasePlugin, PluginRegistry, createEmitter, createBehaviorEmitter } from '@embedpdf/core';\n\nimport {\n  ViewportAction,\n  setViewportMetrics,\n  setViewportScrollMetrics,\n  setViewportGap,\n  setScrollActivity,\n} from './actions';\nimport {\n  ViewportPluginConfig,\n  ViewportState,\n  ViewportCapability,\n  ViewportMetrics,\n  ViewportScrollMetrics,\n  ViewportInputMetrics,\n  ScrollToPayload,\n} from './types';\nimport { Rect } from '@embedpdf/models';\n\nexport class ViewportPlugin extends BasePlugin<\n  ViewportPluginConfig,\n  ViewportCapability,\n  ViewportState,\n  ViewportAction\n> {\n  static readonly id = 'viewport' as const;\n\n  private readonly viewportMetrics$ = createBehaviorEmitter<ViewportMetrics>();\n  private readonly scrollMetrics$ = createBehaviorEmitter<ViewportScrollMetrics>();\n  private readonly scrollReq$ = createEmitter<{\n    x: number;\n    y: number;\n    behavior?: ScrollBehavior;\n  }>();\n  private readonly scrollActivity$ = createBehaviorEmitter<boolean>();\n\n  /* ------------------------------------------------------------------ */\n  /* “live rect” infrastructure                                          */\n  /* ------------------------------------------------------------------ */\n  private rectProvider: (() => Rect) | null = null;\n\n  private scrollEndTimer?: number;\n  private readonly scrollEndDelay: number;\n\n  constructor(\n    public readonly id: string,\n    registry: PluginRegistry,\n    config: ViewportPluginConfig,\n  ) {\n    super(id, registry);\n\n    if (config.viewportGap) {\n      this.dispatch(setViewportGap(config.viewportGap));\n    }\n\n    this.scrollEndDelay = config.scrollEndDelay || 300;\n  }\n\n  protected buildCapability(): ViewportCapability {\n    return {\n      getViewportGap: () => this.state.viewportGap,\n      getMetrics: () => this.state.viewportMetrics,\n      onScrollChange: this.scrollMetrics$.on,\n      onViewportChange: this.viewportMetrics$.on,\n      registerBoundingRectProvider: (fn) => {\n        this.rectProvider = fn;\n      },\n      getBoundingRect: (): Rect =>\n        this.rectProvider?.() ?? {\n          origin: { x: 0, y: 0 },\n          size: { width: 0, height: 0 },\n        },\n      setViewportMetrics: (viewportMetrics: ViewportInputMetrics) => {\n        this.dispatch(setViewportMetrics(viewportMetrics));\n      },\n      setViewportScrollMetrics: this.setViewportScrollMetrics.bind(this),\n      scrollTo: (pos: ScrollToPayload) => this.scrollTo(pos),\n      onScrollRequest: this.scrollReq$.on,\n      isScrolling: () => this.state.isScrolling,\n      onScrollActivity: this.scrollActivity$.on,\n    };\n  }\n\n  private bumpScrollActivity() {\n    if (this.scrollEndTimer) clearTimeout(this.scrollEndTimer);\n    this.scrollEndTimer = window.setTimeout(() => {\n      this.dispatch(setScrollActivity(false));\n      this.scrollEndTimer = undefined;\n    }, this.scrollEndDelay);\n  }\n\n  private setViewportScrollMetrics(scrollMetrics: ViewportScrollMetrics) {\n    if (\n      scrollMetrics.scrollTop !== this.state.viewportMetrics.scrollTop ||\n      scrollMetrics.scrollLeft !== this.state.viewportMetrics.scrollLeft\n    ) {\n      this.dispatch(setViewportScrollMetrics(scrollMetrics));\n      this.bumpScrollActivity();\n    }\n  }\n\n  private scrollTo(pos: ScrollToPayload) {\n    const { x, y, center, behavior = 'auto' } = pos;\n\n    if (center) {\n      const metrics = this.state.viewportMetrics;\n      // Calculate the centered position by adding half the viewport dimensions\n      const centeredX = x - metrics.clientWidth / 2;\n      const centeredY = y - metrics.clientHeight / 2;\n\n      this.scrollReq$.emit({\n        x: centeredX,\n        y: centeredY,\n        behavior,\n      });\n    } else {\n      this.scrollReq$.emit({\n        x,\n        y,\n        behavior,\n      });\n    }\n  }\n\n  // Subscribe to store changes to notify onViewportChange\n  override onStoreUpdated(prevState: ViewportState, newState: ViewportState): void {\n    if (prevState !== newState) {\n      this.viewportMetrics$.emit(newState.viewportMetrics);\n      this.scrollMetrics$.emit({\n        scrollTop: newState.viewportMetrics.scrollTop,\n        scrollLeft: newState.viewportMetrics.scrollLeft,\n      });\n      if (prevState.isScrolling !== newState.isScrolling) {\n        this.scrollActivity$.emit(newState.isScrolling);\n      }\n    }\n  }\n\n  async initialize(_config: ViewportPluginConfig) {\n    // No initialization needed\n  }\n\n  async destroy(): Promise<void> {\n    super.destroy();\n    // Clear out any handlers\n    this.viewportMetrics$.clear();\n    this.scrollMetrics$.clear();\n    this.scrollReq$.clear();\n    this.scrollActivity$.clear();\n    this.rectProvider = null;\n    if (this.scrollEndTimer) clearTimeout(this.scrollEndTimer);\n  }\n}\n","import { PluginPackage } from '@embedpdf/core';\n\nimport { ViewportAction } from './actions';\nimport { manifest, VIEWPORT_PLUGIN_ID } from './manifest';\nimport { viewportReducer, initialState } from './reducer';\nimport { ViewportPluginConfig, ViewportState } from './types';\nimport { ViewportPlugin } from './viewport-plugin';\n\nexport const ViewportPluginPackage: PluginPackage<\n  ViewportPlugin,\n  ViewportPluginConfig,\n  ViewportState,\n  ViewportAction\n> = {\n  manifest,\n  create: (registry, _engine, config) => new ViewportPlugin(VIEWPORT_PLUGIN_ID, registry, config),\n  reducer: viewportReducer,\n  initialState: initialState,\n};\n\nexport * from './viewport-plugin';\nexport * from './types';\nexport * from './manifest';\n"],"mappings":"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","names":[]}

package/dist/preact/index.cjs

@@ -0,0 +1,124 @@
+"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,
+  useViewport: () => useViewport,
+  useViewportCapability: () => useViewportCapability
+});
+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 useViewport = () => (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 { provides: viewportProvides } = useViewportCapability();
+  const containerRef = (0, import_hooks.useRef)(null);
+  (0, import_hooks.useLayoutEffect)(() => {
+    if (!viewportProvides) 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 }
+      };
+    };
+    viewportProvides.registerBoundingRectProvider(provideRect);
+    const onScroll = () => {
+      viewportProvides.setViewportScrollMetrics({
+        scrollTop: container.scrollTop,
+        scrollLeft: container.scrollLeft
+      });
+    };
+    container.addEventListener("scroll", onScroll);
+    const resizeObserver = new ResizeObserver(() => {
+      const rect = container.getBoundingClientRect();
+      viewportProvides.setViewportMetrics({
+        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 = viewportProvides.onScrollRequest(
+      ({ x, y, behavior = "auto" }) => {
+        requestAnimationFrame(() => {
+          container.scrollTo({ left: x, top: y, behavior });
+        });
+      }
+    );
+    return () => {
+      viewportProvides.registerBoundingRectProvider(null);
+      container.removeEventListener("scroll", onScroll);
+      resizeObserver.disconnect();
+      unsubscribeScrollRequest();
+    };
+  }, [viewportProvides]);
+  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,
+  useViewport,
+  useViewportCapability
+});
+//# sourceMappingURL=index.cjs.map

package/dist/preact/index.cjs.map

@@ -0,0 +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 useViewport = () => 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 { useLayoutEffect, useRef } from 'preact/hooks';\n\nimport { useViewportCapability } from './use-viewport';\nimport { Rect } from '@embedpdf/models';\n\nexport function useViewportRef() {\n  const { provides: viewportProvides } = useViewportCapability();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!viewportProvides) 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    viewportProvides.registerBoundingRectProvider(provideRect);\n\n    // Example: On scroll, call setMetrics\n    const onScroll = () => {\n      viewportProvides.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      const rect = container.getBoundingClientRect();\n\n      viewportProvides.setViewportMetrics({\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 = viewportProvides.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      viewportProvides.registerBoundingRectProvider(null);\n      container.removeEventListener('scroll', onScroll);\n      resizeObserver.disconnect();\n      unsubscribeScrollRequest();\n    };\n  }, [viewportProvides]);\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,cAAc,UAAM,yBAA0B,sCAAe,EAAE;AACrE,IAAM,wBAAwB,UAAM,6BAA8B,sCAAe,EAAE;;;ACF1F,IAAAA,gBAAoC;;;ACFpC,mBAAwC;AAKjC,SAAS,iBAAiB;AAC/B,QAAM,EAAE,UAAU,iBAAiB,IAAI,sBAAsB;AAC7D,QAAM,mBAAe,qBAAuB,IAAI;AAEhD,oCAAgB,MAAM;AACpB,QAAI,CAAC,iBAAkB;AAEvB,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,qBAAiB,6BAA6B,WAAW;AAGzD,UAAM,WAAW,MAAM;AACrB,uBAAiB,yBAAyB;AAAA,QACxC,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AACA,cAAU,iBAAiB,UAAU,QAAQ;AAG7C,UAAM,iBAAiB,IAAI,eAAe,MAAM;AAC9C,YAAM,OAAO,UAAU,sBAAsB;AAE7C,uBAAiB,mBAAmB;AAAA,QAClC,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,iBAAiB;AAAA,MAChD,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,uBAAiB,6BAA6B,IAAI;AAClD,gBAAU,oBAAoB,UAAU,QAAQ;AAChD,qBAAe,WAAW;AAC1B,+BAAyB;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,gBAAgB,CAAC;AAGrB,SAAO;AACT;;;AD9CI;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"]}

package/dist/preact/index.d.cts

@@ -0,0 +1,23 @@
+import * as _embedpdf_plugin_viewport from '@embedpdf/plugin-viewport';
+import { ViewportPlugin } from '@embedpdf/plugin-viewport';
+import { JSX, ComponentChildren } from 'preact';
+
+declare const useViewport: () => {
+    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, useViewport, useViewportCapability };

package/dist/preact/index.d.ts

@@ -0,0 +1,23 @@
+import * as _embedpdf_plugin_viewport from '@embedpdf/plugin-viewport';
+import { ViewportPlugin } from '@embedpdf/plugin-viewport';
+import { JSX, ComponentChildren } from 'preact';
+
+declare const useViewport: () => {
+    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, useViewport, useViewportCapability };

package/dist/preact/index.js

@@ -0,0 +1,95 @@
+// src/preact/hooks/use-viewport.ts
+import { useCapability, usePlugin } from "@embedpdf/core/preact";
+import { ViewportPlugin } from "@embedpdf/plugin-viewport";
+var useViewport = () => 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";
+function useViewportRef() {
+  const { provides: viewportProvides } = useViewportCapability();
+  const containerRef = useRef(null);
+  useLayoutEffect(() => {
+    if (!viewportProvides) 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 }
+      };
+    };
+    viewportProvides.registerBoundingRectProvider(provideRect);
+    const onScroll = () => {
+      viewportProvides.setViewportScrollMetrics({
+        scrollTop: container.scrollTop,
+        scrollLeft: container.scrollLeft
+      });
+    };
+    container.addEventListener("scroll", onScroll);
+    const resizeObserver = new ResizeObserver(() => {
+      const rect = container.getBoundingClientRect();
+      viewportProvides.setViewportMetrics({
+        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 = viewportProvides.onScrollRequest(
+      ({ x, y, behavior = "auto" }) => {
+        requestAnimationFrame(() => {
+          container.scrollTo({ left: x, top: y, behavior });
+        });
+      }
+    );
+    return () => {
+      viewportProvides.registerBoundingRectProvider(null);
+      container.removeEventListener("scroll", onScroll);
+      resizeObserver.disconnect();
+      unsubscribeScrollRequest();
+    };
+  }, [viewportProvides]);
+  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();
+  const { provides: viewportProvides } = useViewportCapability();
+  useEffect(() => {
+    if (viewportProvides) {
+      setViewportGap(viewportProvides.getViewportGap());
+    }
+  }, [viewportProvides]);
+  const { style, ...restProps } = props;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...restProps,
+      ref: viewportRef,
+      style: {
+        ...typeof style === "object" ? style : {},
+        padding: `${viewportGap}px`
+      },
+      children
+    }
+  );
+}
+export {
+  Viewport,
+  useViewport,
+  useViewportCapability
+};
+//# sourceMappingURL=index.js.map

package/dist/preact/index.js.map

@@ -0,0 +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 useViewport = () => 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 { useLayoutEffect, useRef } from 'preact/hooks';\n\nimport { useViewportCapability } from './use-viewport';\nimport { Rect } from '@embedpdf/models';\n\nexport function useViewportRef() {\n  const { provides: viewportProvides } = useViewportCapability();\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    if (!viewportProvides) 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    viewportProvides.registerBoundingRectProvider(provideRect);\n\n    // Example: On scroll, call setMetrics\n    const onScroll = () => {\n      viewportProvides.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      const rect = container.getBoundingClientRect();\n\n      viewportProvides.setViewportMetrics({\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 = viewportProvides.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      viewportProvides.registerBoundingRectProvider(null);\n      container.removeEventListener('scroll', onScroll);\n      resizeObserver.disconnect();\n      unsubscribeScrollRequest();\n    };\n  }, [viewportProvides]);\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,cAAc,MAAM,UAA0B,eAAe,EAAE;AACrE,IAAM,wBAAwB,MAAM,cAA8B,eAAe,EAAE;;;ACF1F,SAAS,WAAW,gBAAgB;;;ACFpC,SAAS,iBAAiB,cAAc;AAKjC,SAAS,iBAAiB;AAC/B,QAAM,EAAE,UAAU,iBAAiB,IAAI,sBAAsB;AAC7D,QAAM,eAAe,OAAuB,IAAI;AAEhD,kBAAgB,MAAM;AACpB,QAAI,CAAC,iBAAkB;AAEvB,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,qBAAiB,6BAA6B,WAAW;AAGzD,UAAM,WAAW,MAAM;AACrB,uBAAiB,yBAAyB;AAAA,QACxC,WAAW,UAAU;AAAA,QACrB,YAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AACA,cAAU,iBAAiB,UAAU,QAAQ;AAG7C,UAAM,iBAAiB,IAAI,eAAe,MAAM;AAC9C,YAAM,OAAO,UAAU,sBAAsB;AAE7C,uBAAiB,mBAAmB;AAAA,QAClC,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,iBAAiB;AAAA,MAChD,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,uBAAiB,6BAA6B,IAAI;AAClD,gBAAU,oBAAoB,UAAU,QAAQ;AAChD,qBAAe,WAAW;AAC1B,+BAAyB;AAAA,IAC3B;AAAA,EACF,GAAG,CAAC,gBAAgB,CAAC;AAGrB,SAAO;AACT;;;AD9CI;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":[]}

package/dist/react/index.cjs

@@ -0,0 +1,126 @@
+"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,
+  useViewport: () => useViewport,
+  useViewportCapability: () => useViewportCapability,
+  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 useViewport = () => (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 { provides: viewportProvides } = useViewportCapability();
+  const containerRef = (0, import_react2.useRef)(null);
+  (0, import_react2.useLayoutEffect)(() => {
+    if (!viewportProvides) 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 }
+      };
+    };
+    viewportProvides.registerBoundingRectProvider(provideRect);
+    const onScroll = () => {
+      viewportProvides.setViewportScrollMetrics({
+        scrollTop: container.scrollTop,
+        scrollLeft: container.scrollLeft
+      });
+    };
+    container.addEventListener("scroll", onScroll);
+    const resizeObserver = new ResizeObserver(() => {
+      const rect = container.getBoundingClientRect();
+      viewportProvides.setViewportMetrics({
+        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 = viewportProvides.onScrollRequest(
+      ({ x, y, behavior = "auto" }) => {
+        requestAnimationFrame(() => {
+          container.scrollTo({ left: x, top: y, behavior });
+        });
+      }
+    );
+    return () => {
+      viewportProvides.registerBoundingRectProvider(null);
+      container.removeEventListener("scroll", onScroll);
+      resizeObserver.disconnect();
+      unsubscribeScrollRequest();
+    };
+  }, [viewportProvides]);
+  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,
+  useViewport,
+  useViewportCapability,
+  useViewportRef
+});
+//# sourceMappingURL=index.cjs.map