@design.estate/dees-catalog 3.41.0 → 3.41.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@design.estate/dees-catalog",
-  "version": "3.41.0",
+  "version": "3.41.2",
   "private": false,
   "description": "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.",
   "main": "dist_ts_web/index.js",
@@ -16,8 +16,8 @@
   "author": "Lossless GmbH",
   "license": "MIT",
   "dependencies": {
-    "@design.estate/dees-domtools": "^2.3.7",
-    "@design.estate/dees-element": "^2.1.5",
+    "@design.estate/dees-domtools": "^2.3.8",
+    "@design.estate/dees-element": "^2.1.6",
     "@design.estate/dees-wcctools": "^3.8.0",
     "@fortawesome/fontawesome-svg-core": "^7.1.0",
     "@fortawesome/free-brands-svg-icons": "^7.1.0",

package/ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@design.estate/dees-catalog',
-  version: '3.41.0',
+  version: '3.41.2',
   description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
 }

package/ts_web/elements/00group-dataview/dees-dataview-codebox/dees-dataview-codebox.ts

@@ -52,6 +52,8 @@ export class DeesDataviewCodebox extends DeesElement {
           text-align: left;
           font-size: 16px;
           font-family: ${cssGeistFontFamily};
+          height: 100%;
+          box-sizing: border-box;
         }
         .mainbox {
           position: relative;
@@ -61,6 +63,10 @@ export class DeesDataviewCodebox extends DeesElement {
           background: ${cssManager.bdTheme('#ffffff', '#09090b')};
           border-radius: 6px;
           overflow: hidden;
+          display: flex;
+          flex-direction: column;
+          height: 100%;
+          box-sizing: border-box;
         }
 
         .appbar {
@@ -74,6 +80,7 @@ export class DeesDataviewCodebox extends DeesElement {
           line-height: 32px;
           justify-content: center;
           align-items: center;
+          flex-shrink: 0;
         }
 
         .appbar .fileName {
@@ -95,6 +102,7 @@ export class DeesDataviewCodebox extends DeesElement {
           justify-content: flex-end;
           align-items: stretch;
           overflow: hidden;
+          flex-shrink: 0;
         }
 
         .spacesLabel {
@@ -121,7 +129,9 @@ export class DeesDataviewCodebox extends DeesElement {
         .codegrid {
           display: grid;
           grid-template-columns: 50px auto;
-          overflow: hidden;
+          overflow: auto;
+          flex: 1;
+          min-height: 0;
         }
 
         .lineNumbers {

package/ts_web/elements/00group-media/dees-pdf-viewer/component.ts

@@ -444,9 +444,10 @@ export class DeesPdfViewer extends DeesElement {
       const page = await this.pdfDocument.getPage(pageNum);
       const viewport = this.computeViewport(page);
 
-      // Set canvas dimensions
-      canvas.height = viewport.height;
-      canvas.width = viewport.width;
+      // Set canvas dimensions with device pixel ratio for sharp rendering
+      const dpr = window.devicePixelRatio || 1;
+      canvas.width = Math.floor(viewport.width * dpr);
+      canvas.height = Math.floor(viewport.height * dpr);
       canvas.style.width = `${viewport.width}px`;
       canvas.style.height = `${viewport.height}px`;
 
@@ -457,6 +458,9 @@ export class DeesPdfViewer extends DeesElement {
         return;
       }
 
+      // Scale context for high-DPI displays
+      ctx.scale(dpr, dpr);
+
       const renderContext = {
         canvasContext: ctx,
         viewport: viewport,
@@ -652,9 +656,10 @@ export class DeesPdfViewer extends DeesElement {
         const scale = maxThumbnailWidth / initialViewport.width;
         const viewport = page.getViewport({ scale });
 
-        // Set canvas dimensions to actual render size
-        canvas.width = viewport.width;
-        canvas.height = viewport.height;
+        // Set canvas dimensions with device pixel ratio for sharp thumbnails
+        const dpr = window.devicePixelRatio || 1;
+        canvas.width = Math.floor(viewport.width * dpr);
+        canvas.height = Math.floor(viewport.height * dpr);
 
         // Set the display size via style to ensure proper display
         canvas.style.width = `${viewport.width}px`;
@@ -670,6 +675,9 @@ export class DeesPdfViewer extends DeesElement {
           continue;
         }
 
+        // Scale context for high-DPI displays
+        context.scale(dpr, dpr);
+
         const renderContext = {
           canvasContext: context,
           viewport: viewport,