@design.estate/dees-document 1.6.7 → 1.6.9

package/dist_watch/bundle.js

@@ -38737,7 +38737,6 @@ var DeContentInvoice = class extends DeesElement {
       (await this.getContentNodes()).trimmedContent.append(
         (await this.getContentNodes()).currentContent.children.item(0)
       );
-      console.log("hey" + this.shadowRoot.children.length);
     }
     if ((await this.getContentNodes()).currentContent.children.item(0).classList.contains("needsDataHeader")) {
       const trimmedContent = (await this.getContentNodes()).trimmedContent;
@@ -38776,14 +38775,26 @@ var DeContentInvoice = class extends DeesElement {
             border-right: 1px dashed #ccc;
           }
 
+          .lineItem:last-child {
+            border-right: none;
+          }
+
           .lineItem.rightAlign {
             text-align: right;
           }
 
           .invoiceLine {
+            background: #ffffff00;
             border-bottom: 1px dotted #ccc;
           }
 
+          .invoiceLine.highlighted {
+            transition: background 0.2s;
+            background: #ffc18f;
+            border: 1px solid #ff9d4d;
+            box-sizing: content-box;
+          }
+
           .sums {
             margin-top: 5px;
             font-size: 12px;
@@ -38843,33 +38854,77 @@ var DeContentInvoice = class extends DeesElement {
         </style>
         <div>We hereby invoice products and services provided to you by Lossless GmbH:</div>
         <div class="grid topLine dataHeader">
-          <div class="lineItem rightAlign">${dist_ts_shared_exports.translation.translate(this.documentSettings.languageCode, "itemPos", "Item Pos.")}</div>
-          <div class="lineItem">${dist_ts_shared_exports.translation.translate(this.documentSettings.languageCode, "description", "Description")}</div>
-          <div class="lineItem rightAlign">${dist_ts_shared_exports.translation.translate(this.documentSettings.languageCode, "quantity", "Quantity")}</div>
-          <div class="lineItem">${dist_ts_shared_exports.translation.translate(this.documentSettings.languageCode, "unitType", "Unit Type")}</div>
-          <div class="lineItem rightAlign">${dist_ts_shared_exports.translation.translate(this.documentSettings.languageCode, "unitNetPrice", "Unit Net Price")}</div>
-          <div class="lineItem rightAlign">${dist_ts_shared_exports.translation.translate(this.documentSettings.languageCode, "totalNetPrice", "Total Net Price")}</div>
-          <div class="lineItem rightAlign">${dist_ts_shared_exports.translation.translate(this.documentSettings.languageCode, "vatShort", "VAT")}</div>
+          <div class="lineItem rightAlign">
+            ${dist_ts_shared_exports.translation.translate(
+        this.documentSettings.languageCode,
+        "itemPos",
+        "Item Pos."
+      )}
+          </div>
+          <div class="lineItem">
+            ${dist_ts_shared_exports.translation.translate(
+        this.documentSettings.languageCode,
+        "description",
+        "Description"
+      )}
+          </div>
+          <div class="lineItem rightAlign">
+            ${dist_ts_shared_exports.translation.translate(
+        this.documentSettings.languageCode,
+        "quantity",
+        "Quantity"
+      )}
+          </div>
+          <div class="lineItem">
+            ${dist_ts_shared_exports.translation.translate(
+        this.documentSettings.languageCode,
+        "unitType",
+        "Unit Type"
+      )}
+          </div>
+          <div class="lineItem rightAlign">
+            ${dist_ts_shared_exports.translation.translate(
+        this.documentSettings.languageCode,
+        "unitNetPrice",
+        "Unit Net Price"
+      )}
+          </div>
+          <div class="lineItem rightAlign">
+            ${dist_ts_shared_exports.translation.translate(
+        this.documentSettings.languageCode,
+        "totalNetPrice",
+        "Total Net Price"
+      )}
+          </div>
+          <div class="lineItem rightAlign">
+            ${dist_ts_shared_exports.translation.translate(
+        this.documentSettings.languageCode,
+        "vatShort",
+        "VAT"
+      )}
+          </div>
         </div>
         ${(() => {
         let counter = 1;
-        return this.letterData?.content.invoiceData?.items?.map(
-          (invoiceItem) => x`
-              <div class="grid invoiceLine needsDataHeader">
+        return this.letterData?.content.invoiceData?.items?.map((invoiceItem) => {
+          const isHighlighted = false;
+          return x`
+              <div class="grid invoiceLine needsDataHeader ${isHighlighted ? "highlighted" : ""}">
                 <div class="lineItem rightAlign">${counter++}</div>
                 <div class="lineItem">${invoiceItem.name}</div>
                 <div class="lineItem rightAlign">${invoiceItem.unitQuantity}</div>
                 <div class="lineItem">${invoiceItem.unitType}</div>
-                <div class="lineItem rightAlign">${invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}</div>
                 <div class="lineItem rightAlign">
-                  ${invoiceItem.unitQuantity * invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}
+                  ${invoiceItem.unitNetPrice} ${this.letterData?.content.invoiceData.currency}
                 </div>
                 <div class="lineItem rightAlign">
-                  ${invoiceItem.vatPercentage}%
+                  ${invoiceItem.unitQuantity * invoiceItem.unitNetPrice}
+                  ${this.letterData?.content.invoiceData.currency}
                 </div>
+                <div class="lineItem rightAlign">${invoiceItem.vatPercentage}%</div>
               </div>
-            `
-        );
+            `;
+        });
       })()}
         <div class="sums">
           <div class="sumline">
@@ -38889,8 +38944,10 @@ var DeContentInvoice = class extends DeesElement {
                 <div class="label">
                   Vat ${vatGroupArg.vatPercentage}%
                   ${this.documentSettings.vatGroupPositions ? x`
-                    <br /><span style="font-weight: normal">(on item positions: ${itemNumbers})</span>
-                  ` : x``}
+                        <br /><span style="font-weight: normal"
+                          >(on item positions: ${itemNumbers})</span
+                        >
+                      ` : x``}
                 </div>
                 <div class="value">${vatGroupArg.vatAmountSum} EUR</div>
               </div>
@@ -38904,7 +38961,11 @@ var DeContentInvoice = class extends DeesElement {
         <div class="divider"></div>
         ${this.letterData?.content.invoiceData.reverseCharge ? x`
               <div class="taxNote">
-                ${dist_ts_shared_exports.translation.translate(this.documentSettings.languageCode, "reverseVatNote", "VAT arises on a reverse charge basis and is payable by the customer.")}
+                ${dist_ts_shared_exports.translation.translate(
+        this.documentSettings.languageCode,
+        "reverseVatNote",
+        "VAT arises on a reverse charge basis and is payable by the customer."
+      )}
               </div>
             ` : ``}
         <div class="infoBox">
@@ -38922,7 +38983,9 @@ var DeContentInvoice = class extends DeesElement {
               <div class="infoBox">
                 <div class="label">Referenced contract:</div>
                 This invoice is adhering to agreements made by contract between the parties on
-                ${dist_ts_exports6.ExtendedDate.fromMillis(this.letterData?.content.contractData.contractDate).format("MMMM D, YYYY")}.
+                ${dist_ts_exports6.ExtendedDate.fromMillis(
+        this.letterData?.content.contractData.contractDate
+      ).format("MMMM D, YYYY")}.
               </div>
             ` : x``}
         <div class="infoBox paymentCode">
@@ -38948,7 +39011,6 @@ ${this.letterData.content.invoiceData.id}
 EPC QR Code`,
       (error) => {
         if (error) console.error(error);
-        console.log("success!");
       }
     );
     contentNodes.currentContent.querySelector(".paymentCode").append(canvas);
@@ -39076,7 +39138,6 @@ var DePage = class extends DeesElement {
     }
   }
   adjustScaling() {
-    console.log("page scale adjustment triggered.");
     const scaleWrapper = this.shadowRoot.querySelector("#scaleWrapper");
     if (!scaleWrapper) return;
     let scale = 1;
@@ -39085,7 +39146,6 @@ var DePage = class extends DeesElement {
     } else if (this.viewWidth) {
       scale = this.viewWidth / dist_ts_shared_exports.a4Width;
     }
-    console.log(`new scale is ${scale}`);
     scaleWrapper.style.transform = `scale(${scale})`;
     this.style.width = `${dist_ts_shared_exports.a4Width * scale}px`;
     this.style.height = `${dist_ts_shared_exports.a4Height * scale}px`;
@@ -39204,6 +39264,7 @@ var DeDocument = class extends DeesElement {
     this.documentSettings = defaultDocumentSettings;
     this.latestDocumentSettings = null;
     this.latestRenderedLetterData = null;
+    this.cleanupStore = [];
     dist_ts_exports27.DomTools.setupDomTools();
   }
   render() {
@@ -39256,15 +39317,17 @@ var DeDocument = class extends DeesElement {
   async renderDocument() {
     this.latestDocumentSettings = this.documentSettings;
     this.latestRenderedLetterData = this.letterData;
-    console.log(`rendering with settings:`);
-    console.log(this.latestDocumentSettings);
+    const cleanUpStoreCurrentRender = [];
+    const cleanUpStoreNextRender = [];
     const domtools = await this.domtoolsPromise;
     const documentBuildContainer = document.createElement("div");
+    cleanUpStoreCurrentRender.push(documentBuildContainer);
     document.body.appendChild(documentBuildContainer);
     let pages = [];
     let pageCounter = 0;
     let complete = false;
     const content3 = new DeContentInvoice();
+    cleanUpStoreCurrentRender.push(content3);
     content3.letterData = this.letterData;
     content3.documentSettings = this.documentSettings;
     document.body.appendChild(content3);
@@ -39275,6 +39338,7 @@ var DeDocument = class extends DeesElement {
     while (!complete) {
       pageCounter++;
       const currentContent = content3.cloneNode(true);
+      cleanUpStoreNextRender.push(currentContent);
       const newPage = new DePage();
       newPage.printMode = this.printMode;
       newPage.letterData = this.letterData;
@@ -39283,6 +39347,7 @@ var DeDocument = class extends DeesElement {
       newPage.pageNumber = pageCounter;
       newPage.append(currentContent);
       newPage.pageTotalNumber = pageCounter;
+      cleanUpStoreNextRender.push(newPage);
       documentBuildContainer.append(newPage);
       await currentContent.elementDomReady;
       await currentContent.trimStartToOffset(overallContentOffset);
@@ -39298,14 +39363,21 @@ var DeDocument = class extends DeesElement {
       if (trimmed === 0) {
         complete = true;
       }
-      console.log(currentContentOffset);
     }
-    document.body.removeChild(content3);
-    document.body.removeChild(documentBuildContainer);
+    for (const cleanUp of this.cleanupStore) {
+      cleanUp.remove();
+    }
+    this.cleanupStore = cleanUpStoreNextRender;
+    cleanUpStoreCurrentRender.forEach((cleanUp) => {
+      cleanUp.remove();
+    });
     const documentContainer = this.shadowRoot.querySelector(".documentContainer");
     if (documentContainer) {
       const children2 = Array.from(documentContainer.children);
-      children2.forEach((child) => documentContainer.removeChild(child));
+      children2.forEach((child) => {
+        documentContainer.removeChild(child);
+        child.remove();
+      });
     }
     for (const page of pages) {
       page.pageTotalNumber = pageCounter;
@@ -39341,7 +39413,6 @@ var DeDocument = class extends DeesElement {
       }
       if (this.viewWidth) {
         page.viewWidth = this.viewWidth;
-        console.log("setting viewWidth: ", this.viewWidth);
       }
     });
   }
@@ -39611,10 +39682,8 @@ var DePageContent = class extends DeesElement {
     await this.elementDomReady;
     const contentContainer = this.shadowRoot.querySelector(".content");
     if (contentContainer.scrollHeight > contentContainer.clientHeight) {
-      console.log("overflows");
       return true;
     } else {
-      console.log("does not overflow!");
       return false;
     }
   }