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

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

@@ -1,140 +1,314 @@
-import "react/jsx-runtime";
-import "react";
-import { D as Fm } from "../../../ToolbarLayout.module-0aa7a2aa.js";
-import "../../../contexts/LayoutContainerContext.js";
-import "../../icons/CloseIcon.js";
-import "../../../utils/dateFormatter.js";
-import "../../../contexts/RPDocumentContext.js";
-import "../../../contexts/DocumentPasswordContext.js";
-import "../../../contexts/DarkModeContext.js";
-import "../../../contexts/RotationContext.js";
-import "../../../contexts/LayerContext.js";
-import "../../../contexts/ZoomContext.js";
-import "../../../contexts/ViewModeContext.js";
-import "../../../contexts/ScrollModeContext.js";
-import "../../../contexts/VirtualScrollContext.js";
-import "../../../contexts/VirtualGridContext.js";
-import "../../../contexts/SelectionModeContext.js";
-import "../../../contexts/InitialStateContext.js";
-import "../../../contexts/FullScreenContext.js";
-import "../../../contexts/FileInputContext.js";
-import "../../../contexts/DropFileZoneContext.js";
-import "../../../contexts/DimensionPagesContext.js";
-import "../../../contexts/LocalizationContext.js";
-import "../../../contexts/HighlightContext.js";
-import "../../../contexts/LicenseContext.js";
-import "../../../contexts/DownloadContext.js";
-import "../../../contexts/SmoothScrollContext.js";
-import "../../../contexts/ElementPageContext.js";
-import "../../../contexts/PagesRotateContext.js";
-import "../../../contexts/GlobalCurrentPage.js";
-import "../../../contexts/LoaderContext.js";
-import "../../../contexts/ToolComponentContext.js";
-import "../../../contexts/IconToolContext.js";
-import "../../../contexts/OtherToolContext.js";
-import "../../../contexts/EventCallbackContext.js";
-import "../../../contexts/ThemeContext.js";
-import "../../../contexts/ConfigContext.js";
+import { jsx as a, jsxs as C, Fragment as x } from "react/jsx-runtime";
+import * as c from "react";
+import { useMemo as J } from "react";
+import { c as Q, a as P, P as D, b as v, d as y, e as X, f as M, g as ee } from "../../../index-c0faa594.js";
+import { D as te, u as R } from "../../../index-e3ee9457.js";
+import { R as oe, h as re, u as ne, F as ie, P as ae } from "../../../Combination-136ff99c.js";
+import { useLayoutContainer as le } from "../../../contexts/LayoutContainerContext.js";
+import { CloseIcon as ce } from "../../icons/CloseIcon.js";
+import { dateFormatter as A } from "../../../utils/dateFormatter.js";
+import { useDocumentContext as se } from "../../../contexts/RPDocumentContext.js";
+import { PropertyItem as ue } from "./PropertyItem.js";
+import { useOtherToolContext as de } from "../../../contexts/OtherToolContext.js";
+import { useLocalizationContext as pe } from "../../../contexts/LocalizationContext.js";
+import "react-dom";
+import "../../../utils/hooks/useLoadPdf.js";
 import "pdfjs-dist";
-import "../Container.js";
-import "../../../contexts/ViewportContext.js";
-import "../../../contexts/ToolbarComponentContext.js";
-import "../sidebar/RPSplitter.js";
-import "../WrapperLayout.js";
-import "../../RPDropFileZone.js";
-import "../../../LayoutWrapper-6224491f.js";
-import "../../ui/Button.js";
-import "../../../SearchCloseButton-08d57275.js";
-import "../../ui/Input.js";
-import "../../ui/Checkbox.js";
-import "../../icons/LoaderIcon.js";
-import "../../../contexts/IconContext.js";
-import "../../ui/RPTooltip.js";
-import "../../ui/DropDown.js";
-import "./MenuItem.js";
-import "./MenuSeparator.js";
-import "../../../RotateTool.module-67946714.js";
-import "./PropertyItem.js";
-import "../../icons/ChevronUpIcon.js";
 import "../../../utils/types.js";
-import "../../../th_TH-d627cd51.js";
-import "../../../utils/highlight.js";
-import "../../../utils/charators.js";
-import "../../../utils/Queue.js";
-import "../../../utils/renderPage.js";
-import "../../icons/Thumbnail.js";
-import "../../../clsx-0c6e471a.js";
-import "../../../utils/withRef.js";
-import "../../../utils/hooks/useInfiniteScroll.js";
-import "../../../utils/constants.js";
-import "../../../utils/link_service.js";
-import "../../../utils/annotations.js";
-import "../../../utils/sanitizeExternalUrl.js";
-import "../../page/searchHighlight.js";
-import "../../../utils/const.js";
-import "../../page/CustomElement.js";
-import "../../../utils/appConsole.js";
-import "../../../utils/hooks/useLoadPdf.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 "../../../utils/getZoomLevel.js";
-import "../../../utils/hooks/useDebounce.js";
-import "../../../utils/hooks/useLicense.js";
-import "../../../utils/getScrollDistance.js";
-import "../../../utils/getElementPositionInPage.js";
-import "../../../utils/calculatePage.js";
-import "../../../utils/hooks/useMousePressed.js";
-import "../../../utils/hooks/useGrabScroll.js";
-import "../../../utils/hooks/usePinch.js";
-import "../../ui/PasswordModal.js";
 import "../../../utils/hooks/useLocalization.js";
-import "../../../utils/approximateFragtion.js";
-import "../../../utils/hooks/useCopyText.js";
-import "../../../utils/getWordPositionInPage.js";
-import "../../../utils/smoothScrollTo.js";
-import "./FileUploadTool.js";
-import "../../icons/FileUploadDefaultIcon.js";
-import "../../../index-3bf64864.js";
-import "../../../index-c9a2990a.js";
-import "react-dom";
-import "../../../floating-ui.react-dom-d22a10b4.js";
-import "./DarkModeTool.js";
-import "../../icons/MoonIcon.js";
-import "../../icons/SunIcon.js";
-import "../../../utils/hooks/useDarkMode.js";
-import "../../icons/ThreeDotIcon.js";
-import "./DocumentProperties.js";
-import "../../icons/InfoIcon.js";
-import "./RotateTool.js";
-import "../../icons/ClockwiseIcon.js";
-import "../../../utils/hooks/useRotate.js";
-import "./ViewModeTool.js";
-import "../../icons/DualPageIcon.js";
-import "../../icons/SinglePageIcon.js";
-import "../../icons/CheckIcon.js";
-import "./ScrollModeTool.js";
-import "../../icons/PageScrollingIcon.js";
-import "../../icons/VerticalScrollingIcon.js";
-import "../../icons/HorizontalScrollingIcon.js";
-import "../../icons/FileDownloadDefaultIcon.js";
-import "../../icons/PrintDefaultIcon.js";
-import "./FullScreenTool.js";
-import "../../icons/FullScreenIcon.js";
-import "../../../utils/hooks/useFullScreen.js";
-import "../../icons/GoToDownIcon.js";
-import "./SelectionModeTool.js";
-import "../../icons/TextSelectionDefaultIcon.js";
-import "../../icons/HandModeDefaultIcon.js";
-import "../../icons/ZoomInIcon.js";
-import "../../icons/ZoomOutIcon.js";
-import "../../../utils/zoom.js";
-import "../../icons/SearchIcon.js";
-import "../../icons/ClearIcon.js";
-import "../../../utils/hooks/useHighlight.js";
-import "../../icons/LightPdfIcon.js";
-import "../../icons/DarkPdfIcon.js";
+var h = "Dialog", [T, tt] = Q(h), [fe, u] = T(h), L = (t) => {
+  const {
+    __scopeDialog: r,
+    children: n,
+    open: i,
+    defaultOpen: e,
+    onOpenChange: o,
+    modal: l = !0
+  } = t, s = c.useRef(null), d = c.useRef(null), [p, g] = M({
+    prop: i,
+    defaultProp: e ?? !1,
+    onChange: o,
+    caller: h
+  });
+  return /* @__PURE__ */ a(
+    fe,
+    {
+      scope: r,
+      triggerRef: s,
+      contentRef: d,
+      contentId: R(),
+      titleId: R(),
+      descriptionId: R(),
+      open: p,
+      onOpenChange: g,
+      onOpenToggle: c.useCallback(() => g((_) => !_), [g]),
+      modal: l,
+      children: n
+    }
+  );
+};
+L.displayName = h;
+var w = "DialogTrigger", me = c.forwardRef(
+  (t, r) => {
+    const { __scopeDialog: n, ...i } = t, e = u(w, n), o = P(r, e.triggerRef);
+    return /* @__PURE__ */ a(
+      D.button,
+      {
+        type: "button",
+        "aria-haspopup": "dialog",
+        "aria-expanded": e.open,
+        "aria-controls": e.contentId,
+        "data-state": E(e.open),
+        ...i,
+        ref: o,
+        onClick: v(t.onClick, e.onOpenToggle)
+      }
+    );
+  }
+);
+me.displayName = w;
+var N = "DialogPortal", [ge, F] = T(N, {
+  forceMount: void 0
+}), S = (t) => {
+  const { __scopeDialog: r, forceMount: n, children: i, container: e } = t, o = u(N, r);
+  return /* @__PURE__ */ a(ge, { scope: r, forceMount: n, children: c.Children.map(i, (l) => /* @__PURE__ */ a(y, { present: n || o.open, children: /* @__PURE__ */ a(ae, { asChild: !0, container: e, children: l }) })) });
+};
+S.displayName = N;
+var b = "DialogOverlay", W = c.forwardRef(
+  (t, r) => {
+    const n = F(b, t.__scopeDialog), { forceMount: i = n.forceMount, ...e } = t, o = u(b, t.__scopeDialog);
+    return o.modal ? /* @__PURE__ */ a(y, { present: i || o.open, children: /* @__PURE__ */ a(De, { ...e, ref: r }) }) : null;
+  }
+);
+W.displayName = b;
+var ve = ee("DialogOverlay.RemoveScroll"), De = c.forwardRef(
+  (t, r) => {
+    const { __scopeDialog: n, ...i } = t, e = u(b, n);
+    return (
+      // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`
+      // ie. when `Overlay` and `Content` are siblings
+      /* @__PURE__ */ a(oe, { as: ve, allowPinchZoom: !0, shards: [e.contentRef], children: /* @__PURE__ */ a(
+        D.div,
+        {
+          "data-state": E(e.open),
+          ...i,
+          ref: r,
+          style: { pointerEvents: "auto", ...i.style }
+        }
+      ) })
+    );
+  }
+), m = "DialogContent", k = c.forwardRef(
+  (t, r) => {
+    const n = F(m, t.__scopeDialog), { forceMount: i = n.forceMount, ...e } = t, o = u(m, t.__scopeDialog);
+    return /* @__PURE__ */ a(y, { present: i || o.open, children: o.modal ? /* @__PURE__ */ a(_e, { ...e, ref: r }) : /* @__PURE__ */ a(Ce, { ...e, ref: r }) });
+  }
+);
+k.displayName = m;
+var _e = c.forwardRef(
+  (t, r) => {
+    const n = u(m, t.__scopeDialog), i = c.useRef(null), e = P(r, n.contentRef, i);
+    return c.useEffect(() => {
+      const o = i.current;
+      if (o)
+        return re(o);
+    }, []), /* @__PURE__ */ a(
+      q,
+      {
+        ...t,
+        ref: e,
+        trapFocus: n.open,
+        disableOutsidePointerEvents: !0,
+        onCloseAutoFocus: v(t.onCloseAutoFocus, (o) => {
+          var l;
+          o.preventDefault(), (l = n.triggerRef.current) == null || l.focus();
+        }),
+        onPointerDownOutside: v(t.onPointerDownOutside, (o) => {
+          const l = o.detail.originalEvent, s = l.button === 0 && l.ctrlKey === !0;
+          (l.button === 2 || s) && o.preventDefault();
+        }),
+        onFocusOutside: v(
+          t.onFocusOutside,
+          (o) => o.preventDefault()
+        )
+      }
+    );
+  }
+), Ce = c.forwardRef(
+  (t, r) => {
+    const n = u(m, t.__scopeDialog), i = c.useRef(!1), e = c.useRef(!1);
+    return /* @__PURE__ */ a(
+      q,
+      {
+        ...t,
+        ref: r,
+        trapFocus: !1,
+        disableOutsidePointerEvents: !1,
+        onCloseAutoFocus: (o) => {
+          var l, s;
+          (l = t.onCloseAutoFocus) == null || l.call(t, o), o.defaultPrevented || (i.current || (s = n.triggerRef.current) == null || s.focus(), o.preventDefault()), i.current = !1, e.current = !1;
+        },
+        onInteractOutside: (o) => {
+          var d, p;
+          (d = t.onInteractOutside) == null || d.call(t, o), o.defaultPrevented || (i.current = !0, o.detail.originalEvent.type === "pointerdown" && (e.current = !0));
+          const l = o.target;
+          ((p = n.triggerRef.current) == null ? void 0 : p.contains(l)) && o.preventDefault(), o.detail.originalEvent.type === "focusin" && e.current && o.preventDefault();
+        }
+      }
+    );
+  }
+), q = c.forwardRef(
+  (t, r) => {
+    const { __scopeDialog: n, trapFocus: i, onOpenAutoFocus: e, onCloseAutoFocus: o, ...l } = t, s = u(m, n), d = c.useRef(null), p = P(r, d);
+    return ne(), /* @__PURE__ */ C(x, { children: [
+      /* @__PURE__ */ a(
+        ie,
+        {
+          asChild: !0,
+          loop: !0,
+          trapped: i,
+          onMountAutoFocus: e,
+          onUnmountAutoFocus: o,
+          children: /* @__PURE__ */ a(
+            te,
+            {
+              role: "dialog",
+              id: s.contentId,
+              "aria-describedby": s.descriptionId,
+              "aria-labelledby": s.titleId,
+              "data-state": E(s.open),
+              ...l,
+              ref: p,
+              onDismiss: () => s.onOpenChange(!1)
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ C(x, { children: [
+        /* @__PURE__ */ a(he, { titleId: s.titleId }),
+        /* @__PURE__ */ a(Pe, { contentRef: d, descriptionId: s.descriptionId })
+      ] })
+    ] });
+  }
+), O = "DialogTitle", G = c.forwardRef(
+  (t, r) => {
+    const { __scopeDialog: n, ...i } = t, e = u(O, n);
+    return /* @__PURE__ */ a(D.h2, { id: e.titleId, ...i, ref: r });
+  }
+);
+G.displayName = O;
+var $ = "DialogDescription", be = c.forwardRef(
+  (t, r) => {
+    const { __scopeDialog: n, ...i } = t, e = u($, n);
+    return /* @__PURE__ */ a(D.p, { id: e.descriptionId, ...i, ref: r });
+  }
+);
+be.displayName = $;
+var j = "DialogClose", z = c.forwardRef(
+  (t, r) => {
+    const { __scopeDialog: n, ...i } = t, e = u(j, n);
+    return /* @__PURE__ */ a(
+      D.button,
+      {
+        type: "button",
+        ...i,
+        ref: r,
+        onClick: v(t.onClick, () => e.onOpenChange(!1))
+      }
+    );
+  }
+);
+z.displayName = j;
+function E(t) {
+  return t ? "open" : "closed";
+}
+var B = "DialogTitleWarning", [ot, V] = X(B, {
+  contentName: m,
+  titleName: O,
+  docsSlug: "dialog"
+}), he = ({ titleId: t }) => {
+  const r = V(B), n = `\`${r.contentName}\` requires a \`${r.titleName}\` for the component to be accessible for screen reader users.
+
+If you want to hide the \`${r.titleName}\`, you can wrap it with our VisuallyHidden component.
+
+For more information, see https://radix-ui.com/primitives/docs/components/${r.docsSlug}`;
+  return c.useEffect(() => {
+    t && (document.getElementById(t) || console.error(n));
+  }, [n, t]), null;
+}, Re = "DialogDescriptionWarning", Pe = ({ contentRef: t, descriptionId: r }) => {
+  const i = `Warning: Missing \`Description\` or \`aria-describedby={undefined}\` for {${V(Re).contentName}}.`;
+  return c.useEffect(() => {
+    var o;
+    const e = (o = t.current) == null ? void 0 : o.getAttribute("aria-describedby");
+    r && e && (document.getElementById(r) || console.warn(i));
+  }, [i, t, r]), null;
+}, ye = L, Ne = S, Oe = W, Ee = k, Ie = G, xe = z;
+const f = {
+  "rp-dialog-wrapper": "_rp-dialog-wrapper_slqo7_1",
+  "rp-dialog-overlay": "_rp-dialog-overlay_slqo7_7",
+  "rp-document-dialog": "_rp-document-dialog_slqo7_13",
+  "rp-document-properties": "_rp-document-properties_slqo7_35",
+  "rp-dialog-title": "_rp-dialog-title_slqo7_39",
+  "rp-dialog-close": "_rp-dialog-close_slqo7_47",
+  "rp-properties-divider": "_rp-properties-divider_slqo7_55"
+}, rt = () => {
+  const { pdfProperties: t } = se(), { container: r } = le(), { activeDocumentProperties: n, setActiveDocumentProperties: i } = de(), { localeMessages: e } = pe(), o = J(() => {
+    if (!t)
+      return [];
+    const {
+      fileSize: l,
+      filename: s,
+      title: d,
+      author: p,
+      subject: g,
+      createdOn: _,
+      creator: H,
+      keywords: K,
+      modifiedOn: I,
+      pdfProducer: U,
+      pdfVersion: Y,
+      pageCount: Z
+    } = t;
+    return [
+      { label: e == null ? void 0 : e.propertiesFilenameLabel, value: s },
+      { label: e == null ? void 0 : e.propertiesFileSizeLabel, value: l },
+      { separate: !0 },
+      { label: e == null ? void 0 : e.propertiesTitleLabel, value: d },
+      { label: e == null ? void 0 : e.propertiesAuthorLabel, value: p },
+      { label: e == null ? void 0 : e.propertiesSubjectLabel, value: g },
+      { label: e == null ? void 0 : e.propertiesKeywordLabel, value: K },
+      { label: e == null ? void 0 : e.propertiesCreatorLabel, value: H },
+      {
+        label: e == null ? void 0 : e.propertiesCreateOnLabel,
+        value: _ ? A(_) : ""
+      },
+      {
+        label: e == null ? void 0 : e.propertiesModifiedOnLabel,
+        value: I ? A(I) : ""
+      },
+      { separate: !0 },
+      { label: e == null ? void 0 : e.propertiesPDFProducerLabel, value: U },
+      { label: e == null ? void 0 : e.propertiesPDFVersionLabel, value: Y },
+      { label: e == null ? void 0 : e.propertiesPageCountLabel, value: Z }
+    ];
+  }, [t, e]);
+  return /* @__PURE__ */ a(ye, { open: n, onOpenChange: i, children: /* @__PURE__ */ a(Ne, { container: r, children: /* @__PURE__ */ C("div", { className: f["rp-dialog-wrapper"], children: [
+    /* @__PURE__ */ a(Oe, { className: f["rp-dialog-overlay"] }),
+    /* @__PURE__ */ C(Ee, { className: f["rp-document-dialog"], "aria-labelledby": "document-properties-title", children: [
+      /* @__PURE__ */ a(Ie, { id: "document-properties-title", className: f["rp-dialog-title"], children: e == null ? void 0 : e.documentPropertiesLabel }),
+      /* @__PURE__ */ a("div", { className: f["rp-document-properties"], role: "region", "aria-labelledby": "document-properties-title", children: o.map((l, s) => /* @__PURE__ */ a("div", { children: l.separate ? /* @__PURE__ */ a("div", { className: f["rp-properties-divider"], role: "separator", "aria-orientation": "horizontal" }) : /* @__PURE__ */ a(ue, { label: l.label, value: l.value }) }, s)) }),
+      /* @__PURE__ */ a(xe, { asChild: !0, className: f["rp-dialog-close"], "aria-label": (e == null ? void 0 : e.searchCloseButtonTooltip) || "Close dialog", children: /* @__PURE__ */ a(ce, { "aria-hidden": "true" }) })
+    ] })
+  ] }) }) });
+};
 export {
-  Fm as DocumentDialog
+  rt as DocumentDialog
 };

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

@@ -1,4 +1,4 @@
-import { jsxs as n, Fragment as c, jsx as t } from "react/jsx-runtime";
+import { jsxs as m, Fragment as c, jsx as t } from "react/jsx-runtime";
 import { MenuItem as u } from "./MenuItem.js";
 import { InfoIcon as s } from "../../icons/InfoIcon.js";
 import { useOtherToolContext as l } from "../../../contexts/OtherToolContext.js";
@@ -9,29 +9,32 @@ import { useLocalizationContext as x } from "../../../contexts/LocalizationConte
 import { useIconToolContext as C } from "../../../contexts/IconToolContext.js";
 import { useToolComponentContext as I } from "../../../contexts/ToolComponentContext.js";
 import { MenuSeparator as T } from "./MenuSeparator.js";
-import "../../../index-3bf64864.js";
+import "../../../index-61f59539.js";
 import "react";
-import "../../../index-c9a2990a.js";
+import "../../../index-c0faa594.js";
 import "react-dom";
-import "../../../floating-ui.react-dom-d22a10b4.js";
+import "../../../index-e3ee9457.js";
+import "../../../Combination-136ff99c.js";
+import "../../../floating-ui.react-dom-5ec29bd6.js";
+import "../../../index-655864a7.js";
 import "../../../clsx-0c6e471a.js";
 import "../../../utils/withRef.js";
 import "../../../utils/appConsole.js";
 import "../../../utils/hooks/useLocalization.js";
-import "../../../th_TH-d627cd51.js";
+import "../../../de_DE-a553b162.js";
 const a = () => {
   const { documentPropertiesIcon: r } = f(), { documentPropertiesIcon: e } = C();
   return r || e || /* @__PURE__ */ t(s, {});
-}, J = () => {
-  const { setActiveDocumentProperties: r } = l(), { documentProperties: e = !0 } = d(), { documentProperties: m = !0, scrollModeTool: i } = I(), { localeMessages: o } = x();
-  return !e || !m ? null : /* @__PURE__ */ n(c, { children: [
+}, Q = () => {
+  const { setActiveDocumentProperties: r } = l(), { documentProperties: e = !0 } = d(), { documentProperties: n = !0, scrollModeTool: i } = I(), { localeMessages: o } = x();
+  return !e || !n ? null : /* @__PURE__ */ m(c, { children: [
     i && /* @__PURE__ */ t(T, {}),
-    /* @__PURE__ */ t(u, { onClick: () => r((p) => !p), children: /* @__PURE__ */ n(P, { className: "rp-menu-item", content: o == null ? void 0 : o.documentPropertiesTooltip, children: [
+    /* @__PURE__ */ t(u, { onClick: () => r((p) => !p), children: /* @__PURE__ */ m(P, { className: "rp-menu-item", content: o == null ? void 0 : o.documentPropertiesTooltip, children: [
       /* @__PURE__ */ t("div", { className: "rp-menu-item-left", children: /* @__PURE__ */ t(a, {}) }),
       o == null ? void 0 : o.documentPropertiesLabel
     ] }) })
   ] });
 };
 export {
-  J as DocumentProperties
+  Q as DocumentProperties
 };