@pdf-viewer/react 0.9.0-beta.3 → 0.9.0-beta.5

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/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/utils/hooks/useLicense.js

@@ -1,94 +1,102 @@
-import { useState as g, useCallback as h, useEffect as v } from "react";
+import { useState as g, useCallback as E, useEffect as h } from "react";
 import { appConsole as l } from "../appConsole.js";
-const b = /* @__PURE__ */ new Date("2025-02-26T09:36:43.627Z"), d = "Please visit https://www.react-pdf.dev/license-management/ to generate a new license key.", o = {
+const A = /* @__PURE__ */ new Date("2025-02-27T04:59:26.050Z"), 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}`,
   exceededVersion: "Your license does not support the current version of React PDF. The library version you are using exceeds the supported range of your license.",
   invalidSignature: "Invalid license key: Signature mismatch"
 };
-function y(r) {
-  const i = r.replace(/-----BEGIN PUBLIC KEY-----/, "").replace(/-----END PUBLIC KEY-----/, "").replace(/\s+/g, ""), t = atob(i), n = new Uint8Array(t.length);
-  for (let e = 0; e < t.length; e++)
-    n[e] = t.charCodeAt(e);
+function b(r) {
+  const t = r.replace(/-----BEGIN PUBLIC KEY-----/, "").replace(/-----END PUBLIC KEY-----/, "").replace(/\s+/g, ""), i = atob(t), n = new Uint8Array(i.length);
+  for (let e = 0; e < i.length; e++)
+    n[e] = i.charCodeAt(e);
   return n.buffer;
 }
-function A(r) {
-  const i = atob(r), t = new Uint8Array(i.length);
-  for (let n = 0; n < i.length; n++)
-    t[n] = i.charCodeAt(n);
-  return t.buffer;
+function S(r) {
+  const t = atob(r), i = new Uint8Array(t.length);
+  for (let n = 0; n < t.length; n++)
+    i[n] = t.charCodeAt(n);
+  return i.buffer;
 }
-async function I(r, i = "SHA-256") {
+async function I(r, t = "SHA-256") {
   try {
-    const { data: t, signature: n } = JSON.parse(atob(r)), e = y("-----BEGIN PUBLIC KEY-----MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAyrIi83Zr5AKaWO6zbZmXqv3McVhtnPOnWCiFgf5xeaglLzEwMiXo3gALaPoBp5Q0WPOSBE9GTqwOyQUgpDNSBuQ0cjOzQdFM3GPnKSqQThZJfjUmD9egMZDmfhcpFGPybUoicoIEFQOdX2vMFUfn6yjRsyvbK6UPTombYl785V8dXNnnIHa4tQC1JSaSe/bhG3e/6kbQCy9VJ23242q9WJpx9c2sZ+bmyI0r9Zx0PfqcDJzDfKn45v96EtxGhV16OZhqkbj4ljiJ/mfqfCkxybkm9nvxz0hAwcEftQaxl/0cZ1RxtsRcL+V3msLsmGcs9nPqAuXecbfg9QVCi/+miwIDAQAB-----END PUBLIC KEY-----"), a = await window.crypto.subtle.importKey(
+    const { data: i, signature: n } = JSON.parse(atob(r)), e = b(`-----BEGIN PUBLIC KEY-----
+MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAvIokvErJ0Fctu0jduSAx
+gr+5Har/VSuZLlOunS28hnlqqA+OF1apHL7RYkjBosS15yvviYdLrVWYHpHnoY4b
+HLQ9I6YX6FMB9T/VbB4xLdVdKvfi8r49aTScl5EKuSpgpPgz2VSJTfvVGcRuth/Y
+Bm7PPGYdL2l2gvKDxchmmsHFPukGki9L4JOUeIVX0GXAxabENckaEH/iC1NZhX+W
+vXnpHeHuIIKlZ16LSivXNgo6BH2Z3GFdg4G3cAaXr6qNP8fsacYNqv2SpTW1viFD
+vzcGRabN25gpJAp9/syeScefWH3OiJY1lmw88oTiJbjIoiq6AkPhfn3G9mF54nvR
+kwIDAQAB
+-----END PUBLIC KEY-----`), a = await window.crypto.subtle.importKey(
       "spki",
       // str2ab(publicKeyContent), // Convert PEM string to ArrayBuffer
       e,
-      { name: "RSA-PSS", hash: i },
+      { name: "RSA-PSS", hash: t },
       !0,
       ["verify"]
     );
     if (!await window.crypto.subtle.verify(
       { name: "RSA-PSS", saltLength: 32 },
       a,
-      A(n),
+      S(n),
       // Convert signature to ArrayBuffer
-      new TextEncoder().encode(atob(t))
+      new TextEncoder().encode(atob(i))
     ))
       throw new Error(o.invalidSignature);
-    return JSON.parse(atob(t));
+    return JSON.parse(atob(i));
   } catch {
     throw new Error(o.invalidLicense);
   }
 }
-const L = (r, i) => r === "specific" ? i === window.location.host : window.location.host.includes(i), c = {
+const L = (r, t) => r === "specific" ? t === window.location.host : window.location.host.includes(t), c = {
   isValid: !1,
   invalidatedMessage: o.invalidLicense,
   type: void 0
-}, T = (r) => {
-  const [i, t] = g(c), n = h(async () => {
+}, N = (r) => {
+  const [t, i] = g(c), n = E(async () => {
     if (!r)
-      return t(c), c;
+      return i(c), c;
     try {
       const e = await I(r);
       l.debug(">>> validatedLicense", e);
-      const { avu: a, exp: s, dmt: m, dm: f, t: w } = e;
+      const { avu: a, exp: s, dmt: m, dm: p, t: v } = e;
       if (!s)
         throw new Error("License is missing expiration timestamp");
       if (s > Number.MAX_SAFE_INTEGER / 1e3)
         throw new Error("Invalid expiration timestamp: value too large");
-      const p = new Date(s * 1e3), E = (/* @__PURE__ */ new Date()).getTime();
-      if (p.getTime() < E)
+      const f = new Date(s * 1e3), w = (/* @__PURE__ */ new Date()).getTime();
+      if (f.getTime() < w)
         throw new Error(o.expired);
       if (!a)
         throw new Error("License is missing available until version timestamp");
       if (a > Number.MAX_SAFE_INTEGER / 1e3)
         throw new Error("Invalid available until version timestamp: value too large");
       const u = new Date(a * 1e3);
-      if (l.debug("availableUntilTimestamp", u), u.getTime() < b.getTime())
+      if (l.debug("availableUntilTimestamp", u), u.getTime() < A.getTime())
         throw new Error(o.exceededVersion);
-      if (!L(m, f))
+      if (!L(m, p))
         throw new Error(o.mismatchedDomain);
       return {
         isValid: !0,
-        type: w,
+        type: v,
         invalidatedMessage: void 0
       };
     } catch (e) {
       return l.warn(e.message), { ...c, invalidatedMessage: e.message };
     }
   }, [r]);
-  return v(() => {
+  return h(() => {
     n().then(({ isValid: e, type: a, invalidatedMessage: s }) => {
-      t({
+      i({
         isValid: e,
         type: a,
         invalidatedMessage: s
       });
     });
-  }, [n]), i;
+  }, [n]), t;
 };
 export {
-  T as useLicense
+  N as useLicense
 };

package/package.json

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