@kopexa/pdf-viewer 1.0.0

package/dist/index.js

@@ -0,0 +1,263 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/messages.ts
+var import_i18n, messages;
+var init_messages = __esm({
+  "src/messages.ts"() {
+    "use strict";
+    import_i18n = require("@kopexa/i18n");
+    messages = (0, import_i18n.defineMessages)({
+      loading: {
+        id: "pdf_viewer.loading",
+        defaultMessage: "Loading document\u2026",
+        description: "Shown while the PDF document is loading"
+      },
+      error_title: {
+        id: "pdf_viewer.error_title",
+        defaultMessage: "Something went wrong while loading the document.",
+        description: "Primary error message when PDF fails to load"
+      },
+      error_hint: {
+        id: "pdf_viewer.error_hint",
+        defaultMessage: "Please try again.",
+        description: "Secondary error message hinting the user to retry"
+      },
+      page_label: {
+        id: "pdf_viewer.page_label",
+        defaultMessage: "Page {page} of {total}",
+        description: "Page indicator below each page of the PDF"
+      }
+    });
+  }
+});
+
+// src/pdf-viewer.tsx
+var pdf_viewer_exports = {};
+__export(pdf_viewer_exports, {
+  PDFViewer: () => PDFViewer,
+  configurePDFWorker: () => configurePDFWorker,
+  pdfjs: () => import_react_pdf.pdfjs
+});
+function configurePDFWorker(workerSrc) {
+  if (typeof window === "undefined") return;
+  import_react_pdf.pdfjs.GlobalWorkerOptions.workerSrc = workerSrc != null ? workerSrc : `https://unpkg.com/pdfjs-dist@${import_react_pdf.pdfjs.version}/build/pdf.worker.min.mjs`;
+}
+function base64ToUint8Array(base64String) {
+  const binaryString = atob(base64String);
+  const bytes = new Uint8Array(binaryString.length);
+  for (let i = 0; i < binaryString.length; i++) {
+    bytes[i] = binaryString.charCodeAt(i);
+  }
+  return bytes;
+}
+var import_i18n2, import_motion_utils, import_shared_utils, import_react, import_react2, import_react_pdf, import_AnnotationLayer, import_TextLayer, import_jsx_runtime, PAGE_SELECTOR, FADE_TRANSITION, PDFViewer;
+var init_pdf_viewer = __esm({
+  "src/pdf-viewer.tsx"() {
+    "use strict";
+    "use client";
+    import_i18n2 = require("@kopexa/i18n");
+    import_motion_utils = require("@kopexa/motion-utils");
+    import_shared_utils = require("@kopexa/shared-utils");
+    import_react = require("motion/react");
+    import_react2 = require("react");
+    import_react_pdf = require("react-pdf");
+    import_AnnotationLayer = require("react-pdf/dist/Page/AnnotationLayer.css");
+    import_TextLayer = require("react-pdf/dist/Page/TextLayer.css");
+    init_messages();
+    import_jsx_runtime = require("react/jsx-runtime");
+    PAGE_SELECTOR = "[data-page-number]";
+    FADE_TRANSITION = {
+      duration: 0.4,
+      ease: import_motion_utils.TRANSITION_EASINGS.ease
+    };
+    PDFViewer = ({
+      className,
+      source,
+      onDocumentLoad,
+      onPageClick,
+      customPageRenderer,
+      options,
+      loadingContent,
+      errorContent,
+      pageLabel: pageLabelProp,
+      ...props
+    }) => {
+      var _a;
+      const intl = (0, import_i18n2.useSafeIntl)();
+      const $el = (0, import_react2.useRef)(null);
+      const [width, setWidth] = (0, import_react2.useState)(0);
+      const [numPages, setNumPages] = (0, import_react2.useState)(0);
+      const [pdfError, setPdfError] = (0, import_react2.useState)(false);
+      const sourceUrl = source.type === "url" ? source.url : null;
+      const sourceData = source.type === "data" ? source.data : null;
+      const sourceBase64 = source.type === "base64" ? source.data : null;
+      const fileRef = (0, import_react2.useRef)(null);
+      const prevKeyRef = (0, import_react2.useRef)(null);
+      const currentKey = (_a = sourceUrl != null ? sourceUrl : sourceData) != null ? _a : sourceBase64;
+      if (currentKey !== prevKeyRef.current) {
+        prevKeyRef.current = currentKey;
+        if (sourceUrl) {
+          fileRef.current = sourceUrl;
+        } else if (sourceData) {
+          fileRef.current = { data: sourceData };
+        } else if (sourceBase64) {
+          fileRef.current = { data: base64ToUint8Array(sourceBase64) };
+        } else {
+          fileRef.current = null;
+        }
+      }
+      const file = fileRef.current;
+      const onDocumentLoaded = (doc) => {
+        setNumPages(doc.numPages);
+        onDocumentLoad == null ? void 0 : onDocumentLoad(doc);
+      };
+      const onDocumentPageClick = (event, pageNumber) => {
+        const target = event.target instanceof HTMLElement ? event.target : null;
+        if (!target) return;
+        const $page = target.closest(PAGE_SELECTOR);
+        if (!$page) return;
+        const { height, width: width2, top, left } = $page.getBoundingClientRect();
+        onPageClick == null ? void 0 : onPageClick({
+          pageNumber,
+          numPages,
+          originalEvent: event,
+          pageHeight: height,
+          pageWidth: width2,
+          pageX: event.clientX - left,
+          pageY: event.clientY - top
+        });
+      };
+      (0, import_react2.useEffect)(() => {
+        if (!$el.current) return;
+        const $current = $el.current;
+        const updateWidth = () => {
+          setWidth($current.getBoundingClientRect().width);
+        };
+        updateWidth();
+        window.addEventListener("resize", updateWidth);
+        return () => window.removeEventListener("resize", updateWidth);
+      }, []);
+      const loader = loadingContent != null ? loadingContent : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex h-[80vh] max-h-[60rem] flex-col items-center justify-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-12 w-12 animate-spin rounded-full border-4 border-muted border-t-primary" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-4 text-muted-foreground", children: intl.formatMessage(messages.loading) })
+      ] });
+      const error = errorContent != null ? errorContent : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex h-[80vh] max-h-[60rem] flex-col items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-center text-muted-foreground", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: intl.formatMessage(messages.error_title) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-1 text-sm", children: intl.formatMessage(messages.error_hint) })
+      ] }) });
+      if (!file) return error;
+      const isLoaded = numPages > 0;
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.LazyMotion, { features: import_react.domAnimation, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: $el, className: (0, import_shared_utils.cn)("overflow-hidden", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_react_pdf.Document,
+        {
+          file,
+          className: (0, import_shared_utils.cn)("w-full overflow-hidden rounded", {
+            "h-[80vh] max-h-[60rem]": !isLoaded
+          }),
+          onLoadSuccess: onDocumentLoaded,
+          onSourceError: () => setPdfError(true),
+          externalLinkTarget: "_blank",
+          loading: pdfError ? error : loader,
+          error,
+          options,
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.AnimatePresence, { mode: "wait", children: !isLoaded ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_react.m.div,
+            {
+              initial: { opacity: 1 },
+              exit: { opacity: 0 },
+              transition: FADE_TRANSITION,
+              children: pdfError ? error : loader
+            },
+            "loader"
+          ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_react.m.div,
+            {
+              initial: { opacity: 0 },
+              animate: { opacity: 1 },
+              transition: FADE_TRANSITION,
+              children: Array.from({ length: numPages }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "last:-mb-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "overflow-hidden rounded border border-border will-change-transform", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_react_pdf.Page,
+                  {
+                    pageNumber: i + 1,
+                    width,
+                    renderAnnotationLayer: true,
+                    renderTextLayer: true,
+                    loading: () => "",
+                    renderMode: customPageRenderer ? "custom" : "canvas",
+                    customRenderer: customPageRenderer,
+                    onClick: (e) => onDocumentPageClick(e, i + 1)
+                  }
+                ) }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "my-2 text-center text-[11px] text-muted-foreground/80", children: pageLabelProp ? pageLabelProp(i + 1, numPages) : intl.formatMessage(messages.page_label, {
+                  page: i + 1,
+                  total: numPages
+                }) })
+              ] }, `page-${i + 1}`))
+            },
+            "pages"
+          ) })
+        }
+      ) }) });
+    };
+  }
+});
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  PDFViewer: () => PDFViewer,
+  PDFViewerLazy: () => PDFViewerLazy,
+  configurePDFWorker: () => configurePDFWorker,
+  pdfjs: () => import_react_pdf.pdfjs
+});
+module.exports = __toCommonJS(index_exports);
+init_pdf_viewer();
+
+// src/pdf-viewer-lazy.tsx
+var import_i18n3 = require("@kopexa/i18n");
+var import_react_utils = require("@kopexa/react-utils");
+var import_react3 = require("react");
+init_messages();
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var LazyPDFViewer = (0, import_react3.lazy)(
+  () => Promise.resolve().then(() => (init_pdf_viewer(), pdf_viewer_exports)).then((mod) => ({ default: mod.PDFViewer }))
+);
+var DefaultFallback = () => {
+  const intl = (0, import_i18n3.useSafeIntl)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex h-[80vh] max-h-[60rem] flex-col items-center justify-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "h-12 w-12 animate-spin rounded-full border-4 border-muted border-t-primary" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "mt-4 text-muted-foreground", children: intl.formatMessage(messages.loading) })
+  ] });
+};
+var PDFViewerLazy = ({ fallback, ...props }) => {
+  const fb = fallback != null ? fallback : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(DefaultFallback, {});
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_utils.ClientOnly, { fallback: fb, children: () => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react3.Suspense, { fallback: fb, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LazyPDFViewer, { ...props }) }) });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PDFViewer,
+  PDFViewerLazy,
+  configurePDFWorker,
+  pdfjs
+});

package/dist/index.mjs

@@ -0,0 +1,15 @@
+import {
+  PDFViewerLazy
+} from "./chunk-P4M32GKY.mjs";
+import {
+  PDFViewer,
+  configurePDFWorker,
+  pdfjs
+} from "./chunk-EIAXW4SI.mjs";
+import "./chunk-UJB5LFCW.mjs";
+export {
+  PDFViewer,
+  PDFViewerLazy,
+  configurePDFWorker,
+  pdfjs
+};

package/dist/messages.d.mts

@@ -0,0 +1,24 @@
+declare const messages: {
+    loading: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    error_title: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    error_hint: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    page_label: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+
+export { messages };

package/dist/messages.d.ts

@@ -0,0 +1,24 @@
+declare const messages: {
+    loading: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    error_title: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    error_hint: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    page_label: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+
+export { messages };

package/dist/messages.js

@@ -0,0 +1,52 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/messages.ts
+var messages_exports = {};
+__export(messages_exports, {
+  messages: () => messages
+});
+module.exports = __toCommonJS(messages_exports);
+var import_i18n = require("@kopexa/i18n");
+var messages = (0, import_i18n.defineMessages)({
+  loading: {
+    id: "pdf_viewer.loading",
+    defaultMessage: "Loading document\u2026",
+    description: "Shown while the PDF document is loading"
+  },
+  error_title: {
+    id: "pdf_viewer.error_title",
+    defaultMessage: "Something went wrong while loading the document.",
+    description: "Primary error message when PDF fails to load"
+  },
+  error_hint: {
+    id: "pdf_viewer.error_hint",
+    defaultMessage: "Please try again.",
+    description: "Secondary error message hinting the user to retry"
+  },
+  page_label: {
+    id: "pdf_viewer.page_label",
+    defaultMessage: "Page {page} of {total}",
+    description: "Page indicator below each page of the PDF"
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  messages
+});

package/dist/messages.mjs

@@ -0,0 +1,6 @@
+import {
+  messages
+} from "./chunk-UJB5LFCW.mjs";
+export {
+  messages
+};

package/dist/pdf-viewer-lazy.d.mts

@@ -0,0 +1,17 @@
+import { PDFViewerProps } from './pdf-viewer.mjs';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import 'react-pdf';
+import 'react';
+
+type PDFViewerLazyProps = PDFViewerProps & {
+    /** Fallback content shown during SSR and before hydration. */
+    fallback?: React.ReactNode;
+};
+/**
+ * A lazy-loaded PDF viewer that only renders on the client.
+ * Uses `ClientOnly` to prevent SSR and `React.lazy` to avoid
+ * importing pdfjs-dist on the server (which requires browser APIs like DOMMatrix).
+ */
+declare const PDFViewerLazy: ({ fallback, ...props }: PDFViewerLazyProps) => react_jsx_runtime.JSX.Element;
+
+export { PDFViewerLazy, type PDFViewerLazyProps };

package/dist/pdf-viewer-lazy.d.ts

@@ -0,0 +1,17 @@
+import { PDFViewerProps } from './pdf-viewer.js';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import 'react-pdf';
+import 'react';
+
+type PDFViewerLazyProps = PDFViewerProps & {
+    /** Fallback content shown during SSR and before hydration. */
+    fallback?: React.ReactNode;
+};
+/**
+ * A lazy-loaded PDF viewer that only renders on the client.
+ * Uses `ClientOnly` to prevent SSR and `React.lazy` to avoid
+ * importing pdfjs-dist on the server (which requires browser APIs like DOMMatrix).
+ */
+declare const PDFViewerLazy: ({ fallback, ...props }: PDFViewerLazyProps) => react_jsx_runtime.JSX.Element;
+
+export { PDFViewerLazy, type PDFViewerLazyProps };

package/dist/pdf-viewer-lazy.js

@@ -0,0 +1,255 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/messages.ts
+var import_i18n, messages;
+var init_messages = __esm({
+  "src/messages.ts"() {
+    "use strict";
+    import_i18n = require("@kopexa/i18n");
+    messages = (0, import_i18n.defineMessages)({
+      loading: {
+        id: "pdf_viewer.loading",
+        defaultMessage: "Loading document\u2026",
+        description: "Shown while the PDF document is loading"
+      },
+      error_title: {
+        id: "pdf_viewer.error_title",
+        defaultMessage: "Something went wrong while loading the document.",
+        description: "Primary error message when PDF fails to load"
+      },
+      error_hint: {
+        id: "pdf_viewer.error_hint",
+        defaultMessage: "Please try again.",
+        description: "Secondary error message hinting the user to retry"
+      },
+      page_label: {
+        id: "pdf_viewer.page_label",
+        defaultMessage: "Page {page} of {total}",
+        description: "Page indicator below each page of the PDF"
+      }
+    });
+  }
+});
+
+// src/pdf-viewer.tsx
+var pdf_viewer_exports = {};
+__export(pdf_viewer_exports, {
+  PDFViewer: () => PDFViewer,
+  configurePDFWorker: () => configurePDFWorker,
+  pdfjs: () => import_react_pdf.pdfjs
+});
+function configurePDFWorker(workerSrc) {
+  if (typeof window === "undefined") return;
+  import_react_pdf.pdfjs.GlobalWorkerOptions.workerSrc = workerSrc != null ? workerSrc : `https://unpkg.com/pdfjs-dist@${import_react_pdf.pdfjs.version}/build/pdf.worker.min.mjs`;
+}
+function base64ToUint8Array(base64String) {
+  const binaryString = atob(base64String);
+  const bytes = new Uint8Array(binaryString.length);
+  for (let i = 0; i < binaryString.length; i++) {
+    bytes[i] = binaryString.charCodeAt(i);
+  }
+  return bytes;
+}
+var import_i18n2, import_motion_utils, import_shared_utils, import_react, import_react2, import_react_pdf, import_AnnotationLayer, import_TextLayer, import_jsx_runtime, PAGE_SELECTOR, FADE_TRANSITION, PDFViewer;
+var init_pdf_viewer = __esm({
+  "src/pdf-viewer.tsx"() {
+    "use strict";
+    "use client";
+    import_i18n2 = require("@kopexa/i18n");
+    import_motion_utils = require("@kopexa/motion-utils");
+    import_shared_utils = require("@kopexa/shared-utils");
+    import_react = require("motion/react");
+    import_react2 = require("react");
+    import_react_pdf = require("react-pdf");
+    import_AnnotationLayer = require("react-pdf/dist/Page/AnnotationLayer.css");
+    import_TextLayer = require("react-pdf/dist/Page/TextLayer.css");
+    init_messages();
+    import_jsx_runtime = require("react/jsx-runtime");
+    PAGE_SELECTOR = "[data-page-number]";
+    FADE_TRANSITION = {
+      duration: 0.4,
+      ease: import_motion_utils.TRANSITION_EASINGS.ease
+    };
+    PDFViewer = ({
+      className,
+      source,
+      onDocumentLoad,
+      onPageClick,
+      customPageRenderer,
+      options,
+      loadingContent,
+      errorContent,
+      pageLabel: pageLabelProp,
+      ...props
+    }) => {
+      var _a;
+      const intl = (0, import_i18n2.useSafeIntl)();
+      const $el = (0, import_react2.useRef)(null);
+      const [width, setWidth] = (0, import_react2.useState)(0);
+      const [numPages, setNumPages] = (0, import_react2.useState)(0);
+      const [pdfError, setPdfError] = (0, import_react2.useState)(false);
+      const sourceUrl = source.type === "url" ? source.url : null;
+      const sourceData = source.type === "data" ? source.data : null;
+      const sourceBase64 = source.type === "base64" ? source.data : null;
+      const fileRef = (0, import_react2.useRef)(null);
+      const prevKeyRef = (0, import_react2.useRef)(null);
+      const currentKey = (_a = sourceUrl != null ? sourceUrl : sourceData) != null ? _a : sourceBase64;
+      if (currentKey !== prevKeyRef.current) {
+        prevKeyRef.current = currentKey;
+        if (sourceUrl) {
+          fileRef.current = sourceUrl;
+        } else if (sourceData) {
+          fileRef.current = { data: sourceData };
+        } else if (sourceBase64) {
+          fileRef.current = { data: base64ToUint8Array(sourceBase64) };
+        } else {
+          fileRef.current = null;
+        }
+      }
+      const file = fileRef.current;
+      const onDocumentLoaded = (doc) => {
+        setNumPages(doc.numPages);
+        onDocumentLoad == null ? void 0 : onDocumentLoad(doc);
+      };
+      const onDocumentPageClick = (event, pageNumber) => {
+        const target = event.target instanceof HTMLElement ? event.target : null;
+        if (!target) return;
+        const $page = target.closest(PAGE_SELECTOR);
+        if (!$page) return;
+        const { height, width: width2, top, left } = $page.getBoundingClientRect();
+        onPageClick == null ? void 0 : onPageClick({
+          pageNumber,
+          numPages,
+          originalEvent: event,
+          pageHeight: height,
+          pageWidth: width2,
+          pageX: event.clientX - left,
+          pageY: event.clientY - top
+        });
+      };
+      (0, import_react2.useEffect)(() => {
+        if (!$el.current) return;
+        const $current = $el.current;
+        const updateWidth = () => {
+          setWidth($current.getBoundingClientRect().width);
+        };
+        updateWidth();
+        window.addEventListener("resize", updateWidth);
+        return () => window.removeEventListener("resize", updateWidth);
+      }, []);
+      const loader = loadingContent != null ? loadingContent : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex h-[80vh] max-h-[60rem] flex-col items-center justify-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-12 w-12 animate-spin rounded-full border-4 border-muted border-t-primary" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-4 text-muted-foreground", children: intl.formatMessage(messages.loading) })
+      ] });
+      const error = errorContent != null ? errorContent : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex h-[80vh] max-h-[60rem] flex-col items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "text-center text-muted-foreground", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: intl.formatMessage(messages.error_title) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-1 text-sm", children: intl.formatMessage(messages.error_hint) })
+      ] }) });
+      if (!file) return error;
+      const isLoaded = numPages > 0;
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.LazyMotion, { features: import_react.domAnimation, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: $el, className: (0, import_shared_utils.cn)("overflow-hidden", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_react_pdf.Document,
+        {
+          file,
+          className: (0, import_shared_utils.cn)("w-full overflow-hidden rounded", {
+            "h-[80vh] max-h-[60rem]": !isLoaded
+          }),
+          onLoadSuccess: onDocumentLoaded,
+          onSourceError: () => setPdfError(true),
+          externalLinkTarget: "_blank",
+          loading: pdfError ? error : loader,
+          error,
+          options,
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.AnimatePresence, { mode: "wait", children: !isLoaded ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_react.m.div,
+            {
+              initial: { opacity: 1 },
+              exit: { opacity: 0 },
+              transition: FADE_TRANSITION,
+              children: pdfError ? error : loader
+            },
+            "loader"
+          ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_react.m.div,
+            {
+              initial: { opacity: 0 },
+              animate: { opacity: 1 },
+              transition: FADE_TRANSITION,
+              children: Array.from({ length: numPages }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "last:-mb-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "overflow-hidden rounded border border-border will-change-transform", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_react_pdf.Page,
+                  {
+                    pageNumber: i + 1,
+                    width,
+                    renderAnnotationLayer: true,
+                    renderTextLayer: true,
+                    loading: () => "",
+                    renderMode: customPageRenderer ? "custom" : "canvas",
+                    customRenderer: customPageRenderer,
+                    onClick: (e) => onDocumentPageClick(e, i + 1)
+                  }
+                ) }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "my-2 text-center text-[11px] text-muted-foreground/80", children: pageLabelProp ? pageLabelProp(i + 1, numPages) : intl.formatMessage(messages.page_label, {
+                  page: i + 1,
+                  total: numPages
+                }) })
+              ] }, `page-${i + 1}`))
+            },
+            "pages"
+          ) })
+        }
+      ) }) });
+    };
+  }
+});
+
+// src/pdf-viewer-lazy.tsx
+var pdf_viewer_lazy_exports = {};
+__export(pdf_viewer_lazy_exports, {
+  PDFViewerLazy: () => PDFViewerLazy
+});
+module.exports = __toCommonJS(pdf_viewer_lazy_exports);
+var import_i18n3 = require("@kopexa/i18n");
+var import_react_utils = require("@kopexa/react-utils");
+var import_react3 = require("react");
+init_messages();
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var LazyPDFViewer = (0, import_react3.lazy)(
+  () => Promise.resolve().then(() => (init_pdf_viewer(), pdf_viewer_exports)).then((mod) => ({ default: mod.PDFViewer }))
+);
+var DefaultFallback = () => {
+  const intl = (0, import_i18n3.useSafeIntl)();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex h-[80vh] max-h-[60rem] flex-col items-center justify-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "h-12 w-12 animate-spin rounded-full border-4 border-muted border-t-primary" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "mt-4 text-muted-foreground", children: intl.formatMessage(messages.loading) })
+  ] });
+};
+var PDFViewerLazy = ({ fallback, ...props }) => {
+  const fb = fallback != null ? fallback : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(DefaultFallback, {});
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_utils.ClientOnly, { fallback: fb, children: () => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react3.Suspense, { fallback: fb, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LazyPDFViewer, { ...props }) }) });
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  PDFViewerLazy
+});