v2.5.15

- added basic support for `columns`
Aymkdn · Nov 14, 2024 · d020e4f · d020e4f
1 parent d0724b5
commit d020e4f
Show file tree

Hide file tree

Showing 8 changed files with 49 additions and 6 deletions.
diff --git a/README.md b/README.md
@@ -425,6 +425,21 @@ For Base64 encoded image, please refer to the [PDFMake documentation](https://pd
 <h2 id="section1">Section 1</h2>
 ```
 
+### Columns
+
+PDFMake has a concept of [`columns`](https://pdfmake.github.io/docs/0.1/document-definition-object/columns/). We use `<div data-pdfmake-type="column"></div>` to identify it.
+
+Example to center a table in the page:
+```html
+<div data-pdfmake-type="columns">
+  <div data-pdfmake='{"width":"*"}'></div>
+  <div style="width:auto">
+    <table><tr><th>Table</th><tr><tr><td>Centered</td></tr></table>
+  </div>
+  <div data-pdfmake='{"width":"*"}'></div>
+</div>
+```
+
 ## Examples
 
 You can find more examples in [example.js](example.js) which will create [example.pdf](example.pdf):

diff --git a/browser.js b/browser.js
diff --git a/docs/browser-2.5.14.js → docs/browser-2.5.15.js b/docs/browser-2.5.14.js → docs/browser-2.5.15.js
diff --git a/docs/index.html b/docs/index.html
@@ -116,7 +116,7 @@ <h1>HTML to PDFMake convertor</h1>
       <div id="pdf_ie" style="display:none;padding:3em">The PDF file is sent to you for download. Use a modern browser (like Chrome or Firefox) to display the PDF in this page.</div>
     </div>
   </div>
-  <script src="browser-2.5.14.js"></script>
+  <script src="browser-2.5.15.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/pdfmake@latest/build/pdfmake.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/pdfmake@latest/build/vfs_fonts.js"></script>
   <script>

diff --git a/example.pdf b/example.pdf
diff --git a/index.js b/index.js
@@ -574,7 +574,15 @@ function htmlToPdfMake(htmlText, options) {
           }
           default: {
             // handle other cases
-            if (options && typeof options.customTag === "function") {
+            if (nodeName === "DIV" && element.dataset && element.dataset.pdfmakeType === "columns") {
+              // if it's a <DIV> with data-pdfmake-type="columns"
+              // then we interpret it as the COLUMNS in PDFMake
+              if (ret.stack) {
+                ret.columns = ret.stack;
+                delete ret.stack;
+              }
+            } else if (options && typeof options.customTag === "function") {
+              // handle custom tags
               ret = options.customTag.call(this, {element:element, parents:parents, ret:ret});
             }
           }

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-to-pdfmake",
-  "version": "2.5.14",
+  "version": "2.5.15",
   "description": "Convert HTML code to PDFMake",
   "main": "index.js",
   "scripts": {

diff --git a/test/unit.js b/test/unit.js
@@ -1132,7 +1132,27 @@ test("unit tests", function(t) {
     "<table> (dynamic widths) 2");
 
     t.finish();
-  })
+  });
+
+  t.test("columns",function(t) {
+    var html = `<div data-pdfmake-type="columns"><div data-pdfmake='{"width": "*"}'></div><div style="width:auto">stuff centered</div><div data-pdfmake='{"width": "*"}'></div></div>`;
+    var ret = htmlToPdfMake(html, {
+      window:window
+    });
+    if (debug) console.log(JSON.stringify(ret));
+    t.check(Array.isArray(ret) && ret.length===1, "return is OK");
+    ret = ret[0];
+    t.check(
+      Array.isArray(ret.columns) &&
+      ret.columns.length === 3 &&
+      ret.columns[0].width === "*" &&
+      ret.columns[1].width === "auto" &&
+      ret.columns[1].text === "stuff centered" &&
+      ret.columns[2].width === "*",
+    "columns");
+
+    t.finish();
+  });
 
   t.finish();
 })