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

package/dist/components/page/RPPage.js

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
 import "react";
-import { z as _ } from "../../RPLayout-897cb09d.js";
+import { E as ro } from "../../ToolbarLayout.module-60c3d6e8.js";
 import "../../contexts/RPDocumentContext.js";
 import "../../contexts/DocumentPasswordContext.js";
 import "../../contexts/DarkModeContext.js";
@@ -26,29 +26,32 @@ import "../../contexts/SmoothScrollContext.js";
 import "../../contexts/ElementPageContext.js";
 import "../../contexts/PagesRotateContext.js";
 import "../../contexts/LoaderContext.js";
-import "../RPConfig.js";
-import "../../contexts/ThemeContext.js";
-import "../RPDropFileZone.js";
-import "../../contexts/ToolbarComponentContext.js";
 import "../../contexts/ToolComponentContext.js";
+import "../../contexts/IconToolContext.js";
+import "../../contexts/OtherToolContext.js";
+import "../RPConfig.js";
 import "../ui/Button.js";
-import "../../SearchCloseButton-ddb9877e.js";
 import "../ui/Input.js";
-import "../ui/Checkbox.js";
-import "../icons/LoaderIcon.js";
 import "../../contexts/IconContext.js";
-import "../ui/RPTooltip.js";
-import "../../Popover-1faa77f6.js";
+import "../../contexts/ToolbarComponentContext.js";
 import "../../contexts/ViewportContext.js";
-import "../../contexts/IconToolContext.js";
-import "../ui/DropDown.js";
-import "../layout/toolbar/MenuItem.js";
-import "../layout/toolbar/MenuSeparator.js";
+import "../ui/RPTooltip.js";
+import "../../MenuItem.module-bc11d0d3.js";
+import "../../DropDown.module-a78567cb.js";
 import "../../utils/dateFormatter.js";
-import "../layout/toolbar/PropertyItem.js";
-import "../../contexts/OtherToolContext.js";
-import "../layout/toolbar/RotateTool.js";
+import "../../PropertyItem.module-db0150cc.js";
+import "../../MenuSeparator.module-89b2ff7f.js";
+import "../../RotateTool.module-03987eba.js";
+import "../../SearchTool.module-016f3a8d.js";
+import "../../Checkbox.module-3edaacbb.js";
+import "../icons/LoaderIcon.js";
+import "../../RPSplitter.module-13d612c4.js";
+import "../../Container.module-f8b5c306.js";
+import "../../WrapperLayout.module-147bc943.js";
+import "../../RPTheme.module-bd9038da.js";
+import "../../contexts/ThemeContext.js";
 import "./CustomElement.js";
+import "../../utils/withRef.js";
 export {
-  _ as RPPage
+  ro as RPPage
 };

package/dist/components/page/SinglePage.js

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
 import "react";
-import { E as m } from "../../RPLayout-897cb09d.js";
+import { H as m } from "../../ToolbarLayout.module-60c3d6e8.js";
 export {
   m as SinglePage
 };

package/dist/components/page/TextHighlightLayer.js

@@ -2,7 +2,7 @@ import "react/jsx-runtime";
 import "react";
 import "../../contexts/RPDocumentContext.js";
 import "../../contexts/DocumentPasswordContext.js";
-import { y as $ } from "../../RPLayout-897cb09d.js";
+import { D as tr } from "../../ToolbarLayout.module-60c3d6e8.js";
 import "../../contexts/DarkModeContext.js";
 import "../../contexts/RotationContext.js";
 import "../../contexts/LayerContext.js";
@@ -26,30 +26,32 @@ import "../../contexts/SmoothScrollContext.js";
 import "../../contexts/ElementPageContext.js";
 import "../../contexts/PagesRotateContext.js";
 import "../../contexts/LoaderContext.js";
-import "../RPConfig.js";
-import "../../contexts/ThemeContext.js";
-import "../RPDropFileZone.js";
-import "../../contexts/ToolbarComponentContext.js";
 import "../../contexts/ToolComponentContext.js";
+import "../../contexts/IconToolContext.js";
+import "../../contexts/OtherToolContext.js";
+import "../RPConfig.js";
 import "../ui/Button.js";
-import "../../SearchCloseButton-ddb9877e.js";
 import "../ui/Input.js";
-import "../ui/Checkbox.js";
-import "../icons/LoaderIcon.js";
 import "../../contexts/IconContext.js";
-import "../ui/RPTooltip.js";
-import "../../Popover-1faa77f6.js";
+import "../../contexts/ToolbarComponentContext.js";
 import "../../contexts/ViewportContext.js";
-import "../../contexts/IconToolContext.js";
-import "../ui/DropDown.js";
-import "../layout/toolbar/MenuItem.js";
-import "../layout/toolbar/MenuSeparator.js";
+import "../ui/RPTooltip.js";
+import "../../MenuItem.module-bc11d0d3.js";
+import "../../DropDown.module-a78567cb.js";
 import "../../utils/dateFormatter.js";
-import "../layout/toolbar/PropertyItem.js";
-import "../../contexts/OtherToolContext.js";
-import "../layout/toolbar/RotateTool.js";
+import "../../PropertyItem.module-db0150cc.js";
+import "../../MenuSeparator.module-89b2ff7f.js";
+import "../../RotateTool.module-03987eba.js";
+import "../../SearchTool.module-016f3a8d.js";
+import "../../Checkbox.module-3edaacbb.js";
+import "../icons/LoaderIcon.js";
+import "../../RPSplitter.module-13d612c4.js";
+import "../../Container.module-f8b5c306.js";
+import "../../WrapperLayout.module-147bc943.js";
+import "../../RPTheme.module-bd9038da.js";
+import "../../contexts/ThemeContext.js";
 import "./searchHighlight.js";
 import "../../utils/highlight.js";
 export {
-  $ as TextHighlightLayer
+  tr as TextHighlightLayer
 };

package/dist/components/page/TextLayer.js

@@ -2,7 +2,7 @@ import "react/jsx-runtime";
 import "react";
 import "../../contexts/RPDocumentContext.js";
 import "../../contexts/DocumentPasswordContext.js";
-import { x as $ } from "../../RPLayout-897cb09d.js";
+import { A as or } from "../../ToolbarLayout.module-60c3d6e8.js";
 import "../../contexts/DarkModeContext.js";
 import "../../contexts/RotationContext.js";
 import "../../contexts/LayerContext.js";
@@ -26,30 +26,32 @@ import "../../contexts/SmoothScrollContext.js";
 import "../../contexts/ElementPageContext.js";
 import "../../contexts/PagesRotateContext.js";
 import "../../contexts/LoaderContext.js";
-import "../RPConfig.js";
-import "../../contexts/ThemeContext.js";
-import "../RPDropFileZone.js";
-import "../../contexts/ToolbarComponentContext.js";
 import "../../contexts/ToolComponentContext.js";
+import "../../contexts/IconToolContext.js";
+import "../../contexts/OtherToolContext.js";
+import "../RPConfig.js";
 import "../ui/Button.js";
-import "../../SearchCloseButton-ddb9877e.js";
 import "../ui/Input.js";
-import "../ui/Checkbox.js";
-import "../icons/LoaderIcon.js";
 import "../../contexts/IconContext.js";
-import "../ui/RPTooltip.js";
-import "../../Popover-1faa77f6.js";
+import "../../contexts/ToolbarComponentContext.js";
 import "../../contexts/ViewportContext.js";
-import "../../contexts/IconToolContext.js";
-import "../ui/DropDown.js";
-import "../layout/toolbar/MenuItem.js";
-import "../layout/toolbar/MenuSeparator.js";
+import "../ui/RPTooltip.js";
+import "../../MenuItem.module-bc11d0d3.js";
+import "../../DropDown.module-a78567cb.js";
 import "../../utils/dateFormatter.js";
-import "../layout/toolbar/PropertyItem.js";
-import "../../contexts/OtherToolContext.js";
-import "../layout/toolbar/RotateTool.js";
+import "../../PropertyItem.module-db0150cc.js";
+import "../../MenuSeparator.module-89b2ff7f.js";
+import "../../RotateTool.module-03987eba.js";
+import "../../SearchTool.module-016f3a8d.js";
+import "../../Checkbox.module-3edaacbb.js";
+import "../icons/LoaderIcon.js";
+import "../../RPSplitter.module-13d612c4.js";
+import "../../Container.module-f8b5c306.js";
+import "../../WrapperLayout.module-147bc943.js";
+import "../../RPTheme.module-bd9038da.js";
+import "../../contexts/ThemeContext.js";
 import "pdfjs-dist";
 import "../../utils/highlight.js";
 export {
-  $ as TextLayer
+  or as TextLayer
 };

package/dist/components/ui/Button.js

@@ -1,18 +1,18 @@
-import { jsx as e } from "react/jsx-runtime";
-import { forwardRef as p } from "react";
-import { c as u } from "../../clsx-0c6e471a.js";
+import { jsx as a } from "react/jsx-runtime";
+import { c as p } from "../../clsx-0c6e471a.js";
+import { withRef as u } from "../../utils/withRef.js";
 import '../../assets/Button.css';const t = {
   "rp-button": "_rp-button_1jswj_1",
   "rp-button-active": "_rp-button-active_1jswj_18"
-}, _ = p((o, r) => {
-  const { children: s, active: n, className: c, ...a } = o;
-  return /* @__PURE__ */ e(
+}, _ = u((o, r) => {
+  const { children: s, active: n, className: c, ...e } = o;
+  return /* @__PURE__ */ a(
     "button",
     {
       tabIndex: 0,
       ref: r,
-      ...a,
-      className: u(t["rp-button"], c, n ? t["rp-button-active"] : ""),
+      ...e,
+      className: p(t["rp-button"], c, n ? t["rp-button-active"] : ""),
       children: s
     }
   );

package/dist/components/ui/Checkbox.js

@@ -1,53 +1,54 @@
-import { jsxs as g, jsx as s } from "react/jsx-runtime";
-import * as c from "react";
-import { e as j, a as A, f as B, P as S, c as _, g as H, h as K } from "../../index-1cb41342.js";
+import { jsxs as S, jsx as s } from "react/jsx-runtime";
+import * as n from "react";
+import { c as j, u as A, e as B, P as w, a as g, b as H, f as K } from "../../index-8547fbc6.js";
+import { c as R } from "../../Checkbox.module-3edaacbb.js";
 import { CheckIcon as L } from "../icons/CheckIcon.js";
-import '../../assets/Checkbox.css';function q(e) {
-  const r = c.useRef({ value: e, previous: e });
-  return c.useMemo(() => (r.current.value !== e && (r.current.previous = r.current.value, r.current.value = e), r.current.previous), [e]);
+function q(e) {
+  const r = n.useRef({ value: e, previous: e });
+  return n.useMemo(() => (r.current.value !== e && (r.current.previous = r.current.value, r.current.value = e), r.current.previous), [e]);
 }
-var E = "Checkbox", [z, W] = j(E), [F, T] = z(E), w = c.forwardRef(
+var E = "Checkbox", [z, Y] = j(E), [F, T] = z(E), N = n.forwardRef(
   (e, r) => {
     const {
       __scopeCheckbox: t,
       name: a,
-      checked: p,
-      defaultChecked: n,
+      checked: u,
+      defaultChecked: c,
       required: h,
-      disabled: u,
+      disabled: l,
       value: b = "on",
-      onCheckedChange: m,
-      form: l,
-      ...x
-    } = e, [i, C] = c.useState(null), v = A(r, (o) => C(o)), y = c.useRef(!1), I = i ? l || !!i.closest("form") : !0, [f = !1, P] = B({
-      prop: p,
-      defaultProp: n,
-      onChange: m
-    }), O = c.useRef(f);
-    return c.useEffect(() => {
+      onCheckedChange: C,
+      form: f,
+      ...v
+    } = e, [i, m] = n.useState(null), x = A(r, (o) => m(o)), y = n.useRef(!1), I = i ? f || !!i.closest("form") : !0, [p = !1, P] = B({
+      prop: u,
+      defaultProp: c,
+      onChange: C
+    }), O = n.useRef(p);
+    return n.useEffect(() => {
       const o = i == null ? void 0 : i.form;
       if (o) {
         const k = () => P(O.current);
         return o.addEventListener("reset", k), () => o.removeEventListener("reset", k);
       }
-    }, [i, P]), /* @__PURE__ */ g(F, { scope: t, state: f, disabled: u, children: [
+    }, [i, P]), /* @__PURE__ */ S(F, { scope: t, state: p, disabled: l, children: [
       /* @__PURE__ */ s(
-        S.button,
+        w.button,
         {
           type: "button",
           role: "checkbox",
-          "aria-checked": d(f) ? "mixed" : f,
+          "aria-checked": d(p) ? "mixed" : p,
           "aria-required": h,
-          "data-state": M(f),
-          "data-disabled": u ? "" : void 0,
-          disabled: u,
+          "data-state": M(p),
+          "data-disabled": l ? "" : void 0,
+          disabled: l,
           value: b,
-          ...x,
-          ref: v,
-          onKeyDown: _(e.onKeyDown, (o) => {
+          ...v,
+          ref: x,
+          onKeyDown: g(e.onKeyDown, (o) => {
             o.key === "Enter" && o.preventDefault();
           }),
-          onClick: _(e.onClick, (o) => {
+          onClick: g(e.onClick, (o) => {
             P((k) => d(k) ? !0 : !k), I && (y.current = o.isPropagationStopped(), y.current || o.stopPropagation());
           })
         }
@@ -59,51 +60,51 @@ var E = "Checkbox", [z, W] = j(E), [F, T] = z(E), w = c.forwardRef(
           bubbles: !y.current,
           name: a,
           value: b,
-          checked: f,
+          checked: p,
           required: h,
-          disabled: u,
-          form: l,
+          disabled: l,
+          form: f,
           style: { transform: "translateX(-100%)" },
-          defaultChecked: d(n) ? !1 : n
+          defaultChecked: d(c) ? !1 : c
         }
       )
     ] });
   }
 );
-w.displayName = E;
-var N = "CheckboxIndicator", D = c.forwardRef(
+N.displayName = E;
+var _ = "CheckboxIndicator", D = n.forwardRef(
   (e, r) => {
-    const { __scopeCheckbox: t, forceMount: a, ...p } = e, n = T(N, t);
-    return /* @__PURE__ */ s(H, { present: a || d(n.state) || n.state === !0, children: /* @__PURE__ */ s(
-      S.span,
+    const { __scopeCheckbox: t, forceMount: a, ...u } = e, c = T(_, t);
+    return /* @__PURE__ */ s(H, { present: a || d(c.state) || c.state === !0, children: /* @__PURE__ */ s(
+      w.span,
       {
-        "data-state": M(n.state),
-        "data-disabled": n.disabled ? "" : void 0,
-        ...p,
+        "data-state": M(c.state),
+        "data-disabled": c.disabled ? "" : void 0,
+        ...u,
         ref: r,
         style: { pointerEvents: "none", ...e.style }
       }
     ) });
   }
 );
-D.displayName = N;
+D.displayName = _;
 var X = (e) => {
-  const { control: r, checked: t, bubbles: a = !0, defaultChecked: p, ...n } = e, h = c.useRef(null), u = q(t), b = K(r);
-  c.useEffect(() => {
-    const l = h.current, x = window.HTMLInputElement.prototype, C = Object.getOwnPropertyDescriptor(x, "checked").set;
-    if (u !== t && C) {
-      const v = new Event("click", { bubbles: a });
-      l.indeterminate = d(t), C.call(l, d(t) ? !1 : t), l.dispatchEvent(v);
+  const { control: r, checked: t, bubbles: a = !0, defaultChecked: u, ...c } = e, h = n.useRef(null), l = q(t), b = K(r);
+  n.useEffect(() => {
+    const f = h.current, v = window.HTMLInputElement.prototype, m = Object.getOwnPropertyDescriptor(v, "checked").set;
+    if (l !== t && m) {
+      const x = new Event("click", { bubbles: a });
+      f.indeterminate = d(t), m.call(f, d(t) ? !1 : t), f.dispatchEvent(x);
     }
-  }, [u, t, a]);
-  const m = c.useRef(d(t) ? !1 : t);
+  }, [l, t, a]);
+  const C = n.useRef(d(t) ? !1 : t);
   return /* @__PURE__ */ s(
     "input",
     {
       type: "checkbox",
       "aria-hidden": !0,
-      defaultChecked: p ?? m.current,
-      ...n,
+      defaultChecked: u ?? C.current,
+      ...c,
       tabIndex: -1,
       ref: h,
       style: {
@@ -123,19 +124,27 @@ function d(e) {
 function M(e) {
   return d(e) ? "indeterminate" : e ? "checked" : "unchecked";
 }
-var U = w, G = D;
-const R = {
-  "rp-checkbox": "_rp-checkbox_3f10x_1",
-  "rp-checkbox-indicator": "_rp-checkbox-indicator_3f10x_21"
-}, Y = ({
+var U = N, G = D;
+const Z = ({
   children: e,
   value: r,
   name: t,
-  onChange: a
-}) => /* @__PURE__ */ g("div", { style: { display: "flex", alignItems: "center", position: "relative" }, children: [
-  /* @__PURE__ */ s(U, { className: R["rp-checkbox"], checked: r, id: t, onCheckedChange: a, children: /* @__PURE__ */ s(G, { className: R["rp-checkbox-indicator"], children: /* @__PURE__ */ s(L, {}) }) }),
+  onChange: a,
+  tabIndex: u
+}) => /* @__PURE__ */ S("div", { style: { display: "flex", alignItems: "center", position: "relative" }, children: [
+  /* @__PURE__ */ s(
+    U,
+    {
+      tabIndex: u,
+      className: R["rp-checkbox"],
+      checked: r,
+      id: t,
+      onCheckedChange: a,
+      children: /* @__PURE__ */ s(G, { className: R["rp-checkbox-indicator"], children: /* @__PURE__ */ s(L, {}) })
+    }
+  ),
   /* @__PURE__ */ s("label", { className: R["rp-checkbox-label"], htmlFor: t, children: e })
 ] });
 export {
-  Y as UICheckbox
+  Z as UICheckbox
 };

package/dist/components/ui/DropDown.js

@@ -1,29 +1,23 @@
-import { jsxs as i, jsx as d } from "react/jsx-runtime";
-import { R as l, T as c, P as p, C as _ } from "../../index-7279fb4e.js";
-import { c as A } from "../../clsx-0c6e471a.js";
-import '../../assets/DropDown.css';const F = "_slideDownAndFade_1vzkq_1", w = "_slideLeftAndFade_1vzkq_1", m = "_slideUpAndFade_1vzkq_1", f = "_slideRightAndFade_1vzkq_1", g = {
-  "rp-dropdown-content": "_rp-dropdown-content_1vzkq_1",
-  slideDownAndFade: F,
-  slideLeftAndFade: w,
-  slideUpAndFade: m,
-  slideRightAndFade: f,
-  "rp-dropdown-arrow": "_rp-dropdown-arrow_1vzkq_30"
-}, v = (e) => {
-  const { triggerComponent: n, children: o, container: s, className: r, open: t, ...a } = e;
-  return /* @__PURE__ */ i(l, { modal: !1, open: t, children: [
-    /* @__PURE__ */ d(c, { asChild: !0, children: n }),
-    /* @__PURE__ */ d(p, { container: s, children: /* @__PURE__ */ d(
-      _,
+import { jsxs as l, jsx as o } from "react/jsx-runtime";
+import { R as m, T as p, P as d, C as f } from "../../index-473557b1.js";
+import { c as g } from "../../DropDown.module-a78567cb.js";
+import { c as h } from "../../clsx-0c6e471a.js";
+const u = (r) => {
+  const { triggerComponent: n, children: e, container: s, className: t, open: a, onOpenChange: c, ...i } = r;
+  return /* @__PURE__ */ l(m, { modal: !1, open: a, onOpenChange: c, children: [
+    /* @__PURE__ */ o(p, { asChild: !0, children: n }),
+    /* @__PURE__ */ o(d, { container: s, children: /* @__PURE__ */ o(
+      f,
       {
         sideOffset: 8,
         align: "end",
-        ...a,
-        className: A(g["rp-dropdown-content"], r),
-        children: o
+        ...i,
+        className: h(g["rp-dropdown-content"], t),
+        children: e
       }
     ) })
   ] });
 };
 export {
-  v as UIDropDown
+  u as UIDropDown
 };

package/dist/components/ui/Input.js

@@ -1,24 +1,24 @@
 import { jsxs as a, jsx as n } from "react/jsx-runtime";
 import { c as e } from "../../clsx-0c6e471a.js";
-import { forwardRef as u } from "react";
-import '../../assets/Input.css';const p = {
+import { withRef as u } from "../../utils/withRef.js";
+import '../../assets/Input.css';const r = {
   "rp-input": "_rp-input_3rj4v_1",
   "rp-input-wrapper": "_rp-input-wrapper_3rj4v_22",
   "rp-input-icon": "_rp-input-icon_3rj4v_26"
-}, d = u((i, s) => {
-  const { className: t, icon: r, children: o, ...c } = i;
-  return /* @__PURE__ */ a("div", { className: p["rp-input-wrapper"], children: [
+}, d = u((i, t) => {
+  const { className: s, icon: p, children: c, ...o } = i;
+  return /* @__PURE__ */ a("div", { className: r["rp-input-wrapper"], children: [
     /* @__PURE__ */ n(
       "input",
       {
-        ...c,
-        "data-icon": !!r,
-        ref: s,
-        className: e(t, p["rp-input"], "ignore-hover")
+        ...o,
+        "data-icon": !!p,
+        ref: t,
+        className: e(s, r["rp-input"], "ignore-hover")
       }
     ),
-    r && /* @__PURE__ */ n("span", { className: p["rp-input-icon"], children: r }),
-    o
+    p && /* @__PURE__ */ n("span", { className: r["rp-input-icon"], children: p }),
+    c
   ] });
 });
 export {

package/dist/components/ui/LoadingIndicator.js

@@ -1,7 +1,24 @@
-import "react/jsx-runtime";
-import { K as i } from "../../RPLayout-897cb09d.js";
-import "../../clsx-0c6e471a.js";
-import "../../contexts/LocalizationContext.js";
+import { jsx as a, jsxs as l } from "react/jsx-runtime";
+import { b as s, l as i } from "../../ToolbarLayout.module-60c3d6e8.js";
+import { c as n } from "../../clsx-0c6e471a.js";
+import { useLocalizationContext as d } from "../../contexts/LocalizationContext.js";
+const u = ({ percentage: o }) => {
+  const { cancel: t } = s(), { localeMessages: r } = d();
+  return o < 1 ? null : /* @__PURE__ */ a("div", { className: n(i["rp-loading-overlay"]), children: /* @__PURE__ */ l("div", { className: n(i["rp-loading-modal"]), children: [
+    /* @__PURE__ */ l("div", { className: n(i["rp-loading-title"]), children: [
+      r == null ? void 0 : r.printLoadingMessage,
+      "..."
+    ] }),
+    /* @__PURE__ */ a("div", { className: n(i["rp-loading-progress-bar"]), children: /* @__PURE__ */ a(
+      "div",
+      {
+        className: n(i["rp-loading-progress"]),
+        style: { width: `${o}%` }
+      }
+    ) }),
+    /* @__PURE__ */ a("button", { className: n(i["rp-loading-cancel-button"]), onClick: t, children: r == null ? void 0 : r.printCancelLabel })
+  ] }) });
+};
 export {
-  i as default
+  u as default
 };