@react-pdf-kit/viewer 2.5.0-beta.1 → 2.5.0-beta.2

package/dist/components/layout/sidebar/Thumbnail.js

@@ -1,11 +1,12 @@
-import { jsxs as k, jsx as r } from "react/jsx-runtime";
-import { useRef as h, useState as N, useMemo as _, useCallback as S, useEffect as w } from "react";
-import { c as I } from "../../../clsx-0c6e471a.js";
-import { LoaderIcon as L } from "../../icons/LoaderIcon.js";
-import { u as j } from "../../../PaginationContext-87f832f2.js";
-import { usePagesRotateContext as q } from "../../../contexts/PagesRotateContext.js";
-import { useRenderQueue as D } from "../../../contexts/RenderQueueProvider.js";
-import { useDocumentContext as M } from "../../../contexts/RPDocumentContext.js";
+import { jsxs as _, jsx as r } from "react/jsx-runtime";
+import { useRef as h, useState as z, useMemo as w, useCallback as N, useEffect as $ } from "react";
+import { c as S } from "../../../clsx-0c6e471a.js";
+import { LoaderIcon as I } from "../../icons/LoaderIcon.js";
+import { u as L } from "../../../PaginationContext-87f832f2.js";
+import { usePagesRotateContext as T } from "../../../contexts/PagesRotateContext.js";
+import { useRenderQueue as j } from "../../../contexts/RenderQueueProvider.js";
+import { useDocumentContext as q } from "../../../contexts/RPDocumentContext.js";
+import { CustomThumbnailElement as D } from "./CustomThumbnailElement.js";
 import "../../../utils/types.js";
 import "../../../de_DE-8145915f.js";
 import "../../../contexts/ScrollModeContext.js";
@@ -38,33 +39,38 @@ import "../../../utils/getScrollDistance.js";
 import "../../../utils/calculatePage.js";
 import "../../../utils/Queue.js";
 import "../../../utils/renderPage.js";
+import "../../../contexts/ElementThumbnailContext.js";
+import "../../../contexts/LicenseContext.js";
+import "../../../utils/hooks/useLicense.js";
+import "../../../contexts/ThumbnailsContext.js";
+import "../../../utils/hooks/useThumbnail.js";
 const i = {
-  "rp-thumbnail-wrapper": "_rp-thumbnail-wrapper_3fenb_1",
-  "rp-thumbnail-text": "_rp-thumbnail-text_3fenb_10",
-  "rp-thumbnail": "_rp-thumbnail_3fenb_1",
-  "rp-thumbnail-active": "_rp-thumbnail-active_3fenb_22",
-  "rp-thumbnail-loader": "_rp-thumbnail-loader_3fenb_31"
-}, Pt = ($) => {
-  const { pageNumber: t, isFocused: p, viewport: s } = $, { goToPage: d } = j(), { pageRotate: P } = q(), o = h(null), n = D(), { pages: a } = M(), [m, b] = N(null), c = h(!1), f = h(), R = _(() => p ? i["rp-thumbnail-active"] : "", [p]), u = _(() => ({
+  "rp-thumbnail-wrapper": "_rp-thumbnail-wrapper_czi7p_1",
+  "rp-thumbnail-text": "_rp-thumbnail-text_czi7p_10",
+  "rp-thumbnail": "_rp-thumbnail_czi7p_1",
+  "rp-thumbnail-active": "_rp-thumbnail-active_czi7p_23",
+  "rp-thumbnail-loader": "_rp-thumbnail-loader_czi7p_32"
+}, Nt = (C) => {
+  const { pageNumber: t, isFocused: u, viewport: s } = C, { goToPage: d } = L(), { pageRotate: P } = T(), o = h(null), n = j(), { pages: a } = q(), [m, b] = z(null), c = h(!1), g = h(), R = w(() => u ? i["rp-thumbnail-active"] : "", [u]), p = w(() => ({
     width: Math.round(s.width),
     height: Math.round(s.height)
-  }), [s]), g = S(() => {
+  }), [s]), f = N(() => {
     t && d(t);
   }, [d, t]);
-  return w(() => {
+  return $(() => {
     const e = a.get(t);
-    f.current === e || (b(null), f.current = e);
-  }, [a, t]), w(() => {
+    g.current === e || (b(null), g.current = e);
+  }, [a, t]), $(() => {
     const e = a.get(t);
     if (!o.current || !t || !e || m)
       return;
     const l = new IntersectionObserver((y) => {
-      y.forEach((C) => {
+      y.forEach((E) => {
         if (c.current) {
           c.current = !1, n.removeQueue(`thumbnail-${t}`);
           return;
         }
-        if (C.isIntersecting) {
+        if (E.isIntersecting) {
           const v = document.createElement("canvas");
           c.current = !0, n.enqueue(
             `thumbnail-${t}`,
@@ -78,8 +84,8 @@ const i = {
                 v.toBlob((x) => {
                   if (!x)
                     return;
-                  const E = URL.createObjectURL(x);
-                  b(E);
+                  const k = URL.createObjectURL(x);
+                  b(k);
                 });
               }
             },
@@ -91,12 +97,12 @@ const i = {
     return o.current && l.observe(o.current), () => {
       l.disconnect(), n.removeQueue(`thumbnail-${t}`);
     };
-  }, [n, t, a, m]), /* @__PURE__ */ k(
+  }, [n, t, a, m]), /* @__PURE__ */ _(
     "div",
     {
-      onClick: g,
+      onClick: f,
       onKeyDown: (e) => {
-        (e.key === "Enter" || e.key === " ") && (e.preventDefault(), g());
+        (e.key === "Enter" || e.key === " ") && (e.preventDefault(), f());
       },
       id: `page-${t}`,
       className: i["rp-thumbnail-wrapper"],
@@ -104,36 +110,39 @@ const i = {
       role: "button",
       tabIndex: 0,
       "aria-label": `Go to page ${t}`,
-      "aria-current": p ? "page" : void 0,
+      "aria-current": u ? "page" : void 0,
       children: [
-        /* @__PURE__ */ r(
+        /* @__PURE__ */ _(
           "div",
           {
             style: {
               transform: `rotate(${P[t || 0]}deg)`
             },
-            className: I(R, i["rp-thumbnail"]),
+            className: S(R, i["rp-thumbnail"]),
             "aria-hidden": "true",
-            children: m ? /* @__PURE__ */ r(
-              "img",
-              {
-                src: m,
-                width: u.width,
-                height: u.height,
-                alt: `Page ${t} thumbnail`,
-                "aria-hidden": "true"
-              }
-            ) : /* @__PURE__ */ r(
-              "div",
-              {
-                className: i["rp-thumbnail-loader"],
-                style: {
-                  width: `${u.width}px`,
-                  height: `${u.height}px`
-                },
-                children: /* @__PURE__ */ r(L, { "aria-hidden": "true" })
-              }
-            )
+            children: [
+              m ? /* @__PURE__ */ r(
+                "img",
+                {
+                  src: m,
+                  width: p.width,
+                  height: p.height,
+                  alt: `Page ${t} thumbnail`,
+                  "aria-hidden": "true"
+                }
+              ) : /* @__PURE__ */ r(
+                "div",
+                {
+                  className: i["rp-thumbnail-loader"],
+                  style: {
+                    width: `${p.width}px`,
+                    height: `${p.height}px`
+                  },
+                  children: /* @__PURE__ */ r(I, { "aria-hidden": "true" })
+                }
+              ),
+              /* @__PURE__ */ r(D, { pageNumber: t })
+            ]
           }
         ),
         /* @__PURE__ */ r("div", { className: i["rp-thumbnail-text"], "aria-hidden": "true", children: t })
@@ -142,5 +151,5 @@ const i = {
   );
 };
 export {
-  Pt as Thumbnail
+  Nt as Thumbnail
 };

package/dist/components/layout/sidebar/Thumbnails.js

@@ -1,10 +1,11 @@
-import { jsx as s } from "react/jsx-runtime";
-import { useRef as b, useImperativeHandle as v, useMemo as N, useCallback as x, useEffect as R } from "react";
+import { jsx as e } from "react/jsx-runtime";
+import { useRef as d, useImperativeHandle as R, useEffect as T, useMemo as x, useCallback as C } from "react";
 import { Thumbnail as y } from "./Thumbnail.js";
-import { useThumbnailContext as C } from "../../../contexts/ThumbnailsContext.js";
-import { useInfiniteScroll as I } from "../../../utils/hooks/useInfiniteScroll.js";
-import { u as S } from "../../../PaginationContext-87f832f2.js";
-import { withRef as j } from "../../../utils/withRef.js";
+import { useThumbnailContext as I } from "../../../contexts/ThumbnailsContext.js";
+import { useInfiniteScroll as S } from "../../../utils/hooks/useInfiniteScroll.js";
+import { u as j } from "../../../PaginationContext-87f832f2.js";
+import { useThumbnailContainerRegister as z } from "../../../contexts/ElementThumbnailContext.js";
+import { withRef as D } from "../../../utils/withRef.js";
 import "../../../clsx-0c6e471a.js";
 import "../../icons/LoaderIcon.js";
 import "../../../contexts/PagesRotateContext.js";
@@ -42,37 +43,40 @@ import "../../../utils/hooks/useDebounce.js";
 import "../../../contexts/SmoothScrollContext.js";
 import "../../../utils/getScrollDistance.js";
 import "../../../utils/calculatePage.js";
+import "./CustomThumbnailElement.js";
 import "../../../utils/hooks/useThumbnail.js";
-const d = {
+import "../../../contexts/LicenseContext.js";
+import "../../../utils/hooks/useLicense.js";
+const P = {
   "rp-thumbnails-container": "_rp-thumbnails-container_1szrf_1",
   "rp-thumbnails": "_rp-thumbnails_1szrf_1"
-}, z = 16, D = (r, n) => {
-  const t = r == null ? void 0 : r.querySelector(`#page-${n}`);
-  r && (t != null && t.offsetTop) && (r.scrollTop = (t == null ? void 0 : t.offsetTop) - z);
-}, xt = j((r, n) => {
-  const { show: t, width: T } = r, { focusedPage: i, totalPages: a } = S(), { thumbnailPages: e, addPage: u, thumbnailLength: m, addToPage: c } = C(), p = b(null), l = b(1);
-  v(n, () => p.current);
-  const f = N(() => Object.values(e), [e]), P = x(() => {
+}, M = 16, O = (r, p) => {
+  const t = r == null ? void 0 : r.querySelector(`#page-${p}`);
+  r && (t != null && t.offsetTop) && (r.scrollTop = (t == null ? void 0 : t.offsetTop) - M);
+}, jt = D((r, p) => {
+  const { show: t, width: _ } = r, { focusedPage: i, totalPages: a } = j(), { thumbnailPages: u, addPage: c, thumbnailLength: m, addToPage: l } = I(), s = z(), n = d(null), f = d(1);
+  R(p, () => n.current), T(() => (s(n.current), () => s(null)), [s]);
+  const h = x(() => Object.values(u), [u]), v = C(() => {
     const o = m + 1;
-    o <= a && u(o);
-  }, [u, a, m]);
-  return R(() => {
-    i > m && a > m ? c(i) : t && l.current !== i && (D(p.current, i), l.current = i);
-  }, [i, m, c, t, f]), I(p.current, P), /* @__PURE__ */ s("div", { ref: p, className: d["rp-thumbnails-container"], style: { width: T }, children: /* @__PURE__ */ s("div", { className: d["rp-thumbnails"], children: t ? f.map((o, _) => {
-    var g, h;
-    return /* @__PURE__ */ s(
+    o <= a && c(o);
+  }, [c, a, m]);
+  return T(() => {
+    i > m && a > m ? l(i) : t && f.current !== i && (O(n.current, i), f.current = i);
+  }, [i, m, l, t, h]), S(n.current, v), /* @__PURE__ */ e("div", { ref: n, className: P["rp-thumbnails-container"], style: { width: _ }, children: /* @__PURE__ */ e("div", { className: P["rp-thumbnails"], children: t ? h.map((o, N) => {
+    var b, g;
+    return /* @__PURE__ */ e(
       y,
       {
-        isFocused: i === ((g = o.page) == null ? void 0 : g.pageNumber),
-        pageNumber: (h = o.page) == null ? void 0 : h.pageNumber,
+        isFocused: i === ((b = o.page) == null ? void 0 : b.pageNumber),
+        pageNumber: (g = o.page) == null ? void 0 : g.pageNumber,
         loading: o.loading,
         viewport: o.viewport,
         defaultRotation: o.defaultRotation
       },
-      _
+      N
     );
   }) : null }) });
 });
 export {
-  xt as Thumbnails
+  jt as Thumbnails
 };

package/dist/components/layout/toolbar/ToolbarCustom.js

@@ -46,14 +46,18 @@ import "../../../utils/calculatePage.js";
 import "../../../contexts/RenderQueueProvider.js";
 import "../../../utils/Queue.js";
 import "../../../utils/renderPage.js";
+import "../sidebar/CustomThumbnailElement.js";
+import "../../../contexts/ElementThumbnailContext.js";
+import "../../../contexts/LicenseContext.js";
+import "../../../utils/hooks/useLicense.js";
+import "../../../utils/hooks/useThumbnail.js";
 import "../../../utils/hooks/useInfiniteScroll.js";
 import "../../../utils/withRef.js";
-import "../../../utils/hooks/useThumbnail.js";
 import "../../../utils/hooks/usePrint.js";
 import "../../../contexts/LocalizationContext.js";
 import "../../../utils/hooks/useLocalization.js";
 import "../../../contexts/ViewportContext.js";
-const Fr = (h) => {
+const jr = (h) => {
   const { children: u, toolbar: b } = h, n = d(null), { active: a } = x(), { showPrintProgress: f } = C(), { progress: g, showDefaultProgress: w } = R(), { percentage: s } = g || {}, o = b, m = o == null ? void 0 : o.topbar, p = o == null ? void 0 : o.leftSidebar, l = d(null), [c, P] = N(I), v = w ?? f;
   return /* @__PURE__ */ i(e, { children: [
     /* @__PURE__ */ i("div", { className: t["rp-toolbar-layout"], children: [
@@ -106,5 +110,5 @@ const Fr = (h) => {
   ] });
 };
 export {
-  Fr as ToolbarCustom
+  jr as ToolbarCustom
 };

package/dist/components/layout/toolbar/ToolbarDefault.js

@@ -48,9 +48,13 @@ import "../../../utils/calculatePage.js";
 import "../../../contexts/RenderQueueProvider.js";
 import "../../../utils/Queue.js";
 import "../../../utils/renderPage.js";
+import "../sidebar/CustomThumbnailElement.js";
+import "../../../contexts/ElementThumbnailContext.js";
+import "../../../contexts/LicenseContext.js";
+import "../../../utils/hooks/useLicense.js";
+import "../../../utils/hooks/useThumbnail.js";
 import "../../../utils/hooks/useInfiniteScroll.js";
 import "../../../utils/withRef.js";
-import "../../../utils/hooks/useThumbnail.js";
 import "../../../contexts/IconToolContext.js";
 import "../../../contexts/ToolComponentContext.js";
 import "./ThumbnailTool.js";
@@ -144,7 +148,7 @@ import "../../icons/HandModeDefaultIcon.js";
 import "../../../contexts/SelectionModeContext.js";
 import "../../../utils/hooks/usePrint.js";
 import "../../../RPToolbar.module-27d7fe77.js";
-const co = (l) => {
+const fo = (l) => {
   const { children: c } = l, i = s(null), { active: m } = w(), { showPrintProgress: d } = v(), { progress: h, showDefaultProgress: u } = x(), { percentage: p } = h || {}, e = s(null), [a, b] = P(D), f = u ?? d;
   return /* @__PURE__ */ o(n, { children: [
     /* @__PURE__ */ o("div", { className: t["rp-toolbar-layout"], children: [
@@ -189,5 +193,5 @@ const co = (l) => {
   ] });
 };
 export {
-  co as ToolbarDefault
+  fo as ToolbarDefault
 };

package/dist/components/layout/toolbar/ToolbarLayout.js

@@ -43,6 +43,10 @@ import "../../../utils/calculatePage.js";
 import "../../../contexts/RenderQueueProvider.js";
 import "../../../utils/Queue.js";
 import "../../../utils/renderPage.js";
+import "../sidebar/CustomThumbnailElement.js";
+import "../../../contexts/ElementThumbnailContext.js";
+import "../../../contexts/LicenseContext.js";
+import "../../../utils/hooks/useLicense.js";
 import "../../../contexts/ThumbnailsContext.js";
 import "../../../utils/hooks/useThumbnail.js";
 import "../../../utils/hooks/useInfiniteScroll.js";
@@ -146,10 +150,10 @@ import "../../../contexts/SelectionModeContext.js";
 import "../../../RPToolbar.module-27d7fe77.js";
 import "../../ui/LoadingIndicator.js";
 import "../../../RPSplitter-b62772f9.js";
-const Vr = (m) => {
+const Zr = (m) => {
   const { children: r, toolbar: o } = m;
   return o && typeof o == "boolean" ? /* @__PURE__ */ t(i, { children: r }) : /* @__PURE__ */ t(p, { toolbar: o, children: r });
 };
 export {
-  Vr as ToolbarLayout
+  Zr as ToolbarLayout
 };

package/dist/components/layout/toolbar/tools/DualPageWithCoverTool.js

@@ -30,6 +30,7 @@ import "../../../../contexts/LicenseContext.js";
 import "../../../../contexts/DownloadContext.js";
 import "../../../../contexts/SmoothScrollContext.js";
 import "../../../../contexts/ElementPageContext.js";
+import "../../../../contexts/ElementThumbnailContext.js";
 import "../../../../contexts/PagesRotateContext.js";
 import "../../../../contexts/RenderQueueProvider.js";
 import "../../../../contexts/GlobalCurrentPage.js";
@@ -184,11 +185,12 @@ import "../../../icons/CloseIcon.js";
 import "../../sidebar/RPSidebar.js";
 import "../../../icons/Thumbnail.js";
 import "../../sidebar/Thumbnail.js";
+import "../../sidebar/CustomThumbnailElement.js";
 import "../../../../utils/hooks/useInfiniteScroll.js";
 import "../../../icons/LightPdfIcon.js";
 import "../../../icons/DarkPdfIcon.js";
 import "../../../../utils/hooks/useDropFileZone.js";
-const C = ({ children: t, className: i, localeMessages: o }) => /* @__PURE__ */ r(m, { className: i, content: o == null ? void 0 : o.dualPageWithCoverTooltip, children: t }), Gr = ({ icon: t }) => {
+const C = ({ children: t, className: i, localeMessages: o }) => /* @__PURE__ */ r(m, { className: i, content: o == null ? void 0 : o.dualPageWithCoverTooltip, children: t }), Jr = ({ icon: t }) => {
   const { setDualPageWithCover: i } = e(), { localeMessages: o } = u();
   return /* @__PURE__ */ r(C, { localeMessages: o, children: /* @__PURE__ */ r(
     p,
@@ -200,5 +202,5 @@ const C = ({ children: t, className: i, localeMessages: o }) => /* @__PURE__ */
   ) });
 };
 export {
-  Gr as DualPageWithCoverTool
+  Jr as DualPageWithCoverTool
 };

package/dist/components/layout/toolbar/tools/FirstPageTool.js

@@ -29,6 +29,7 @@ import "../../../../contexts/LicenseContext.js";
 import "../../../../contexts/DownloadContext.js";
 import "../../../../contexts/SmoothScrollContext.js";
 import "../../../../contexts/ElementPageContext.js";
+import "../../../../contexts/ElementThumbnailContext.js";
 import "../../../../contexts/PagesRotateContext.js";
 import "../../../../contexts/RenderQueueProvider.js";
 import "../../../../contexts/GlobalCurrentPage.js";
@@ -184,16 +185,17 @@ import "../../../icons/CloseIcon.js";
 import "../../sidebar/RPSidebar.js";
 import "../../../icons/Thumbnail.js";
 import "../../sidebar/Thumbnail.js";
+import "../../sidebar/CustomThumbnailElement.js";
 import "../../../../utils/hooks/useInfiniteScroll.js";
 import "../../../icons/LightPdfIcon.js";
 import "../../../icons/DarkPdfIcon.js";
 import "../../../../utils/hooks/useDropFileZone.js";
-const l = ({ children: t, className: r, localeMessages: o }) => /* @__PURE__ */ i(n, { className: r, content: o == null ? void 0 : o.firstPageTooltip, children: t }), Kr = ({ icon: t }) => {
+const l = ({ children: t, className: r, localeMessages: o }) => /* @__PURE__ */ i(n, { className: r, content: o == null ? void 0 : o.firstPageTooltip, children: t }), Qr = ({ icon: t }) => {
   const { goToPage: r } = f(), { localeMessages: o } = c(), m = p(() => {
     r(1);
   }, [r]);
   return /* @__PURE__ */ i(l, { localeMessages: o, children: /* @__PURE__ */ i(a, { onClick: m, "aria-label": o == null ? void 0 : o.firstPageTooltip, children: t || /* @__PURE__ */ i(T, { className: P["rp-go-to-Top"] }) }) });
 };
 export {
-  Kr as FirstPageTool
+  Qr as FirstPageTool
 };

package/dist/components/layout/toolbar/tools/LastPageTool.js

@@ -29,6 +29,7 @@ import "../../../../contexts/LicenseContext.js";
 import "../../../../contexts/DownloadContext.js";
 import "../../../../contexts/SmoothScrollContext.js";
 import "../../../../contexts/ElementPageContext.js";
+import "../../../../contexts/ElementThumbnailContext.js";
 import "../../../../contexts/PagesRotateContext.js";
 import "../../../../contexts/RenderQueueProvider.js";
 import "../../../../contexts/GlobalCurrentPage.js";
@@ -184,16 +185,17 @@ import "../../../icons/CloseIcon.js";
 import "../../sidebar/RPSidebar.js";
 import "../../../icons/Thumbnail.js";
 import "../../sidebar/Thumbnail.js";
+import "../../sidebar/CustomThumbnailElement.js";
 import "../../../../utils/hooks/useInfiniteScroll.js";
 import "../../../icons/LightPdfIcon.js";
 import "../../../icons/DarkPdfIcon.js";
 import "../../../../utils/hooks/useDropFileZone.js";
-const c = ({ children: t, className: r, localeMessages: o }) => /* @__PURE__ */ m(a, { className: r, content: o == null ? void 0 : o.lastPageTooltip, children: t }), Nr = ({ icon: t }) => {
+const c = ({ children: t, className: r, localeMessages: o }) => /* @__PURE__ */ m(a, { className: r, content: o == null ? void 0 : o.lastPageTooltip, children: t }), Qr = ({ icon: t }) => {
   const { goToPage: r, totalPages: o } = T(), { localeMessages: i } = f(), p = n(() => {
     r(o);
   }, [r, o]);
   return /* @__PURE__ */ m(c, { localeMessages: i, children: /* @__PURE__ */ m(P, { onClick: p, "aria-label": i == null ? void 0 : i.lastPageTooltip, children: t || /* @__PURE__ */ m(l, {}) }) });
 };
 export {
-  Nr as LastPageTool
+  Qr as LastPageTool
 };

package/dist/contexts/ElementThumbnailContext.js

@@ -0,0 +1,129 @@
+import { jsx as y } from "react/jsx-runtime";
+import { createContext as M, useState as O, useRef as x, useCallback as m, useContext as L, useMemo as B } from "react";
+import { LicenseType as D } from "../utils/types.js";
+import { usePagesRotateContext as I } from "./PagesRotateContext.js";
+import { useLicenseContext as G } from "./LicenseContext.js";
+import { useThumbnailContext as g } from "./ThumbnailsContext.js";
+import { useSmoothScrollContext as F } from "./SmoothScrollContext.js";
+import { ORGANIZATION_ALLOWED_FEATURES_MESSAGE as h } from "../utils/const.js";
+import "../de_DE-8145915f.js";
+import "./RPDocumentContext.js";
+import "../utils/hooks/useLoadPdf.js";
+import "pdfjs-dist";
+import "../utils/getThumbnailViewport.js";
+import "./ConfigContext.js";
+import "./DocumentPasswordContext.js";
+import "../utils/appConsole.js";
+import "../utils/hooks/usePdfProperties.js";
+import "../utils/convertPdfDate.js";
+import "../utils/formatFileSize.js";
+import "./RotationContext.js";
+import "./InitialStateContext.js";
+import "./EventCallbackContext.js";
+import "../utils/hooks/useLicense.js";
+import "../utils/hooks/useThumbnail.js";
+const U = 16, f = M(
+  void 0
+), mt = ({ children: r }) => {
+  const [a, s] = O({}), { pageRotate: n } = I(), { thumbnailPages: p } = g(), { scrollBehavior: E } = F(), d = x(null), w = m((e) => {
+    d.current = e;
+  }, []), R = m(
+    (e, i) => {
+      s((o) => {
+        var l;
+        const t = (l = p[e]) == null ? void 0 : l.viewport, c = {
+          width: t ? t.width : 0,
+          height: t ? t.height : 0
+        };
+        return {
+          ...o,
+          [e]: i(o[e] ?? [], c, n[e] ?? 0)
+        };
+      });
+    },
+    [p, n]
+  ), b = m((e) => {
+    s((i) => {
+      const o = { ...i };
+      return delete o[e], o;
+    });
+  }, []), A = m((e, i) => {
+    s((o) => {
+      const t = { ...o };
+      return t[e] ? (t[e] = t[e].filter((c, l) => l !== i), t) : o;
+    });
+  }, []), S = m(
+    (e, i, o) => {
+      var v;
+      const t = d.current;
+      if (!t)
+        return;
+      const c = t.querySelector(
+        `[data-rp="thumbnail-${e}-customElement"]`
+      ), l = (v = c == null ? void 0 : c.children) == null ? void 0 : v[i];
+      if (!l)
+        return;
+      const T = t.getBoundingClientRect(), C = l.getBoundingClientRect(), P = t.scrollTop + (C.top - T.top) - U, _ = t.scrollLeft + (C.left - T.left);
+      t.scrollTo({
+        top: Math.max(P, 0),
+        left: Math.max(_, 0),
+        behavior: (o == null ? void 0 : o.behavior) ?? E
+      });
+    },
+    [E]
+  );
+  return /* @__PURE__ */ y(
+    f.Provider,
+    {
+      value: {
+        updateElement: R,
+        clearElements: b,
+        removeElement: A,
+        elementList: a,
+        scrollToElement: S,
+        setThumbnailContainer: w
+      },
+      children: r
+    }
+  );
+}, u = () => {
+}, ut = () => {
+  const r = L(f);
+  return (r == null ? void 0 : r.setThumbnailContainer) ?? u;
+}, at = () => {
+  const r = L(f), { type: a, validating: s } = G(), n = x(0), p = B(() => {
+    if (s !== !1)
+      return {
+        updateElement: u,
+        clearElements: u,
+        removeElement: u,
+        elementList: {},
+        scrollToElement: u
+      };
+    if (!(a !== D.Developer))
+      return {
+        updateElement: () => {
+          n.current === 0 && (console.error(h), n.current++);
+        },
+        clearElements: () => {
+          n.current === 0 && (console.error(h), n.current++);
+        },
+        removeElement: () => {
+          n.current === 0 && (console.error(h), n.current++);
+        },
+        elementList: {},
+        scrollToElement: () => {
+          n.current === 0 && (console.error(h), n.current++);
+        }
+      };
+  }, [a, s]);
+  if (!r)
+    throw new Error("useElementThumbnailContext must be used within a ElementThumbnailProvider");
+  return p || r;
+};
+export {
+  f as ElementThumbnailContext,
+  mt as ElementThumbnailProvider,
+  at as useElementThumbnailContext,
+  ut as useThumbnailContainerRegister
+};