@design.estate/dees-document 5.2.0 → 5.4.0

package/ts/00_commitinfo_data.ts

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

package/ts/classes.pdfservice.ts

@@ -44,7 +44,8 @@ export class PdfService {
    * creates an letter
    *
    * An accounting document whose advance payments do not add up to its paid
-   * amount is refused before anything is rendered: this rejects.
+   * amount, and a letter whose accent colour (`appearance.accentColor`) is no
+   * hex colour, are refused before anything is rendered: this rejects.
    */
   public async createPdfFromLetterObject(optionsArg: {
     letterData: plugins.tsclass.business.TLetter;
@@ -52,6 +53,8 @@ export class PdfService {
   }): Promise<plugins.smartpdf.IPdf> {
     plugins.shared.assertPaidAmountMatchesAdvancePayments(optionsArg.letterData);
     plugins.shared.assertWithoutVatStatesNoTax(optionsArg.letterData, optionsArg.documentSettings);
+    // a letter's accent colour that is no hex colour is refused before anything is rendered
+    plugins.shared.resolvedAccentOf(optionsArg.documentSettings.theme, optionsArg.letterData);
     const html = `
       <script type="module">
         ${await helpers.getBundleAsString()}

package/ts_web/00_commitinfo_data.ts

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

package/ts_web/elements/contentinvoice.ts

@@ -907,7 +907,11 @@ export class DeContentInvoice extends DeesElement {
   /**
    * The QR pay box. It is printed only when the payment has a valid EPC QR
    * code: a euro amount to the sender's IBAN, which a document in another
-   * currency or without the sender's IBAN does not have.
+   * currency or without the sender's IBAN does not have. The code carries the
+   * reference the document states (`paymentOptions.paymentReference`): an ISO
+   * 11649 creditor reference in line 10, any other as free text, and where it
+   * states none, the letter's number (`epcRemittanceOf`). A stated reference
+   * is printed beside the code, so a payer who types the transfer quotes it.
    */
   private renderPaymentInfo(optionsArg: {
     /** the sender, who is paid */
@@ -915,15 +919,17 @@ export class DeContentInvoice extends DeesElement {
     currency: string;
     /** the amount to pay */
     amount: number;
-    /** the number of the letter, the remittance information */
-    reference: string;
+    /** the number of the letter, the remittance information where the document states no reference */
+    number: string;
+    /** the reference the document states for its payment (EN 16931 BT-83) */
+    statedReference?: string;
   }): TemplateResult | null {
     const bic = optionsArg.from.sepaConnection?.bic;
     const name = optionsArg.from.name;
     const iban = optionsArg.from.sepaConnection?.iban;
     const currency = optionsArg.currency;
     const totalGross = optionsArg.amount;
-    const reference = optionsArg.reference;
+    const remittance = plugins.shared.epcRemittanceOf(optionsArg.statedReference, optionsArg.number);
     if (
       typeof iban !== "string" ||
       plugins.shared.buildEpcQrPayload({
@@ -932,7 +938,8 @@ export class DeContentInvoice extends DeesElement {
         iban,
         currency,
         amount: totalGross,
-        remittanceInformation: reference,
+        remittanceInformation: remittance.remittanceInformation,
+        ...(remittance.creditorReference ? { creditorReference: remittance.creditorReference } : {}),
       }) === null
     ) {
       return null;
@@ -943,6 +950,9 @@ export class DeContentInvoice extends DeesElement {
         <div>
           <div class="label">${this.translateKey("invoice@@payment.qr")}</div>
           <span> ${this.translateKey("invoice@@payment.qr.description")} </span>
+          ${remittance.printedReference
+            ? html`<div>${this.translateKey("invoice@@payment.reference")}: ${remittance.printedReference}</div>`
+            : ""}
         </div>
         <dedocument-paymentcode
           bic="${bic}"
@@ -950,7 +960,8 @@ export class DeContentInvoice extends DeesElement {
           iban="${iban}"
           currency="${currency}"
           totalGross="${totalGross}"
-          reference="${reference}"
+          reference="${remittance.remittanceInformation}"
+          creditorReference="${remittance.creditorReference ?? ""}"
         />
       </div>
     </div>`;
@@ -1060,7 +1071,8 @@ export class DeContentInvoice extends DeesElement {
         from: accountingDocArg.from,
         currency: accountingDocArg.currency,
         amount: summaryArg ? summaryArg.amountDue : this.getTotalGross(),
-        reference: accountingDocArg.id,
+        number: accountingDocArg.id,
+        statedReference: accountingDocArg.paymentOptions?.paymentReference,
       })}
     `;
   }
@@ -1405,7 +1417,8 @@ export class DeContentInvoice extends DeesElement {
         from: reminderArg.from,
         currency: reminderArg.currency,
         amount: totals.payable,
-        reference: reminderArg.id,
+        number: reminderArg.id,
+        statedReference: reminderArg.paymentOptions?.paymentReference,
       })}
     `;
   }

package/ts_web/elements/document.ts

@@ -151,10 +151,14 @@ export class DeDocument extends DeesElement {
   public paginationInfo: IPagePaginationInfo[] = [];
 
   public async renderDocument() {
-    // a document whose advance payments do not add up to its paid amount is
-    // refused: no page of it, and none of the letter before it, stays on screen
+    // a document whose advance payments do not add up to its paid amount, or
+    // whose accent colour is no hex colour, is refused: no page of it, and none
+    // of the letter before it, stays on screen. The accent is checked here,
+    // before any page is built: a page that threw in its render would never be
+    // ready, and the render would never settle
     try {
       plugins.shared.assertPaidAmountMatchesAdvancePayments(this.letterData);
+      plugins.shared.resolvedAccentOf(this.documentSettings?.theme, this.letterData);
     } catch (error) {
       this.latestDocumentSettings = this.documentSettings;
       this.latestRenderedLetterData = this.letterData;

package/ts_web/elements/page.ts

@@ -136,13 +136,15 @@ export class DePage extends DeesElement {
 
   public render(): TemplateResult {
     const theme = this.documentSettings.theme;
+    // the theme's accent, else the letter's own (`appearance.accentColor`), with text that reads on it
+    const accent = plugins.shared.resolvedAccentOf(theme, this.letterData);
     return html`
       <style>
         :host {
           ${theme?.colorPrimaryForeground ? `--theme-color-primary-fg: ${theme.colorPrimaryForeground};` : ''}
           ${theme?.colorPrimaryBackground ? `--theme-color-primary-bg: ${theme.colorPrimaryBackground};` : ''}
-          ${theme?.colorAccentForeground ? `--theme-color-accent-fg: ${theme.colorAccentForeground};` : ''}
-          ${theme?.colorAccentBackground ? `--theme-color-accent-bg: ${theme.colorAccentBackground};` : ''}
+          ${accent.foreground ? `--theme-color-accent-fg: ${accent.foreground};` : ''}
+          ${accent.background ? `--theme-color-accent-bg: ${accent.background};` : ''}
         }
 
         .page {

package/ts_web/elements/pagefooter.ts

@@ -83,7 +83,6 @@ export class DePageFooter extends DeesElement {
         background: var(--footer-separator-bg-color, #e4002b);
         padding: 3px;
         font-size: 9px;
-        color: #fff;
         border-bottom-left-radius: 3px;
         border-bottom-right-radius: 3px;
       }

package/ts_web/elements/paymentcode.ts

@@ -53,6 +53,10 @@ export class DedocumentPaymentCode extends DeesElement {
   @property()
   accessor reference!: string;
 
+  /** an ISO 11649 creditor reference for line 10; the reference (line 11) is empty beside it */
+  @property()
+  accessor creditorReference: string | undefined;
+
   /** The EPC QR code content, or null when the payment has no valid code (see buildEpcQrPayload). */
   private get payload(): string | null {
     if (
@@ -71,6 +75,9 @@ export class DedocumentPaymentCode extends DeesElement {
       currency: this.currency,
       amount: this.totalGross,
       remittanceInformation: this.reference,
+      ...(typeof this.creditorReference === "string" && this.creditorReference.length > 0
+        ? { creditorReference: this.creditorReference }
+        : {}),
     });
   }
 

package/ts_web/style.ts

@@ -22,7 +22,7 @@ export const dedocumentSharedStyle = css`
     --label-fg: var(--color-dark);
     --label-bg: var(--color-grey);
     --footer-separator-bg-color: var(--color-accent-bg);
-    --footer-separator-fg-color: var(--color-light);
+    --footer-separator-fg-color: var(--color-accent-fg);
 
     /* Functional variables */
     --DPI-FACTOR: ${plugins.shared.cmToPx(1)}px;