@react-pdf-kit/viewer 0.0.0-experimental.0

package/dist/components/layout/toolbar/tools/more-options/ScrollModeTool.js

@@ -0,0 +1,73 @@
+import { jsx as i, Fragment as C, jsxs as n } from "react/jsx-runtime";
+import { useMemo as f } from "react";
+import e from "../../../../ui/RPTooltip.js";
+import { G as R } from "../../../../../index-4baea9b5.js";
+import { MenuItem as c } from "../../MenuItem.js";
+import { PageScrollingIcon as G } from "../../../../icons/PageScrollingIcon.js";
+import { VerticalScrollingIcon as O } from "../../../../icons/VerticalScrollingIcon.js";
+import { HorizontalScrollingIcon as T } from "../../../../icons/HorizontalScrollingIcon.js";
+import { useScrollModeContext as A } from "../../../../../contexts/ScrollModeContext.js";
+import { ViewMode as L, ScrollMode as o } from "../../../../../utils/types.js";
+import { CheckIcon as p } from "../../../../icons/CheckIcon.js";
+import { useViewModeContext as _ } from "../../../../../contexts/ViewModeContext.js";
+import { useLocalizationContext as E } from "../../../../../contexts/LocalizationContext.js";
+import "../../../../../index-c0faa594.js";
+import "react-dom";
+import "../../../../../index-e3ee9457.js";
+import "../../../../../floating-ui.react-dom-5ec29bd6.js";
+import "../../../../../index-655864a7.js";
+import "../../../../../utils/withRef.js";
+import "../../../../../Combination-54a77a7a.js";
+import "../../../../../clsx-0c6e471a.js";
+import "../../../../../utils/appConsole.js";
+import "../../../../../contexts/InitialStateContext.js";
+import "../../../../../de_DE-a553b162.js";
+import "../../../../../utils/hooks/useLocalization.js";
+const M = (h) => {
+  const { icons: S, isToolVisible: I = !0 } = h, { pageScrollIcon: d, verticalScrollIcon: a, horizontalScrollIcon: u } = S ?? {}, { viewMode: m } = _(), { scrollMode: t, setScrollMode: l } = A(), { localeMessages: r } = E(), N = f(() => m === L.DUAL_PAGE || m === L.DUAL_PAGE_WITH_COVER, [m]);
+  return I ? /* @__PURE__ */ i(C, { children: /* @__PURE__ */ n(R, { children: [
+    /* @__PURE__ */ i(
+      c,
+      {
+        onClick: () => l(o.PAGE_SCROLLING),
+        "aria-label": r == null ? void 0 : r.pageScrollingTooltip,
+        "aria-checked": t === o.PAGE_SCROLLING,
+        children: /* @__PURE__ */ n(e, { className: "rp-menu-item", content: r == null ? void 0 : r.pageScrollingTooltip, children: [
+          /* @__PURE__ */ i("div", { className: "rp-menu-item-left", children: d || /* @__PURE__ */ i(G, { "aria-hidden": "true" }) }),
+          r == null ? void 0 : r.pageScrollingLabel,
+          t === o.PAGE_SCROLLING ? /* @__PURE__ */ i(p, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ i(
+      c,
+      {
+        onClick: () => l(o.VERTICAL_SCROLLING),
+        "aria-label": r == null ? void 0 : r.verticalScrollingTooltip,
+        "aria-checked": t === o.VERTICAL_SCROLLING,
+        children: /* @__PURE__ */ n(e, { className: "rp-menu-item", content: r == null ? void 0 : r.verticalScrollingTooltip, children: [
+          /* @__PURE__ */ i("div", { className: "rp-menu-item-left", children: a || /* @__PURE__ */ i(O, { "aria-hidden": "true" }) }),
+          r == null ? void 0 : r.verticalScrollingLabel,
+          t === o.VERTICAL_SCROLLING ? /* @__PURE__ */ i(p, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ i(
+      c,
+      {
+        disabled: N,
+        onClick: () => l(o.HORIZONTAL_SCROLLING),
+        "aria-label": r == null ? void 0 : r.horizontalTooltip,
+        "aria-checked": t === o.HORIZONTAL_SCROLLING,
+        children: /* @__PURE__ */ n(e, { className: "rp-menu-item", content: r == null ? void 0 : r.horizontalTooltip, children: [
+          /* @__PURE__ */ i("div", { className: "rp-menu-item-left", children: u || /* @__PURE__ */ i(T, { "aria-hidden": "true" }) }),
+          r == null ? void 0 : r.horizontalLabel,
+          t === o.HORIZONTAL_SCROLLING ? /* @__PURE__ */ i(p, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    )
+  ] }) }) : null;
+};
+export {
+  M as ScrollModeTool
+};

package/dist/components/layout/toolbar/tools/more-options/SelectionModeTool.js

@@ -0,0 +1,58 @@
+import { jsx as o, Fragment as T, jsxs as e } from "react/jsx-runtime";
+import c from "../../../../ui/RPTooltip.js";
+import { G as f } from "../../../../../index-4baea9b5.js";
+import { TextSelectionDefaultIcon as x } from "../../../../icons/TextSelectionDefaultIcon.js";
+import { HandModeDefaultIcon as S } from "../../../../icons/HandModeDefaultIcon.js";
+import { CheckIcon as d } from "../../../../icons/CheckIcon.js";
+import { MenuItem as l } from "../../MenuItem.js";
+import { SelectionMode as i } from "../../../../../utils/types.js";
+import { MenuSeparator as N } from "../../MenuSeparator.js";
+import { useSelectionModeContext as I } from "../../../../../contexts/SelectionModeContext.js";
+import { useLocalizationContext as b } from "../../../../../contexts/LocalizationContext.js";
+import "react";
+import "../../../../../index-c0faa594.js";
+import "react-dom";
+import "../../../../../index-e3ee9457.js";
+import "../../../../../floating-ui.react-dom-5ec29bd6.js";
+import "../../../../../index-655864a7.js";
+import "../../../../../utils/withRef.js";
+import "../../../../../Combination-54a77a7a.js";
+import "../../../../../clsx-0c6e471a.js";
+import "../../../../../de_DE-a553b162.js";
+import "../../../../../utils/appConsole.js";
+import "../../../../../utils/hooks/useLocalization.js";
+const Q = (a) => {
+  const { icons: u, isToolVisible: h = !0 } = a, { textSelectionIcon: n, handModeIcon: m } = u ?? {}, { selectionMode: r, setSelectionMode: p } = I(), { localeMessages: t } = b();
+  return h ? /* @__PURE__ */ o(T, { children: /* @__PURE__ */ e(f, { children: [
+    /* @__PURE__ */ o(
+      l,
+      {
+        onClick: () => p(i.TEXT),
+        "aria-label": t == null ? void 0 : t.textSelectionTooltip,
+        "aria-checked": r === i.TEXT,
+        children: /* @__PURE__ */ e(c, { className: "rp-menu-item", content: t == null ? void 0 : t.textSelectionTooltip, children: [
+          /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: n || /* @__PURE__ */ o(x, { "aria-hidden": "true" }) }),
+          t == null ? void 0 : t.textSelectionLabel,
+          r === i.TEXT ? /* @__PURE__ */ o(d, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ o(
+      l,
+      {
+        onClick: () => p(i.HAND),
+        "aria-label": t == null ? void 0 : t.handToolTooltip,
+        "aria-checked": r === i.HAND,
+        children: /* @__PURE__ */ e(c, { className: "rp-menu-item", content: t == null ? void 0 : t.handToolTooltip, children: [
+          /* @__PURE__ */ o("div", { className: "rp-menu-item-left", children: m || /* @__PURE__ */ o(S, { "aria-hidden": "true" }) }),
+          t == null ? void 0 : t.handToolLabel,
+          r === i.HAND ? /* @__PURE__ */ o(d, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ o(N, {})
+  ] }) }) : null;
+};
+export {
+  Q as SelectionModeTool
+};

package/dist/components/layout/toolbar/tools/more-options/ViewModeTool.js

@@ -0,0 +1,67 @@
+import { jsx as r, Fragment as g, jsxs as e } from "react/jsx-runtime";
+import { useMemo as L } from "react";
+import m from "../../../../ui/RPTooltip.js";
+import { G } from "../../../../../index-4baea9b5.js";
+import { MenuSeparator as T } from "../../MenuSeparator.js";
+import { MenuItem as n } from "../../MenuItem.js";
+import { DualPageIcon as b } from "../../../../icons/DualPageIcon.js";
+import { DualPageWithCoverIcon as v } from "../../../../icons/DualPageWithCoverIcon.js";
+import { SinglePageIcon as A } from "../../../../icons/SinglePageIcon.js";
+import { useViewModeContext as D } from "../../../../../contexts/ViewModeContext.js";
+import { ScrollMode as E, ViewMode as o } from "../../../../../utils/types.js";
+import { CheckIcon as l } from "../../../../icons/CheckIcon.js";
+import { useScrollModeContext as S } from "../../../../../contexts/ScrollModeContext.js";
+import { useLocalizationContext as _ } from "../../../../../contexts/LocalizationContext.js";
+import "../../../../../index-c0faa594.js";
+import "react-dom";
+import "../../../../../index-e3ee9457.js";
+import "../../../../../floating-ui.react-dom-5ec29bd6.js";
+import "../../../../../index-655864a7.js";
+import "../../../../../utils/withRef.js";
+import "../../../../../Combination-54a77a7a.js";
+import "../../../../../clsx-0c6e471a.js";
+import "../../../../../utils/appConsole.js";
+import "../../../../../contexts/InitialStateContext.js";
+import "../../../../../de_DE-a553b162.js";
+import "../../../../../utils/hooks/useLocalization.js";
+const ti = (h) => {
+  const { icons: P, isToolVisible: f = !0 } = h, { singlePageIcon: a, dualPageIcon: d, dualPageWithCoverIcon: p } = P ?? {}, { viewMode: t, setDualPage: C, setDualPageWithCover: I, setSinglePage: N } = D(), { scrollMode: u } = S(), { localeMessages: i } = _(), c = L(() => [E.HORIZONTAL_SCROLLING].includes(u), [u]);
+  return f ? /* @__PURE__ */ r(g, { children: /* @__PURE__ */ e(G, { children: [
+    /* @__PURE__ */ r(
+      n,
+      {
+        onClick: N,
+        "aria-label": i == null ? void 0 : i.singlePageTooltip,
+        "aria-checked": t === o.SINGLE_PAGE,
+        children: /* @__PURE__ */ e(m, { className: "rp-menu-item", content: i == null ? void 0 : i.singlePageTooltip, children: [
+          /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: a || /* @__PURE__ */ r(A, { "aria-hidden": "true" }) }),
+          i == null ? void 0 : i.singlePageLabel,
+          t === o.SINGLE_PAGE ? /* @__PURE__ */ r(l, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ r(
+      n,
+      {
+        disabled: c,
+        onClick: C,
+        "aria-label": i == null ? void 0 : i.dualPageTooltip,
+        "aria-checked": t === o.DUAL_PAGE,
+        children: /* @__PURE__ */ e(m, { className: "rp-menu-item", content: i == null ? void 0 : i.dualPageTooltip, children: [
+          /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: d || /* @__PURE__ */ r(b, { "aria-hidden": "true" }) }),
+          i == null ? void 0 : i.dualPageLabel,
+          t === o.DUAL_PAGE ? /* @__PURE__ */ r(l, { className: "rp-menu-item-right", "aria-hidden": "true" }) : null
+        ] })
+      }
+    ),
+    /* @__PURE__ */ r(n, { disabled: c, onClick: I, children: /* @__PURE__ */ e(m, { className: "rp-menu-item", content: i == null ? void 0 : i.dualPageWithCoverTooltip, children: [
+      /* @__PURE__ */ r("div", { className: "rp-menu-item-left", children: p || /* @__PURE__ */ r(v, {}) }),
+      i == null ? void 0 : i.dualPageWithCoverLabel,
+      t === o.DUAL_PAGE_WITH_COVER ? /* @__PURE__ */ r(l, { className: "rp-menu-item-right" }) : null
+    ] }) }),
+    /* @__PURE__ */ r(T, {})
+  ] }) }) : null;
+};
+export {
+  ti as ViewModeTool
+};

package/dist/components/page/AnnotationLayer.js

@@ -0,0 +1,145 @@
+import { jsx as P } from "react/jsx-runtime";
+import { useRef as b, useState as I, useMemo as S, useEffect as h, useCallback as R } from "react";
+import { u as j } from "../../PaginationContext-9217cab4.js";
+import { usePrintContext as O } from "../../contexts/PrintContext.js";
+import { AnnotationLayer as $ } from "pdfjs-dist";
+import { SimpleLinkService as A } from "../../utils/link_service.js";
+import { AnnotationSubType as D } from "../../utils/types.js";
+import { useScrollModeContext as _ } from "../../contexts/ScrollModeContext.js";
+import { insertDateText as J, annotationEventsHandler as N, handleAnnotationWidget as V, bindLayerEvents as W, fixTabIndexAccessibility as C, enhanceLinkAccessibility as L, unbindLayerEvents as M } from "../../utils/annotations.js";
+import { useInitialStateContext as H } from "../../contexts/InitialStateContext.js";
+import { useDocumentContext as U } from "../../contexts/RPDocumentContext.js";
+import { useFileDownload as q } from "../../utils/hooks/useFileDownload.js";
+import "../../utils/appConsole.js";
+import "../../contexts/GlobalCurrentPage.js";
+import "../../contexts/EventCallbackContext.js";
+import "../../contexts/ViewModeContext.js";
+import "../../de_DE-a553b162.js";
+import "../../contexts/VirtualScrollContext.js";
+import "../../contexts/VirtualGridContext.js";
+import "../../utils/smoothScrollTo.js";
+import "../../contexts/DimensionPagesContext.js";
+import "../../contexts/ZoomContext.js";
+import "../../utils/constants.js";
+import "../../utils/getZoomLevel.js";
+import "../../contexts/LayoutContainerContext.js";
+import "../../contexts/RotationContext.js";
+import "../../utils/hooks/useLoadPdf.js";
+import "../../utils/getThumbnailViewport.js";
+import "../../contexts/ConfigContext.js";
+import "../../contexts/DocumentPasswordContext.js";
+import "../../utils/hooks/usePdfProperties.js";
+import "../../utils/convertPdfDate.js";
+import "../../utils/formatFileSize.js";
+import "../../utils/hooks/useDebounce.js";
+import "../../contexts/PagesRotateContext.js";
+import "../../contexts/SmoothScrollContext.js";
+import "../../utils/getScrollDistance.js";
+import "../../utils/calculatePage.js";
+import "../../utils/hooks/usePrint.js";
+import "../../utils/sanitizeExternalUrl.js";
+import "../../utils/dateFormatter.js";
+import "../../contexts/DownloadContext.js";
+const z = {
+  "rp-annotation-layer": "_rp-annotation-layer_rwxfx_1"
+};
+let B = "https://unpkg.com/pdfjs-dist@4.4.168/web/images/";
+const Dt = (T) => {
+  const { pageNumber: l } = T, t = b(null), { pages: v, pdf: r } = U(), { interactiveForm: k } = H(), n = b(), [a, F] = I(), { goToPage: d } = j(), { scrollMode: E } = _(), { print: w } = O(), { download: y } = q(), c = b(null), e = S(() => v.get(l), [v, l]), u = S(() => e == null ? void 0 : e.page.getViewport(), [e]);
+  h(() => {
+    n.current && (n.current.div.replaceChildren(), n.current = void 0);
+  }, [r]), h(() => {
+    e && e.page.getAnnotations().then((o) => {
+      n.current = void 0, F(o), t.current && (t.current.innerText = "");
+    });
+  }, [e]);
+  const m = R(
+    (o) => {
+      !a || !r || (J(t.current), N(o, r, a).then((i) => {
+        var p, f;
+        ((p = i == null ? void 0 : i.data) == null ? void 0 : p.action) === "Print" ? w() : ((f = i == null ? void 0 : i.data) == null ? void 0 : f.action) === "SaveAs" && y();
+      }));
+    },
+    [r, a, E, w, y]
+  );
+  return h(() => {
+    if (!e || !a)
+      return;
+    const o = e.page.getViewport();
+    if (n.current) {
+      n.current.update({
+        viewport: o.clone({ dontFlip: !0 })
+      });
+      return;
+    }
+    const i = /* @__PURE__ */ new Map([]);
+    for (const s of a) {
+      const { annotationType: g } = s;
+      switch (g) {
+        case D.Widget:
+          V(s, o, i);
+          break;
+      }
+    }
+    const p = new AbortController();
+    return (async () => {
+      var x;
+      n.current && (n.current.div.replaceChildren(), n.current = void 0), t.current && (t.current.innerText = ""), n.current = new $({
+        div: t.current,
+        accessibilityManager: void 0,
+        annotationCanvasMap: void 0,
+        annotationEditorUIManager: void 0,
+        structTreeLayer: null,
+        page: e.page,
+        viewport: o.clone({ dontFlip: !0 }),
+        commentManager: void 0,
+        linkService: new A(r, d),
+        annotationStorage: r == null ? void 0 : r.annotationStorage
+      }), t.current && M(t.current, m);
+      const s = await (r == null ? void 0 : r.hasJSActions()), g = await (r == null ? void 0 : r.getFieldObjects());
+      if (p.signal.aborted)
+        throw "abort";
+      return (x = n.current) == null ? void 0 : x.render({
+        annotations: a,
+        annotationStorage: r == null ? void 0 : r.annotationStorage,
+        hasJSActions: s,
+        fieldObjects: g,
+        div: t.current,
+        viewport: o.clone({ dontFlip: !0 }),
+        page: e.page,
+        imageResourcesPath: B,
+        renderForms: k ?? !0,
+        linkService: new A(r, d),
+        downloadManager: null,
+        enableScripting: !1
+      });
+    })().then(() => {
+      t.current && (W(t.current, m), C(t.current), L(t.current), c.current && c.current.disconnect(), c.current = new MutationObserver(() => {
+        t.current && (C(t.current), L(t.current));
+      }), c.current.observe(t.current, {
+        childList: !0,
+        subtree: !0,
+        attributes: !0,
+        attributeFilter: ["tabindex", "href"]
+      }));
+    }).catch((s) => {
+      if (s !== "abort")
+        throw s;
+    }).finally(() => {
+      n.current = void 0;
+    }), () => {
+      p.abort("clear"), t.current && M(t.current, m), c.current && (c.current.disconnect(), c.current = null);
+    };
+  }, [r, a, m, d]), /* @__PURE__ */ P(
+    "div",
+    {
+      "data-rp": `page-${l}-annotationLayer`,
+      style: { width: `${u == null ? void 0 : u.width}px`, height: `${u == null ? void 0 : u.height}px` },
+      className: z["rp-annotation-layer"],
+      ref: t
+    }
+  );
+};
+export {
+  Dt as AnnotationLayer
+};

package/dist/components/page/CanvasLayer.js

@@ -0,0 +1,88 @@
+import { jsxs as C, Fragment as R, jsx as h } from "react/jsx-runtime";
+import { useRef as n, useCallback as S, useEffect as b } from "react";
+import { useDocumentContext as q } from "../../contexts/RPDocumentContext.js";
+import { usePagesRotateContext as F } from "../../contexts/PagesRotateContext.js";
+import { useRenderQueue as L } from "../../contexts/RenderQueueProvider.js";
+import { useInitialStateContext as $ } from "../../contexts/InitialStateContext.js";
+import { useSmoothScaleContext as j } from "../../contexts/SmoothScaleContext.js";
+import "../../utils/hooks/useLoadPdf.js";
+import "pdfjs-dist";
+import "../../utils/types.js";
+import "../../de_DE-a553b162.js";
+import "../../utils/getThumbnailViewport.js";
+import "../../contexts/ConfigContext.js";
+import "../../contexts/DocumentPasswordContext.js";
+import "../../utils/appConsole.js";
+import "../../utils/hooks/usePdfProperties.js";
+import "../../utils/convertPdfDate.js";
+import "../../utils/formatFileSize.js";
+import "../../contexts/RotationContext.js";
+import "../../contexts/EventCallbackContext.js";
+import "../../utils/Queue.js";
+import "../../utils/renderPage.js";
+import "../../PaginationContext-9217cab4.js";
+import "../../contexts/ScrollModeContext.js";
+import "../../contexts/GlobalCurrentPage.js";
+import "../../contexts/ViewModeContext.js";
+import "../../contexts/VirtualScrollContext.js";
+import "../../contexts/VirtualGridContext.js";
+import "../../utils/smoothScrollTo.js";
+import "../../contexts/DimensionPagesContext.js";
+import "../../contexts/ZoomContext.js";
+import "../../utils/constants.js";
+import "../../utils/getZoomLevel.js";
+import "../../contexts/LayoutContainerContext.js";
+import "../../utils/hooks/useDebounce.js";
+import "../../contexts/SmoothScrollContext.js";
+import "../../utils/getScrollDistance.js";
+import "../../utils/calculatePage.js";
+const ft = (x) => {
+  const { pageNumber: r, onLoaded: u, onLoading: i } = x, a = n(null), m = n(null), o = n("a"), { pages: p } = q(), { pageRotate: f } = F(), { renderedScale: s, isTransitioning: d } = j(), { interactiveForm: l } = $(), c = L(), g = n(`page-${r}`), v = S(() => {
+    const e = a.current, t = m.current;
+    !e || !t || (o.current === "a" ? (t.hidden = !1, e.hidden = !0, o.current = "b") : (e.hidden = !1, t.hidden = !0, o.current = "a"));
+  }, []);
+  return b(() => {
+    if (!p || s === 0 || d)
+      return;
+    const e = p.get(r);
+    if (!e)
+      return;
+    const t = o.current === "a" ? m.current : a.current;
+    if (t)
+      return t.hidden = !0, i && i(), c.enqueue(
+        g.current,
+        {
+          page: e.page,
+          canvasElem: t,
+          options: {
+            scale: s,
+            rotate: f[r],
+            renderForms: !0,
+            interactiveForm: l
+          },
+          onSwap: v,
+          onLoaded: u
+        },
+        3
+      ), () => {
+        c.removeQueue(g.current);
+      };
+  }, [
+    p,
+    r,
+    f,
+    s,
+    d,
+    i,
+    u,
+    c,
+    l,
+    v
+  ]), /* @__PURE__ */ C(R, { children: [
+    /* @__PURE__ */ h("canvas", { "data-rp": `page-${r}-canvas`, ref: a }),
+    /* @__PURE__ */ h("canvas", { "data-rp": `page-${r}-canvas`, ref: m, hidden: !0 })
+  ] });
+};
+export {
+  ft as CanvasLayer
+};

package/dist/components/page/CustomElement.js

@@ -0,0 +1,53 @@
+import { jsx as m, Fragment as s } from "react/jsx-runtime";
+import { useRef as u, useMemo as l, useEffect as c } from "react";
+import { useElementPageContext as f } from "../../contexts/ElementPageContext.js";
+import "../../utils/types.js";
+import "../../de_DE-a553b162.js";
+import "../../contexts/DimensionPagesContext.js";
+import "../../utils/appConsole.js";
+import "../../contexts/RPDocumentContext.js";
+import "../../utils/hooks/useLoadPdf.js";
+import "pdfjs-dist";
+import "../../utils/getThumbnailViewport.js";
+import "../../contexts/ConfigContext.js";
+import "../../contexts/DocumentPasswordContext.js";
+import "../../utils/hooks/usePdfProperties.js";
+import "../../utils/convertPdfDate.js";
+import "../../utils/formatFileSize.js";
+import "../../contexts/ZoomContext.js";
+import "../../contexts/InitialStateContext.js";
+import "../../utils/constants.js";
+import "../../utils/getZoomLevel.js";
+import "../../contexts/LayoutContainerContext.js";
+import "../../contexts/ViewModeContext.js";
+import "../../contexts/RotationContext.js";
+import "../../contexts/GlobalCurrentPage.js";
+import "../../contexts/EventCallbackContext.js";
+import "../../utils/hooks/useDebounce.js";
+import "../../contexts/PagesRotateContext.js";
+import "../../contexts/LicenseContext.js";
+import "../../utils/hooks/useLicense.js";
+import "../../utils/const.js";
+import "../../utils/getScrollDistance.js";
+import "../../contexts/ScrollModeContext.js";
+import "../../utils/getElementPositionInPage.js";
+import "../../contexts/VirtualScrollContext.js";
+const a = ({ child: t }) => {
+  const r = u(null);
+  return c(() => {
+    var i;
+    return (i = r.current) == null || i.appendChild(t), () => {
+      var o;
+      (o = r.current) == null || o.removeChild(t);
+    };
+  }, [t]), /* @__PURE__ */ m("div", { ref: r });
+}, X = ({ pageNumber: t }) => {
+  const { elementList: r } = f(), i = u(null), o = l(() => {
+    var e;
+    return (e = r[t]) == null ? void 0 : e.map((p, n) => p instanceof HTMLElement ? /* @__PURE__ */ m(a, { child: p }, n) : /* @__PURE__ */ m("div", { children: p }, n));
+  }, [r, t]);
+  return o ? /* @__PURE__ */ m(s, { children: /* @__PURE__ */ m("div", { ref: i, "data-rp": `page-${t}-customElement`, children: o.map((e) => e) }) }) : null;
+};
+export {
+  X as CustomElement
+};

package/dist/components/page/DualPage.js

@@ -0,0 +1,100 @@
+import { jsx as u } from "react/jsx-runtime";
+import { memo as h, useMemo as e } from "react";
+import { u as l } from "../../PaginationContext-9217cab4.js";
+import { RPPage as f } from "./RPPage.js";
+import "../../utils/types.js";
+import "../../de_DE-a553b162.js";
+import "../../contexts/ScrollModeContext.js";
+import "../../utils/appConsole.js";
+import "../../contexts/InitialStateContext.js";
+import "../../contexts/RPDocumentContext.js";
+import "../../utils/hooks/useLoadPdf.js";
+import "pdfjs-dist";
+import "../../utils/getThumbnailViewport.js";
+import "../../contexts/ConfigContext.js";
+import "../../contexts/DocumentPasswordContext.js";
+import "../../utils/hooks/usePdfProperties.js";
+import "../../utils/convertPdfDate.js";
+import "../../utils/formatFileSize.js";
+import "../../contexts/GlobalCurrentPage.js";
+import "../../contexts/EventCallbackContext.js";
+import "../../contexts/ViewModeContext.js";
+import "../../contexts/VirtualScrollContext.js";
+import "../../contexts/VirtualGridContext.js";
+import "../../utils/smoothScrollTo.js";
+import "../../contexts/DimensionPagesContext.js";
+import "../../contexts/ZoomContext.js";
+import "../../utils/constants.js";
+import "../../utils/getZoomLevel.js";
+import "../../contexts/LayoutContainerContext.js";
+import "../../contexts/RotationContext.js";
+import "../../utils/hooks/useDebounce.js";
+import "../../contexts/PagesRotateContext.js";
+import "../../contexts/SmoothScrollContext.js";
+import "../../utils/getScrollDistance.js";
+import "../../utils/calculatePage.js";
+import "./CanvasLayer.js";
+import "../../contexts/RenderQueueProvider.js";
+import "../../utils/Queue.js";
+import "../../utils/renderPage.js";
+import "../../contexts/SmoothScaleContext.js";
+import "./TextLayer.js";
+import "../../utils/highlight.js";
+import "../../utils/charators.js";
+import "../../contexts/SearchContext.js";
+import "../../utils/hooks/useSearch.js";
+import "../../utils/getWordPositionInPage.js";
+import "./AnnotationLayer.js";
+import "../../contexts/PrintContext.js";
+import "../../utils/hooks/usePrint.js";
+import "../../utils/link_service.js";
+import "../../utils/annotations.js";
+import "../../utils/sanitizeExternalUrl.js";
+import "../../utils/dateFormatter.js";
+import "../../utils/hooks/useFileDownload.js";
+import "../../contexts/DownloadContext.js";
+import "../../contexts/LayerContext.js";
+import "../../contexts/LoaderContext.js";
+import "../icons/LoaderIcon.js";
+import "../../clsx-0c6e471a.js";
+import "./TextHighlightLayer.js";
+import "../../contexts/HighlightContext.js";
+import "../../utils/hooks/useHighlight.js";
+import "./searchHighlight.js";
+import "../../utils/const.js";
+import "./CustomElement.js";
+import "../../contexts/ElementPageContext.js";
+import "../../contexts/LicenseContext.js";
+import "../../utils/hooks/useLicense.js";
+import "../../utils/getElementPositionInPage.js";
+import "../../utils/withRef.js";
+const kt = h(({ widths: m, heights: s }) => {
+  const { focusedPage: r, totalPages: n } = l(), a = e(() => {
+    const t = [], o = Math.ceil(r / 2) * 2 - 1;
+    if (t.push(o), o + 1 <= n) {
+      const i = o + 1;
+      t.push(i);
+    }
+    return t;
+  }, [r, n]), p = e(() => {
+    const t = r % 2 === 1 ? r - 1 : r - 2, o = Math.floor(t / 2), i = s(o), c = m(t), d = m(t + 1);
+    return [
+      {
+        position: "absolute",
+        left: 0,
+        width: c,
+        height: i
+      },
+      {
+        position: "absolute",
+        left: c,
+        width: d,
+        height: i
+      }
+    ];
+  }, [m, s, a]), g = e(() => p.reduce((t, o) => t + Number(o.width || 0), 0), [p]);
+  return /* @__PURE__ */ u("div", { style: { width: g, position: "relative" }, children: a.map((t, o) => /* @__PURE__ */ u(f, { style: p[o], pageNumber: t }, t)) });
+});
+export {
+  kt as DualPage
+};