allow individual table columns to be rendered as HTML #217

nicegui/elements/table.js

@@ -10,6 +10,11 @@ export default {
         ...this.options,
         onGridReady: (params) => params.api.sizeColumnsToFit(),
       };
+      for (const column of this.html_columns) {
+        if (this.gridOptions.columnDefs[column].cellRenderer === undefined) {
+          this.gridOptions.columnDefs[column].cellRenderer = (params) => (params.value ? params.value : "");
+        }
+      }
       this.grid = new agGrid.Grid(this.$el, this.gridOptions);
       this.gridOptions.api.addGlobalListener(this.handle_event);
     },
@@ -53,5 +58,6 @@ export default {
   },
   props: {
     options: Object,
+    html_columns: Array,
   },
 };

nicegui/elements/table.py

@@ -1,4 +1,4 @@
-from typing import Dict
+from typing import Dict, List
 
 from ..dependencies import register_component
 from ..element import Element
@@ -8,16 +8,18 @@ register_component('table', __file__, 'table.js', ['lib/ag-grid-community.min.js
 
 class Table(Element):
 
-    def __init__(self, options: Dict, *, theme: str = 'balham') -> None:
+    def __init__(self, options: Dict, *, html_columns: List[int] = [], theme: str = 'balham') -> None:
         """Table
 
         An element to create a table using `AG Grid <https://www.ag-grid.com/>`_.
 
         :param options: dictionary of AG Grid options
+        :param html_columns: list of columns that should be rendered as HTML (default: `[]`)
         :param theme: AG Grid theme (default: 'balham')
         """
         super().__init__('table')
         self._props['options'] = options
+        self._props['html_columns'] = html_columns
         self._classes = [f'ag-theme-{theme}', 'w-full', 'h-64']
 
     @property