@pdf-viewer/react 1.12.0-beta.4 → 1.12.0-rc.1

package/dist/contexts/ElementPageContext.js

@@ -1,5 +1,5 @@
-import { jsx as k } from "react/jsx-runtime";
-import { createContext as z, useState as H, useCallback as d, useContext as N, useRef as U, useMemo as q } from "react";
+import { jsx as z } from "react/jsx-runtime";
+import { createContext as H, useState as N, useCallback as d, useContext as U, useRef as W, useMemo as q } from "react";
 import { ScrollMode as g, LicenseType as B } from "../utils/types.js";
 import { useDimensionPagesContext as J } from "./DimensionPagesContext.js";
 import { usePagesRotateContext as K } from "./PagesRotateContext.js";
@@ -31,8 +31,8 @@ import "../utils/hooks/useLicense.js";
 import "../utils/getZoomLevel.js";
 import "./GlobalCurrentPage.js";
 import "../utils/hooks/useDebounce.js";
-const S = z(void 0), Ve = ({ children: l }) => {
-  const [s, m] = H({}), { widths: t, heights: r } = J(), { pagesRef: c } = Y(), { scrollMode: C } = $(), { pageRotate: u } = K(), { currentZoom: a } = X(), { columnCount: R } = te(), { pageScrollElementRef: I, virtualScrollableElementRef: T } = oe(), M = d(
+const S = H(void 0), Ve = ({ children: l }) => {
+  const [s, m] = N({}), { widths: t, heights: r } = J(), { pagesRef: c } = Y(), { scrollMode: C } = $(), { pageRotate: u } = K(), { currentZoom: a } = X(), { columnCount: R } = te(), { pageScrollElementRef: I, virtualScrollableElementRef: T } = oe(), M = d(
     (e, i, o = { behavior: "smooth" }) => {
       var v;
       const n = T || I;
@@ -43,8 +43,8 @@ const S = z(void 0), Ve = ({ children: l }) => {
         return;
       let p = 0, P = 0;
       if (C === g.VERTICAL_SCROLLING) {
-        const f = e - 1, E = R, W = f % E, j = Math.floor(f / E);
-        p = w(r, j), P = w(t, W);
+        const f = e - 1, E = R, j = f % E, k = Math.floor(f / E);
+        p = w(r, k), P = w(t, j);
       }
       C === g.HORIZONTAL_SCROLLING && (P = t.slice(0, e - 1).reduce((f, E) => f + E, 0));
       const _ = {
@@ -93,7 +93,7 @@ const S = z(void 0), Ve = ({ children: l }) => {
       return n[e] = n[e].filter((L, p) => p !== i), n;
     });
   }, []);
-  return /* @__PURE__ */ k(
+  return /* @__PURE__ */ z(
     S.Provider,
     {
       value: { updateElement: A, clearElements: O, removeElement: y, elementList: s, scrollToElement: M },
@@ -102,7 +102,7 @@ const S = z(void 0), Ve = ({ children: l }) => {
   );
 }, h = () => {
 }, be = () => {
-  const l = N(S), { type: s, validating: m } = Q(), t = U(0), r = q(() => {
+  const l = U(S), { type: s, validating: m } = Q(), t = W(0), r = q(() => {
     if (m !== !1)
       return {
         updateElement: h,

package/dist/utils/getElementPositionInPage.js

@@ -1,41 +1,84 @@
-const g = (l, s, c, h, a) => {
-  let r = "center";
-  switch (h) {
+function g(e, o) {
+  !e || typeof e != "object" || Object.entries(e).forEach(([d, i]) => {
+    if (i == null)
+      return;
+    const s = d.replace(/([A-Z])/g, "-$1").toLowerCase(), n = [
+      "width",
+      "height",
+      "top",
+      "right",
+      "bottom",
+      "left",
+      "margin",
+      "margin-top",
+      "margin-right",
+      "margin-bottom",
+      "margin-left",
+      "padding",
+      "padding-top",
+      "padding-right",
+      "padding-bottom",
+      "padding-left",
+      "border-width",
+      "border-top-width",
+      "border-right-width",
+      "border-bottom-width",
+      "border-left-width",
+      "font-size",
+      "line-height",
+      "letter-spacing",
+      "word-spacing",
+      "min-width",
+      "min-height",
+      "max-width",
+      "max-height",
+      "flex-basis",
+      "grid-gap",
+      "grid-row-gap",
+      "grid-column-gap"
+    ];
+    let t;
+    typeof i == "number" && i !== 0 ? t = n.includes(s) ? `${i}px` : String(i) : t = String(i), o.style.setProperty(s, t);
+  });
+}
+const f = (e, o, d, i, s) => {
+  let n = "center";
+  switch (i) {
     case 90:
-      r = `${l.width / 2}px ${l.width / 2}px`;
+      n = `${e.width / 2}px ${e.width / 2}px`;
       break;
     case -90:
     case 270:
-      r = `${l.height / 2}px ${l.height / 2}px`;
+      n = `${e.height / 2}px ${e.height / 2}px`;
       break;
     default:
-      r = "center";
+      n = "center";
   }
   const t = document.createElement("div");
-  t.id = "parent-element", t.style.width = `${l.width}px`, t.style.height = `${l.height}px`, t.style.setProperty("--scale-factor", a.toString()), t.style.setProperty("--rotation", h.toString()), t.style.setProperty("--transform-origin", r), t.style.left = "-99999px", t.style.visibility = "hidden", t.style.position = "absolute";
-  const i = document.createElement("div");
-  i.style.position = "relative", i.style.width = "100%", i.style.height = "100%", t.appendChild(i);
-  let e;
-  if (c instanceof HTMLElement)
-    e = c.cloneNode(!0), i.appendChild(e);
+  t.id = "parent-element", t.style.width = `${e.width}px`, t.style.height = `${e.height}px`, t.style.setProperty("--scale-factor", s.toString()), t.style.setProperty("--rotation", i.toString()), t.style.setProperty("--transform-origin", n), t.style.left = "-99999px", t.style.visibility = "hidden", t.style.position = "absolute";
+  const l = document.createElement("div");
+  l.style.position = "relative", l.style.width = "100%", l.style.height = "100%", t.appendChild(l);
+  let r;
+  if (d instanceof HTMLElement)
+    r = d.cloneNode(!0), l.appendChild(r);
   else {
-    const o = c.props;
-    e = document.createElement("div"), o.style && Object.assign(e.style, o.style), o.className && (e.className = o.className), i.appendChild(e);
+    const p = d.props;
+    r = document.createElement("div"), p.style && g(p.style, r), p.className && (r.className = p.className), l.appendChild(r);
   }
-  s.appendChild(t);
-  const d = t.getBoundingClientRect(), n = e.getBoundingClientRect();
-  s.removeChild(t);
-  const p = {
-    top: s.clientHeight / 2,
-    left: s.clientWidth / 2
+  o.appendChild(t);
+  const c = t.getBoundingClientRect(), h = r.getBoundingClientRect();
+  o.removeChild(t);
+  const a = {
+    top: o.clientHeight / 2,
+    left: o.clientWidth / 2
   };
   return {
-    left: n.left - d.left - p.left + n.width / 2,
-    top: n.top - d.top - p.top + n.height / 2,
-    width: n.width,
-    height: n.height
+    left: h.left - c.left - a.left,
+    top: h.top - c.top - a.top,
+    width: h.width,
+    height: h.height
   };
 };
 export {
-  g as getElementPagePosition
+  f as getElementPagePosition
 };

package/dist/utils/hooks/useLicense.js

@@ -1,6 +1,6 @@
 import { useState as E, useCallback as h, useEffect as A } from "react";
 import { appConsole as l } from "../appConsole.js";
-const b = /* @__PURE__ */ new Date("2025-11-07T07:01:42.875Z"), d = "Please visit https://www.react-pdf.dev/manage-license/ to generate a new license key.", s = {
+const b = /* @__PURE__ */ new Date("2025-11-11T07:26:49.211Z"), d = "Please visit https://www.react-pdf.dev/manage-license/ to generate a new license key.", s = {
   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

@@ -2,7 +2,7 @@
   "name": "@pdf-viewer/react",
   "private": false,
   "description": "A react-pdf-viewer component for React and Next.js. Suitable for react-pdf document.",
-  "version": "1.12.0-beta.4",
+  "version": "1.12.0-rc.1",
   "keywords": [
     "react-pdf",
     "react-pdf-viewer",