fix(document rendering): Fixed overflow issues in document and page elements

changelog.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 2024-12-07 - 1.6.7 - fix(document rendering)
+Fixed overflow issues in document and page elements
+
+- Ensured content overflow handling in document.ts
+- Adjusted page element overflow settings in page.ts
+
 ## 2024-12-07 - 1.6.6 - fix(page-render)
 Fix layout scaling adjustment for page component
 

ts/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@design.estate/dees-document',
-  version: '1.6.6',
+  version: '1.6.7',
   description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
 }

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@design.estate/dees-document',
-  version: '1.6.6',
+  version: '1.6.7',
   description: 'A sophisticated framework for dynamically generating and rendering business documents like invoices with modern web technologies, featuring PDF creation, templating, and automation.'
 }

ts_web/elements/document.ts

@@ -115,11 +115,35 @@ export class DeDocument extends DeesElement {
   }
 
   public async firstUpdated(_changedProperties: Map<string | number | symbol, unknown>) {
-    domtools.plugins.smartdelay.delayFor(0).then(() => {
+    domtools.plugins.smartdelay.delayFor(0).then(async () => {
       this.documentSettings = {
         ...defaultDocumentSettings,
         ...this.documentSettings,
       }
+
+      while (false) {
+        await domtools.plugins.smartdelay.delayFor(1000);
+        this.letterData = {
+          ...this.letterData,
+          content: {
+            ...this.letterData.content,
+            invoiceData: {
+              ...this.letterData.content.invoiceData,
+              items: [
+                ...this.letterData.content.invoiceData.items,
+                {
+                  name: 'Test Item',
+                  unitQuantity: 1,
+                  unitNetPrice: 100,
+                  unitType: 'hours',
+                  vatPercentage: 19,
+                  position: 1,
+                },
+              ],
+            },
+          }
+        }
+      }
     });
     const resizeObserver = new ResizeObserver((entries) => {
       for (const entry of entries) {

ts_web/elements/page.ts

@@ -77,6 +77,7 @@ export class DePage extends DeesElement {
     css`
       :host {
         display: block;
+        overflow: hidden;
       }
 
       #scaleWrapper {
@@ -211,7 +212,6 @@ export class DePage extends DeesElement {
 
     // Adjust the outer dimensions so they match the scaled content
 
-    this.style.overflow = 'hidden';
     this.style.width = `${plugins.shared.a4Width * scale}px`;
     this.style.height = `${plugins.shared.a4Height * scale}px`;
   }