@react-pdf-kit/viewer 2.0.0-rc.1 → 2.0.1-beta.0

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

@@ -1,25 +1,25 @@
-import { jsx as o, Fragment as at, jsxs as C } from "react/jsx-runtime";
-import { UIButton as ct } from "../../ui/Button.js";
+import { jsx as o, Fragment as pt, jsxs as x } from "react/jsx-runtime";
+import { UIButton as mt } from "../../ui/Button.js";
 import { SearchIcon as A } from "../../icons/SearchIcon.js";
-import { useState as b, useCallback as i, useEffect as l, useMemo as W } from "react";
-import { useLayoutContainer as pt } from "../../../contexts/LayoutContainerContext.js";
+import { useState as S, useCallback as i, useEffect as h, useMemo as W } from "react";
+import { useLayoutContainer as st } from "../../../contexts/LayoutContainerContext.js";
 import { c as n } from "../../../SearchTool.module-99f60dc7.js";
-import { UIInput as mt } from "../../ui/Input.js";
+import { UIInput as lt } from "../../ui/Input.js";
 import { UICheckbox as $ } from "../../ui/Checkbox.js";
 import { ClearIcon as ht } from "../../icons/ClearIcon.js";
-import { LoaderIcon as lt } from "../../icons/LoaderIcon.js";
-import { useSearchContext as st } from "../../../contexts/SearchContext.js";
-import { useIconContext as dt } from "../../../contexts/IconContext.js";
-import { useDocumentContext as ut } from "../../../contexts/RPDocumentContext.js";
-import E from "../../ui/RPTooltip.js";
-import { useToolbarComponentContext as ft } from "../../../contexts/ToolbarComponentContext.js";
-import { useLocalizationContext as It } from "../../../contexts/LocalizationContext.js";
+import { LoaderIcon as dt } from "../../icons/LoaderIcon.js";
+import { useSearchContext as ut } from "../../../contexts/SearchContext.js";
+import { useIconContext as F } from "../../../contexts/IconContext.js";
+import { useDocumentContext as ft } from "../../../contexts/RPDocumentContext.js";
+import v from "../../ui/RPTooltip.js";
+import { useToolbarComponentContext as It } from "../../../contexts/ToolbarComponentContext.js";
+import { useLocalizationContext as Ct } from "../../../contexts/LocalizationContext.js";
 import { InfoIcon as j } from "../../icons/InfoIcon.js";
-import { useViewportContext as Ct } from "../../../contexts/ViewportContext.js";
+import { useViewportContext as bt } from "../../../contexts/ViewportContext.js";
 import { SearchResultNavigator as q } from "./SearchResultNavigator.js";
 import { SearchCloseButton as z } from "./SearchCloseButton.js";
-import { UIDropDown as bt } from "../../ui/DropDown.js";
-import { useIconToolContext as xt } from "../../../contexts/IconToolContext.js";
+import { UIDropDown as xt } from "../../ui/DropDown.js";
+import { useIconToolContext as H } from "../../../contexts/IconToolContext.js";
 import { useToolComponentContext as St } from "../../../contexts/ToolComponentContext.js";
 import "../../../clsx-0c6e471a.js";
 import "../../../utils/withRef.js";
@@ -69,78 +69,81 @@ import "../../icons/CloseIcon.js";
 import "../../../index-61f59539.js";
 import "../../../Combination-136ff99c.js";
 const yt = () => {
-  const { searchIcon: x } = dt(), { searchIcon: v } = xt();
-  return x || v || /* @__PURE__ */ o(A, {});
-}, jo = ({ icon: x }) => {
-  const { container: v } = pt(), [s, L] = b(!1), { pdf: S } = ut(), [k, F] = b(null), {
+  const { searchIcon: s } = F(), { searchIcon: d } = H();
+  return s ?? d ?? /* @__PURE__ */ o(A, {});
+}, Tt = () => {
+  const { searchClearIcon: s } = F(), { searchClearIcon: d } = H();
+  return s ?? d ?? /* @__PURE__ */ o(ht, {});
+}, qo = ({ icon: s }) => {
+  const { container: d } = st(), [u, L] = S(!1), { pdf: y } = ft(), [k, G] = S(null), {
     searchOptions: D,
-    setSearchOptions: y,
-    loading: H,
+    setSearchOptions: T,
+    loading: J,
     setSearch: c,
     totalMatches: K,
     currentMatchPosition: B,
     nextMatch: O,
     prevMatch: P,
     search: e
-  } = st(), { searchTool: G = !0 } = ft(), { searchTool: J = !0 } = St(), [d, u] = b(e), { localeMessages: t } = It(), { isSmallScreen: f } = Ct(), [T, Q] = b(null), [X, Y] = b(!1), Z = i(() => {
+  } = ut(), { searchTool: Q = !0 } = It(), { searchTool: X = !0 } = St(), [f, I] = S(e), { localeMessages: t } = Ct(), { isSmallScreen: C } = bt(), [E, Y] = S(null), [Z, _] = S(!1), g = i(() => {
     L(!0);
-  }, []), h = i(() => {
-    c(""), u(""), L(!1);
+  }, []), l = i(() => {
+    c(""), I(""), L(!1);
   }, [c]), R = (r) => {
-    const a = r.key === "Enter", I = r.key === " ";
-    (a || I) && h();
+    const a = r.key === "Enter", b = r.key === " ";
+    (a || b) && l();
   }, w = i(
     (r) => {
-      r.key === "Escape" && s && h();
+      r.key === "Escape" && u && l();
     },
-    [s]
-  ), _ = i(
+    [u]
+  ), M = i(
     (r) => {
-      r.shiftKey && r.key === "Enter" ? P() : r.key === "Enter" && e !== d ? c(d) : r.key === "Enter" && O();
+      r.shiftKey && r.key === "Enter" ? P() : r.key === "Enter" && e !== f ? c(f) : r.key === "Enter" && O();
     },
-    [d, P, O, c, e]
+    [f, P, O, c, e]
   );
-  l(() => {
-    u(e);
-  }, [e]), l(() => {
-    e && S && Y(!0);
-  }, [e, S]), l(() => {
-    e && e.trim() !== "" && (u(e), c(e));
-  }, []), l(() => (window.addEventListener("keydown", w), () => {
+  h(() => {
+    I(e);
+  }, [e]), h(() => {
+    e && y && _(!0);
+  }, [e, y]), h(() => {
+    e && e.trim() !== "" && (I(e), c(e));
+  }, []), h(() => (window.addEventListener("keydown", w), () => {
     window.removeEventListener("keydown", w);
-  }), [w]), l(() => {
+  }), [w]), h(() => {
     k && setTimeout(() => {
       k.focus();
     }, 0);
   }, [k]);
-  const g = i((r) => {
-    u(r.target.value);
+  const tt = i((r) => {
+    I(r.target.value);
   }, []), U = i(() => {
-    u(""), c("");
-  }, [c]), M = W(() => `${B} / ${K}`, [B, K]), { wholeWords: tt, matchCase: ot } = W(() => D, [D]), rt = i(
+    I(""), c("");
+  }, [c]), ot = W(() => `${B} / ${K}`, [B, K]), { wholeWords: rt, matchCase: et } = W(() => D, [D]), nt = i(
     (r) => {
-      y((a) => ({ ...a, matchCase: r }));
+      T((a) => ({ ...a, matchCase: r }));
     },
-    [y]
-  ), et = i(
+    [T]
+  ), it = i(
     (r) => {
-      y((a) => ({ ...a, wholeWords: r }));
+      T((a) => ({ ...a, wholeWords: r }));
     },
-    [y]
+    [T]
   );
-  l(() => {
-    S && X && h();
-  }, [S, h]);
-  const p = W(() => (T == null ? void 0 : T.querySelectorAll('[tabindex]:not([tabindex="-1"])')) || [], [T]), nt = i(
+  h(() => {
+    y && Z && l();
+  }, [y, l]);
+  const p = W(() => (E == null ? void 0 : E.querySelectorAll('[tabindex]:not([tabindex="-1"])')) || [], [E]), at = i(
     (r) => {
       if (r.key === "Tab") {
         const a = document.activeElement;
-        let I = 0;
-        p.forEach((m, it) => {
-          m === a && (I = it);
+        let b = 0;
+        p.forEach((m, ct) => {
+          m === a && (b = ct);
         });
-        let N = I + 1;
-        r.shiftKey && (N = I - 1);
+        let N = b + 1;
+        r.shiftKey && (N = b - 1);
         const V = p[N];
         if (V)
           V.focus();
@@ -155,54 +158,54 @@ const yt = () => {
     },
     [p]
   );
-  return !G || !J ? null : /* @__PURE__ */ o(at, { children: /* @__PURE__ */ o(
-    bt,
+  return !Q || !X ? null : /* @__PURE__ */ o(pt, { children: /* @__PURE__ */ o(
+    xt,
     {
-      open: s,
-      container: v,
+      open: u,
+      container: d,
       side: "bottom",
       align: "start",
       tabIndex: 0,
       avoidCollisions: !1,
-      triggerComponent: /* @__PURE__ */ o(E, { content: t == null ? void 0 : t.searchButtonTooltip, children: /* @__PURE__ */ o(
-        ct,
+      triggerComponent: /* @__PURE__ */ o(v, { content: t == null ? void 0 : t.searchButtonTooltip, children: /* @__PURE__ */ o(
+        mt,
         {
-          active: s,
-          onClick: Z,
+          active: u,
+          onClick: g,
           "aria-label": t == null ? void 0 : t.searchButtonTooltip,
-          "aria-expanded": s,
+          "aria-expanded": u,
           "aria-haspopup": "dialog",
-          children: x || /* @__PURE__ */ o(yt, {})
+          children: s || /* @__PURE__ */ o(yt, {})
         }
       ) }),
-      children: /* @__PURE__ */ C(
+      children: /* @__PURE__ */ x(
         "div",
         {
-          ref: Q,
+          ref: Y,
           className: n["rp-search-tool-content"],
           tabIndex: 0,
-          onKeyDown: nt,
+          onKeyDown: at,
           role: "dialog",
           "aria-label": (t == null ? void 0 : t.searchInputTooltip) || "Search dialog",
           children: [
-            /* @__PURE__ */ C("div", { className: n["rp-search-tool-input-wrapper"], children: [
-              /* @__PURE__ */ C("div", { className: n["rp-search-tool-input"], children: [
-                /* @__PURE__ */ o(E, { content: t == null ? void 0 : t.searchInputTooltip, children: /* @__PURE__ */ o(
-                  mt,
+            /* @__PURE__ */ x("div", { className: n["rp-search-tool-input-wrapper"], children: [
+              /* @__PURE__ */ x("div", { className: n["rp-search-tool-input"], children: [
+                /* @__PURE__ */ o(v, { content: t == null ? void 0 : t.searchInputTooltip, children: /* @__PURE__ */ o(
+                  lt,
                   {
-                    value: d,
-                    onKeyDown: _,
-                    onChange: g,
+                    value: f,
+                    onKeyDown: M,
+                    onChange: tt,
                     icon: /* @__PURE__ */ o(A, {}),
                     placeholder: t == null ? void 0 : t.searchInputPlaceholder,
                     className: n["rp-search-input"],
-                    ref: F,
+                    ref: G,
                     id: "search-input",
                     name: "search-input",
                     tabIndex: 0,
                     "aria-label": (t == null ? void 0 : t.searchInputTooltip) || (t == null ? void 0 : t.searchInputPlaceholder),
                     "aria-describedby": "search-results-count",
-                    children: !!d && /* @__PURE__ */ o(
+                    children: !!f && /* @__PURE__ */ o(
                       "span",
                       {
                         className: n["rp-search-tool-input-clear"],
@@ -213,45 +216,45 @@ const yt = () => {
                         onKeyDown: (r) => {
                           (r.key === "Enter" || r.key === " ") && (r.preventDefault(), U());
                         },
-                        children: /* @__PURE__ */ o(ht, {})
+                        children: /* @__PURE__ */ o(Tt, {})
                       }
                     )
                   }
                 ) }),
-                H ? /* @__PURE__ */ o("span", { "aria-live": "polite", "aria-label": "Searching", children: /* @__PURE__ */ o(lt, { className: n["rp-search-loader-icon"], "aria-hidden": "true" }) }) : /* @__PURE__ */ o("span", { id: "search-results-count", "aria-live": "polite", children: M }),
-                f && /* @__PURE__ */ o("div", { className: n["rp-search-tool-controls"], children: /* @__PURE__ */ o(z, { onKeyPress: R, handleClose: h }) })
+                J ? /* @__PURE__ */ o("span", { "aria-live": "polite", "aria-label": "Searching", children: /* @__PURE__ */ o(dt, { className: n["rp-search-loader-icon"], "aria-hidden": "true" }) }) : /* @__PURE__ */ o("span", { id: "search-results-count", "aria-live": "polite", children: ot }),
+                C && /* @__PURE__ */ o("div", { className: n["rp-search-tool-controls"], children: /* @__PURE__ */ o(z, { onKeyPress: R, handleClose: l }) })
               ] }),
-              /* @__PURE__ */ C("div", { className: n["rp-search-tool-input-checkboxes"], children: [
-                f && /* @__PURE__ */ o(q, {}),
+              /* @__PURE__ */ x("div", { className: n["rp-search-tool-input-checkboxes"], children: [
+                C && /* @__PURE__ */ o(q, {}),
                 /* @__PURE__ */ o(
                   $,
                   {
                     tabIndex: 0,
                     name: "matchCase",
-                    value: ot,
-                    onChange: rt,
+                    value: et,
+                    onChange: nt,
                     "aria-label": t == null ? void 0 : t.searchMatchCaseLabel,
                     children: t == null ? void 0 : t.searchMatchCaseLabel
                   }
                 ),
-                !f && /* @__PURE__ */ o(E, { content: t == null ? void 0 : t.searchMatchCaseTooltip, children: /* @__PURE__ */ o("div", { className: n["rp-search-icon-info"], tabIndex: 0, children: /* @__PURE__ */ o(j, {}) }) }),
+                !C && /* @__PURE__ */ o(v, { content: t == null ? void 0 : t.searchMatchCaseTooltip, children: /* @__PURE__ */ o("div", { className: n["rp-search-icon-info"], tabIndex: 0, children: /* @__PURE__ */ o(j, {}) }) }),
                 /* @__PURE__ */ o(
                   $,
                   {
                     tabIndex: 0,
                     name: "wholeWord",
-                    value: tt,
-                    onChange: et,
+                    value: rt,
+                    onChange: it,
                     "aria-label": t == null ? void 0 : t.searchWholeWordsLabel,
                     children: t == null ? void 0 : t.searchWholeWordsLabel
                   }
                 ),
-                !f && /* @__PURE__ */ o(E, { content: t == null ? void 0 : t.searchWholeWordsTooltip, children: /* @__PURE__ */ o("div", { tabIndex: 0, className: n["rp-search-icon-info"], children: /* @__PURE__ */ o(j, {}) }) })
+                !C && /* @__PURE__ */ o(v, { content: t == null ? void 0 : t.searchWholeWordsTooltip, children: /* @__PURE__ */ o("div", { tabIndex: 0, className: n["rp-search-icon-info"], children: /* @__PURE__ */ o(j, {}) }) })
               ] })
             ] }),
-            !f && /* @__PURE__ */ C("div", { className: n["rp-search-tool-controls"], children: [
+            !C && /* @__PURE__ */ x("div", { className: n["rp-search-tool-controls"], children: [
               /* @__PURE__ */ o(q, {}),
-              /* @__PURE__ */ o(z, { onKeyPress: R, handleClose: h })
+              /* @__PURE__ */ o(z, { onKeyPress: R, handleClose: l })
             ] })
           ]
         }
@@ -260,5 +263,5 @@ const yt = () => {
   ) });
 };
 export {
-  jo as SearchTool
+  qo as SearchTool
 };

package/dist/contexts/InitialStateContext.js

@@ -1,13 +1,11 @@
-import { jsx as o } from "react/jsx-runtime";
-import { createContext as r, useContext as i } from "react";
-const t = r({
-  instanceId: ""
-}), x = ({
+import { jsx as r } from "react/jsx-runtime";
+import { createContext as n, useContext as i } from "react";
+const t = n({}), x = ({
   children: e,
-  ...n
-}) => /* @__PURE__ */ o(t.Provider, { value: n, children: e }), c = () => i(t);
+  ...o
+}) => /* @__PURE__ */ r(t.Provider, { value: o, children: e }), u = () => i(t);
 export {
   t as InitialStateContext,
   x as InitialStateProvider,
-  c as useInitialStateContext
+  u as useInitialStateContext
 };

package/dist/types/utils/hooks/useWatermark.d.ts

@@ -1 +1 @@
-export declare const useWatermark: (instanceId?: string) => void;
+export declare const useWatermark: (container: HTMLDivElement | null) => void;

package/dist/types/utils/types.d.ts

@@ -540,7 +540,6 @@ export interface ZoomContextType {
 }
 export type ZoomProps = Omit<ZoomContextType, 'currentZoom'>;
 export type InitialStateContextType = {
-    instanceId: string;
     interactiveForm?: boolean;
 } & ZoomProviderProps & PageProviderProps & ViewModeInitialProps & ScrollModeInitialProps & RotateProviderProps;
 export interface ZoomProviderProps {
@@ -820,6 +819,7 @@ export interface RPHorizontalBarIcons {
     documentPropertiesIcon?: React.ReactNode;
     printIcon?: React.ReactNode;
     searchIcon?: React.ReactNode;
+    searchClearIcon?: React.ReactNode;
     textSelectionIcon?: React.ReactNode;
     handModeIcon?: React.ReactNode;
 }

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("2026-02-20T02:47:06.577Z"), d = "Please visit https://www.react-pdf.dev/manage-license/ to generate a new license key.", s = {
+const b = /* @__PURE__ */ new Date("2026-02-25T08:16:21.019Z"), 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}`,