@pdf-viewer/react 0.9.0-beta.4 → 0.9.0-beta.6

package/dist/components/RPController.js

@@ -1,6 +1,6 @@
 import { jsx as r } from "react/jsx-runtime";
-import { useState as e } from "react";
-import { P as u, S as M, T as C, a as R } from "../RPDefaultLayout-1a423868.js";
+import { useState as o } from "react";
+import { P as u, S as M, T as R, a as C } from "../RPDefaultLayout-1a423868.js";
 import { DarkModeProvider as L } from "../contexts/DarkModeContext.js";
 import { ScrollMode as T, SelectionMode as V } from "../utils/types.js";
 import { RotateProvider as b } from "../contexts/RotationContext.js";
@@ -18,42 +18,42 @@ import { FullScreenProvider as Z } from "../contexts/FullScreenContext.js";
 import { FileInputProvider as j } from "../contexts/FileInputContext.js";
 import { DropFileZoneProvider as A } from "../contexts/DropFileZoneContext.js";
 import { LayoutContainerContext as N } from "../contexts/LayoutContainerContext.js";
-const nr = (o) => {
+const nr = (t) => {
   const {
-    children: t,
-    darkMode: l = !1,
-    onDarkModeChange: n,
-    initialRotate: d = 0,
-    textLayer: m = !0,
-    initialPage: a = 1,
+    children: l,
+    darkMode: n = !1,
+    onDarkModeChange: d,
+    initialRotate: m = 0,
+    textLayer: a = !0,
+    initialPage: c = 1,
     // initialViewMode = ViewMode.SINGLE_PAGE,
-    initialThumbnailsVisible: c = !1,
+    initialThumbnailsVisible: f = !1,
     initialSearch: h,
-    initialScale: f,
-    initialScrollMode: P = T.VERTICAL_SCROLLING,
-    mobileWidth: p
-  } = o, [v, S] = e(null), [i, s] = e(null);
+    initialScale: P,
+    initialScrollMode: p = T.VERTICAL_SCROLLING,
+    mobileWidth: v
+  } = t, [i, S] = o(null), [e, s] = o(null);
   return /* @__PURE__ */ r(
     G,
     {
-      initialScale: f,
-      initialPage: a,
-      initialScrollMode: P,
-      initialRotate: d,
-      children: /* @__PURE__ */ r(w, { mobileWidth: p, children: /* @__PURE__ */ r(D, { children: /* @__PURE__ */ r(y, { children: /* @__PURE__ */ r(g, { children: /* @__PURE__ */ r(k, { children: /* @__PURE__ */ r(E, { initialSelectionMode: V.TEXT, children: /* @__PURE__ */ r(F, { children: /* @__PURE__ */ r(u, { children: /* @__PURE__ */ r(b, { children: /* @__PURE__ */ r(x, { textLayer: m, children: /* @__PURE__ */ r(I, { children: /* @__PURE__ */ r(
+      initialScale: P,
+      initialPage: c,
+      initialScrollMode: p,
+      initialRotate: m,
+      children: /* @__PURE__ */ r(w, { mobileWidth: v, containerRef: i, children: /* @__PURE__ */ r(D, { children: /* @__PURE__ */ r(y, { children: /* @__PURE__ */ r(g, { children: /* @__PURE__ */ r(k, { children: /* @__PURE__ */ r(E, { initialSelectionMode: V.TEXT, children: /* @__PURE__ */ r(F, { children: /* @__PURE__ */ r(u, { children: /* @__PURE__ */ r(b, { children: /* @__PURE__ */ r(x, { textLayer: a, children: /* @__PURE__ */ r(I, { children: /* @__PURE__ */ r(
         L,
         {
-          darkMode: l,
-          onDarkModeChange: n,
+          darkMode: n,
+          onDarkModeChange: d,
           children: /* @__PURE__ */ r(
             N.Provider,
             {
-              value: { container: v, contentRef: i, setContainer: S, setContentRef: s },
+              value: { container: i, contentRef: e, setContainer: S, setContentRef: s },
               children: /* @__PURE__ */ r(M, { initialSearch: h, children: /* @__PURE__ */ r(
-                C,
+                R,
                 {
-                  initialThumbnailsVisible: c,
-                  children: /* @__PURE__ */ r(A, { children: /* @__PURE__ */ r(Z, { elementRef: i, children: /* @__PURE__ */ r(R, { children: /* @__PURE__ */ r(j, { children: t }) }) }) })
+                  initialThumbnailsVisible: f,
+                  children: /* @__PURE__ */ r(A, { children: /* @__PURE__ */ r(Z, { elementRef: e, children: /* @__PURE__ */ r(C, { children: /* @__PURE__ */ r(j, { children: l }) }) }) })
                 }
               ) })
             }

package/dist/contexts/ViewportContext.js

@@ -1,62 +1,72 @@
-import { jsx as u } from "react/jsx-runtime";
-import { createContext as h, useState as m, useEffect as b, useContext as x } from "react";
-const v = {
+import { jsx as m } from "react/jsx-runtime";
+import { createContext as b, useState as v, useEffect as x, useContext as g } from "react";
+const k = {
   xs: 320,
   sm: 640,
   md: 768,
   lg: 1024,
   xl: 1280,
   "2xl": 1536
-}, s = h(void 0), E = ({ children: n, mobileWidth: a = 768 }) => {
-  const [o, d] = m({
-    width: window.innerWidth,
-    height: window.innerHeight,
+}, p = b(void 0), S = ({
+  children: s,
+  containerRef: t,
+  mobileWidth: l = 768
+}) => {
+  const [o, c] = v({
+    width: (t == null ? void 0 : t.clientWidth) || window.innerWidth,
+    height: (t == null ? void 0 : t.clientHeight) || window.innerHeight,
     isMobile: !1,
     currentBreakpoint: "xs",
     orientation: "portrait"
-  }), r = {
-    ...v,
-    md: a
-  }, c = () => o.width < r.md, w = (e) => {
-    const i = Object.entries(r);
-    for (let t = i.length - 1; t >= 0; t--)
-      if (e >= i[t][1])
-        return i[t][0];
+  }), n = {
+    ...k,
+    md: l
+  }, w = () => o.width < n.md, u = (e) => {
+    const r = Object.entries(n);
+    for (let i = r.length - 1; i >= 0; i--)
+      if (e >= r[i][1])
+        return r[i][0];
     return "xs";
-  }, p = () => {
+  }, a = () => {
     const e = navigator.userAgent.toLowerCase();
-    return ["iphone", "ipod", "ipad", "android", "mobile", "phone", "tablet"].some((t) => e.includes(t));
+    return ["iphone", "ipod", "ipad", "android", "mobile", "phone", "tablet"].some((i) => e.includes(i));
   };
-  b(() => {
+  x(() => {
+    if (!t)
+      return;
     const e = () => {
-      const i = window.innerWidth, t = window.innerHeight;
-      d({
+      const i = t.clientWidth, d = t.clientHeight;
+      c({
         width: i,
-        height: t,
-        isMobile: p(),
-        currentBreakpoint: w(i),
-        orientation: t > i ? "portrait" : "landscape"
+        height: d,
+        isMobile: a(),
+        currentBreakpoint: u(i),
+        orientation: d > i ? "portrait" : "landscape"
       });
     };
-    return e(), window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
-  }, []);
-  const l = {
+    e();
+    const r = new ResizeObserver(e);
+    return r.observe(t), window.addEventListener("resize", e), () => {
+      r.disconnect(), window.removeEventListener("resize", e);
+    };
+  }, [t]);
+  const h = {
     ...o,
-    breakpoints: r,
-    isBreakpoint: (e) => o.width >= r[e],
+    breakpoints: n,
+    isBreakpoint: (e) => o.width >= n[e],
     isMobileDevice: o.isMobile,
     isPortrait: o.orientation === "portrait",
     isLandscape: o.orientation === "landscape",
-    isSmallScreen: c()
+    isSmallScreen: w()
   };
-  return /* @__PURE__ */ u(s.Provider, { value: l, children: n });
-}, B = () => {
-  const n = x(s);
-  if (n === void 0)
+  return /* @__PURE__ */ m(p.Provider, { value: h, children: s });
+}, P = () => {
+  const s = g(p);
+  if (s === void 0)
     throw new Error("useViewportContext must be used within a ViewportProvider");
-  return n;
+  return s;
 };
 export {
-  E as ViewportProvider,
-  B as useViewportContext
+  S as ViewportProvider,
+  P as useViewportContext
 };

package/dist/main.js

@@ -1,40 +1,41 @@
 import { RPProvider as t } from "./components/RPProvider.js";
-import { b as x, R as n, c as s, u as p, d as f, e as m } from "./RPDefaultLayout-1a423868.js";
+import { b as x, R as n, c as s, u as m, d as p, e as f } from "./RPDefaultLayout-1a423868.js";
 import { RPConfig as a } from "./components/RPConfig.js";
-import { RPController as C } from "./components/RPController.js";
-import { RPTheme as l } from "./components/RPTheme.js";
+import { RPController as l } from "./components/RPController.js";
+import { RPTheme as P } from "./components/RPTheme.js";
 import { RPDropFileZone as d } from "./components/RPDropFileZone.js";
 import { useDarkModeContext as c } from "./contexts/DarkModeContext.js";
 import { useDocumentContext as M } from "./contexts/RPDocumentContext.js";
-import { useRotationContext as w } from "./contexts/RotationContext.js";
-import { useViewModeContext as Z } from "./contexts/ViewModeContext.js";
-import { useDropFileZoneContext as V } from "./contexts/DropFileZoneContext.js";
-import { useOpenFileContext as k } from "./contexts/FileInputContext.js";
-import { useZoomContext as y } from "./contexts/ZoomContext.js";
+import { useRotationContext as g } from "./contexts/RotationContext.js";
+import { useViewModeContext as S } from "./contexts/ViewModeContext.js";
+import { useDropFileZoneContext as v } from "./contexts/DropFileZoneContext.js";
+import { useOpenFileContext as V } from "./contexts/FileInputContext.js";
+import { useZoomContext as k } from "./contexts/ZoomContext.js";
 import { usePdfProperties as O } from "./utils/hooks/usePdfProperties.js";
 import { useFullScreenContext as j } from "./contexts/FullScreenContext.js";
-import { ScrollMode as z, ViewMode as A } from "./utils/types.js";
+import { ScrollMode as z, ViewMode as A, ZoomLevel as B } from "./utils/types.js";
 export {
   a as RPConfig,
-  C as RPController,
+  l as RPController,
   x as RPDefaultLayout,
   d as RPDropFileZone,
   n as RPPages,
   t as RPProvider,
-  l as RPTheme,
+  P as RPTheme,
   z as ScrollMode,
   A as ViewMode,
+  B as ZoomLevel,
   c as useDarkModeContext,
   M as useDocumentContext,
-  V as useDropFileZoneContext,
+  v as useDropFileZoneContext,
   s as useFileDownload,
   j as useFullScreenContext,
-  k as useOpenFileContext,
-  p as usePaginationContext,
+  V as useOpenFileContext,
+  m as usePaginationContext,
   O as usePdfProperties,
-  f as usePrintContext,
-  w as useRotationContext,
-  m as useSearchContext,
-  Z as useViewModeContext,
-  y as useZoomContext
+  p as usePrintContext,
+  g as useRotationContext,
+  f as useSearchContext,
+  S as useViewModeContext,
+  k as useZoomContext
 };

package/dist/types/contexts/ViewportContext.d.ts

@@ -22,6 +22,7 @@ interface ViewportContextType extends ViewportState {
 interface ViewportProviderProps {
     children: React.ReactNode;
     mobileWidth?: number;
+    containerRef: HTMLElement | null;
 }
 export declare const ViewportProvider: React.FC<ViewportProviderProps>;
 export declare const useViewportContext: () => ViewportContextType;

package/dist/types/main.d.ts

@@ -20,4 +20,4 @@ export { usePdfProperties } from './utils/hooks/usePdfProperties';
 export { useFullScreenContext } from './contexts/FullScreenContext';
 export { type PDFDocumentProxy } from 'pdfjs-dist';
 export type { RPConfigProps, RPThemeProps, RPProviderProps, RPLayoutProps, RPIcons, RPSlots, DarkModeProps, ZoomProps, ViewModeProps, DownloadToolProps, OpenFileToolProps, ScrollModeProps, PageNavigationToolProps, PrintToolProps, Localization, MatchValue } from './utils/types';
-export { ViewMode, ScrollMode } from './utils/types';
+export { ViewMode, ScrollMode, ZoomLevel } from './utils/types';

package/dist/utils/hooks/useLicense.js

@@ -1,6 +1,6 @@
 import { useState as g, useCallback as E, useEffect as h } from "react";
 import { appConsole as l } from "../appConsole.js";
-const A = /* @__PURE__ */ new Date("2025-02-26T10:08:29.736Z"), d = "Please visit https://www.react-pdf.dev/license-management/ to generate a new license key.", o = {
+const A = /* @__PURE__ */ new Date("2025-02-27T08:25:37.384Z"), d = "Please visit https://www.react-pdf.dev/license-management/ to generate a new license key.", o = {
   invalidLicense: `You are currently using without a valid license. ${d}`,
   mismatchedDomain: `Your license key is not valid for the current domain / IP. ${d}`,
   expired: `Your license key has expired. ${d}`,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pdf-viewer/react",
   "private": false,
-  "version": "0.9.0-beta.4",
+  "version": "0.9.0-beta.6",
   "keywords": [
     "component",
     "frontend",