@design.estate/dees-catalog 3.41.2 → 3.41.3

package/dist_watch/bundle.js

@@ -142108,6 +142108,7 @@ var viewerStyles = [
       border-radius: 4px;
       overflow: hidden;
       display: inline-block;
+      position: relative;
     }
 
     .page-canvas {
@@ -142116,6 +142117,52 @@ var viewerStyles = [
       image-rendering: crisp-edges;
     }
 
+    /* Text layer for selection */
+    .text-layer {
+      position: absolute;
+      inset: 0;
+      overflow: visible;
+      line-height: 1;
+      text-size-adjust: none;
+      forced-color-adjust: none;
+      transform-origin: 0 0;
+      z-index: 1;
+      user-select: text;
+      -webkit-user-select: text;
+    }
+
+    .text-layer span,
+    .text-layer br {
+      color: transparent;
+      position: absolute;
+      white-space: pre;
+      cursor: text;
+      transform-origin: 0% 0%;
+      user-select: text;
+      -webkit-user-select: text;
+    }
+
+    .text-layer ::selection {
+      background: rgba(0, 100, 200, 0.3);
+    }
+
+    .text-layer br::selection {
+      background: transparent;
+    }
+
+    .text-layer .endOfContent {
+      display: block;
+      position: absolute;
+      inset: 100% 0 0;
+      z-index: 0;
+      cursor: default;
+      user-select: none;
+    }
+
+    .text-layer.selecting .endOfContent {
+      top: 0;
+    }
+
     .pdf-viewer.with-sidebar .viewer-main {
       margin-left: 0;
     }
@@ -142221,6 +142268,7 @@ var DeesPdfViewer = class extends (_a73 = DeesElement, _pdfUrl_dec = [n5({ type:
     __publicField(this, "currentRenderPromise", null);
     __publicField(this, "thumbnailRenderTasks", []);
     __publicField(this, "pageRenderTasks", /* @__PURE__ */ new Map());
+    __publicField(this, "textLayerRenderTasks", /* @__PURE__ */ new Map());
     __publicField(this, "canvas");
     __publicField(this, "ctx");
     __publicField(this, "viewerMain", null);
@@ -142393,6 +142441,7 @@ var DeesPdfViewer = class extends (_a73 = DeesElement, _pdfUrl_dec = [n5({ type:
                     <div class="page-wrapper" data-page="${item.page}">
                       <div class="canvas-container">
                         <canvas class="page-canvas" data-page="${item.page}"></canvas>
+                        <div class="text-layer" data-page="${item.page}"></div>
                       </div>
                     </div>
                   `
@@ -142465,7 +142514,8 @@ var DeesPdfViewer = class extends (_a73 = DeesElement, _pdfUrl_dec = [n5({ type:
       this.pageData = Array.from({ length: this.totalPages }, (_4, i11) => ({
         page: i11 + 1,
         rendered: false,
-        rendering: false
+        rendering: false,
+        textLayerRendered: false
       }));
       this.loading = false;
       await this.updateComplete;
@@ -142571,6 +142621,7 @@ var DeesPdfViewer = class extends (_a73 = DeesElement, _pdfUrl_dec = [n5({ type:
       pageInfo.rendered = true;
       pageInfo.rendering = false;
       this.pageRenderTasks.delete(pageNum);
+      await this.renderTextLayer(pageNum);
       this.requestUpdate("pageData");
     } catch (error) {
       if (error?.name !== "RenderingCancelledException") {
@@ -142580,6 +142631,100 @@ var DeesPdfViewer = class extends (_a73 = DeesElement, _pdfUrl_dec = [n5({ type:
       this.pageRenderTasks.delete(pageNum);
     }
   }
+  async renderTextLayer(pageNum) {
+    const pageInfo = this.pageData.find((p7) => p7.page === pageNum);
+    if (!pageInfo || pageInfo.textLayerRendered) return;
+    try {
+      const textLayerDiv = this.shadowRoot?.querySelector(
+        `.text-layer[data-page="${pageNum}"]`
+      );
+      if (!textLayerDiv) return;
+      textLayerDiv.innerHTML = "";
+      const page = await this.pdfDocument.getPage(pageNum);
+      const textContent = await page.getTextContent();
+      const viewport = this.computeViewport(page);
+      const pdfjs = await import("https://cdn.jsdelivr.net/npm/pdfjs-dist@4.0.379/+esm");
+      textLayerDiv.style.width = `${viewport.width}px`;
+      textLayerDiv.style.height = `${viewport.height}px`;
+      textLayerDiv.style.setProperty("--scale-factor", String(viewport.scale));
+      const textLayerRenderTask = pdfjs.renderTextLayer({
+        textContentSource: textContent,
+        container: textLayerDiv,
+        viewport
+      });
+      this.textLayerRenderTasks.set(pageNum, textLayerRenderTask);
+      await textLayerRenderTask.promise;
+      const endOfContent = document.createElement("div");
+      endOfContent.className = "endOfContent";
+      textLayerDiv.appendChild(endOfContent);
+      let isDragging = false;
+      let anchorNode = null;
+      let anchorOffset = 0;
+      const getTextPositionFromPoint = (x3, y5) => {
+        const spans = Array.from(textLayerDiv.querySelectorAll("span"));
+        for (const span of spans) {
+          const rect = span.getBoundingClientRect();
+          if (x3 >= rect.left && x3 <= rect.right && y5 >= rect.top && y5 <= rect.bottom) {
+            const textNode = span.firstChild;
+            if (textNode && textNode.nodeType === Node.TEXT_NODE) {
+              const text9 = textNode.textContent || "";
+              const charWidth = rect.width / text9.length;
+              const relativeX = x3 - rect.left;
+              const offset = Math.min(Math.round(relativeX / charWidth), text9.length);
+              return { node: textNode, offset };
+            }
+          }
+        }
+        return null;
+      };
+      const handleMouseUp = () => {
+        if (isDragging) {
+          isDragging = false;
+          anchorNode = null;
+          textLayerDiv.classList.remove("selecting");
+        }
+        document.removeEventListener("mouseup", handleMouseUp);
+        document.removeEventListener("mousemove", handleMouseMove);
+      };
+      const handleMouseMove = (e11) => {
+        if (!isDragging || !anchorNode) return;
+        e11.preventDefault();
+        const pos = getTextPositionFromPoint(e11.clientX, e11.clientY);
+        if (pos) {
+          const selection = window.getSelection();
+          if (selection) {
+            try {
+              selection.setBaseAndExtent(anchorNode, anchorOffset, pos.node, pos.offset);
+            } catch (err) {
+            }
+          }
+        }
+      };
+      textLayerDiv.addEventListener("mousedown", (e11) => {
+        if (e11.button !== 0) return;
+        const pos = getTextPositionFromPoint(e11.clientX, e11.clientY);
+        if (pos) {
+          e11.preventDefault();
+          isDragging = true;
+          anchorNode = pos.node;
+          anchorOffset = pos.offset;
+          textLayerDiv.classList.add("selecting");
+          const selection = window.getSelection();
+          selection?.removeAllRanges();
+          document.addEventListener("mousemove", handleMouseMove);
+          document.addEventListener("mouseup", handleMouseUp);
+        }
+      });
+      pageInfo.textLayerRendered = true;
+      page.cleanup?.();
+      this.textLayerRenderTasks.delete(pageNum);
+    } catch (error) {
+      if (error?.name !== "RenderingCancelledException") {
+        console.error(`Error rendering text layer for page ${pageNum}:`, error);
+      }
+      this.textLayerRenderTasks.delete(pageNum);
+    }
+  }
   updateCurrentPage() {
     if (!this.viewerMain) return;
     const scrollTop = this.viewerMain.scrollTop;
@@ -142776,6 +142921,7 @@ var DeesPdfViewer = class extends (_a73 = DeesElement, _pdfUrl_dec = [n5({ type:
     this.pageData.forEach((page) => {
       page.rendered = false;
       page.rendering = false;
+      page.textLayerRendered = false;
     });
     this.pageRenderTasks.forEach((task) => {
       try {
@@ -142784,55 +142930,130 @@ var DeesPdfViewer = class extends (_a73 = DeesElement, _pdfUrl_dec = [n5({ type:
       }
     });
     this.pageRenderTasks.clear();
+    this.textLayerRenderTasks.forEach((task) => {
+      try {
+        task.cancel?.();
+      } catch (error) {
+      }
+    });
+    this.textLayerRenderTasks.clear();
     this.requestUpdate();
     this.updateComplete.then(() => {
       this.renderVisiblePages();
     });
   }
-  downloadPdf() {
-    const link3 = document.createElement("a");
-    link3.href = this.pdfUrl;
-    link3.download = this.pdfUrl.split("/").pop() || "document.pdf";
-    link3.click();
+  async downloadPdf() {
+    if (!this.pdfDocument) return;
+    try {
+      const data = await this.pdfDocument.getData();
+      const blob = new Blob([data.buffer], { type: "application/pdf" });
+      const blobUrl = URL.createObjectURL(blob);
+      const link3 = document.createElement("a");
+      link3.href = blobUrl;
+      link3.download = this.pdfUrl ? this.pdfUrl.split("/").pop() || "document.pdf" : "document.pdf";
+      link3.click();
+      setTimeout(() => URL.revokeObjectURL(blobUrl), 1e3);
+    } catch (error) {
+      console.error("Error downloading PDF:", error);
+    }
   }
-  printPdf() {
-    window.open(this.pdfUrl, "_blank")?.print();
+  async printPdf() {
+    if (!this.pdfDocument) return;
+    try {
+      const data = await this.pdfDocument.getData();
+      const blob = new Blob([data.buffer], { type: "application/pdf" });
+      const pdfUrl = URL.createObjectURL(blob);
+      const htmlContent = `
+        <!DOCTYPE html>
+        <html>
+        <head>
+          <title>Print PDF</title>
+          <style>
+            * { margin: 0; padding: 0; }
+            html, body { width: 100%; height: 100%; overflow: hidden; }
+            iframe { width: 100%; height: 100%; border: none; }
+            @media print {
+              html, body, iframe { width: 100%; height: 100%; }
+            }
+          </style>
+        </head>
+        <body>
+          <iframe src="${pdfUrl}" type="application/pdf"></iframe>
+          <script>
+            window.onload = function() {
+              setTimeout(function() {
+                window.focus();
+                window.print();
+              }, 500);
+            };
+            window.onafterprint = function() {
+              window.close();
+            };
+            // Safety close after 2 minutes
+            setTimeout(function() { window.close(); }, 120000);
+          <\/script>
+        </body>
+        </html>
+      `;
+      const htmlBlob = new Blob([htmlContent], { type: "text/html" });
+      const htmlUrl = URL.createObjectURL(htmlBlob);
+      const printWindow = window.open(htmlUrl, "_blank", "width=800,height=600");
+      if (printWindow) {
+        const checkClosed = setInterval(() => {
+          if (printWindow.closed) {
+            clearInterval(checkClosed);
+            URL.revokeObjectURL(pdfUrl);
+            URL.revokeObjectURL(htmlUrl);
+          }
+        }, 500);
+        setTimeout(() => {
+          clearInterval(checkClosed);
+          URL.revokeObjectURL(pdfUrl);
+          URL.revokeObjectURL(htmlUrl);
+        }, 12e4);
+      } else {
+        window.open(pdfUrl, "_blank");
+        setTimeout(() => URL.revokeObjectURL(pdfUrl), 6e4);
+        URL.revokeObjectURL(htmlUrl);
+      }
+    } catch (error) {
+      console.error("Error printing PDF:", error);
+    }
   }
   /**
    * Provide context menu items for right-click functionality
    */
   getContextMenuItems() {
-    return [
-      {
-        name: "Open PDF in New Tab",
-        iconName: "lucide:ExternalLink",
-        action: async () => {
-          window.open(this.pdfUrl, "_blank");
-        }
-      },
-      { divider: true },
-      {
-        name: "Copy PDF URL",
+    const items = [];
+    const selection = window.getSelection();
+    const selectedText = selection?.toString() || "";
+    if (selectedText) {
+      items.push({
+        name: "Copy",
         iconName: "lucide:Copy",
         action: async () => {
-          await navigator.clipboard.writeText(this.pdfUrl);
+          await navigator.clipboard.writeText(selectedText);
         }
-      },
+      });
+      items.push({ divider: true });
+    }
+    items.push(
       {
         name: "Download PDF",
         iconName: "lucide:Download",
         action: async () => {
-          this.downloadPdf();
+          await this.downloadPdf();
         }
       },
       {
         name: "Print PDF",
         iconName: "lucide:Printer",
         action: async () => {
-          this.printPdf();
+          await this.printPdf();
         }
       }
-    ];
+    );
+    return items;
   }
   get canZoomIn() {
     return this.viewportMode !== "custom" || this.currentZoom < this.MANUAL_MAX_ZOOM;
@@ -142956,6 +143177,13 @@ var DeesPdfViewer = class extends (_a73 = DeesElement, _pdfUrl_dec = [n5({ type:
       }
     });
     this.pageRenderTasks.clear();
+    this.textLayerRenderTasks.forEach((task) => {
+      try {
+        task.cancel?.();
+      } catch (error) {
+      }
+    });
+    this.textLayerRenderTasks.clear();
     for (const task of this.thumbnailRenderTasks || []) {
       try {
         task.cancel();