feat: base html sheet

src/elements/labelled-text.ts

@@ -1,6 +1,12 @@
 import jsPDF, { TextOptionsLight } from 'jspdf';
 import { Text } from './text';
-import { i18nLocalize, LABEL_SIZE, TEXT_SIZE } from '../constants';
+import {
+  HTML_LABEL_SIZE,
+  HTML_TEXT_SIZE,
+  i18nLocalize,
+  LABEL_SIZE,
+  TEXT_SIZE,
+} from '../constants';
 import { AbstractElement } from './abstract-element';
 
 export class LabelledText extends Text {
@@ -40,6 +46,36 @@ export class LabelledText extends Text {
     return doc;
   }
 
+  public renderHtml(
+    doc: Document,
+    parent: HTMLElement,
+    cssRules: string[],
+    sheet: HTMLStyleElement
+  ): Document {
+    const div = doc.createElement('div');
+    div.classList.add(`column`);
+    const label = doc.createElement('p');
+    const text = doc.createElement('p');
+    const labelCss = `label-${LABEL_SIZE}`;
+    const textCss = `text-${TEXT_SIZE}`;
+    label.classList.add(labelCss);
+    text.classList.add(textCss);
+    if (!cssRules.includes(labelCss)) {
+      cssRules.push(labelCss);
+      sheet.innerHTML += ` .${labelCss} { font-size: ${HTML_LABEL_SIZE}rem }`;
+    }
+    if (!cssRules.includes(textCss)) {
+      cssRules.push(textCss);
+      sheet.innerHTML += ` .${textCss} { font-size: ${HTML_TEXT_SIZE}rem }`;
+    }
+    label.innerHTML = i18nLocalize(this.label);
+    text.innerHTML = i18nLocalize(this.text);
+    div.append(label);
+    div.append(text);
+    parent.append(div);
+    return doc;
+  }
+
   protected updateMaxWidth(maxWidth?: number) {
     if (maxWidth != null && maxWidth > 0) {
       this.maxWidth = maxWidth;