@kodaris/krubble-components 1.0.47 → 1.0.49

package/dist/krubble-components.bundled.js

@@ -2558,17 +2558,21 @@ let KRTable = class KRTable extends i$2 {
         this._data.forEach((row, rowIndex) => {
             columns.forEach(col => {
                 const result = col.render(row);
-                const content = typeof result === 'string' ? result : '';
-                if (content) {
-                    const el = document.createElement('span');
-                    el.slot = `cell-${rowIndex}-${col.id}`;
-                    if (col.type === 'actions') {
-                        el.style.display = 'flex';
-                        el.style.gap = '8px';
-                    }
-                    el.innerHTML = content;
-                    this.appendChild(el);
+                if (!result)
+                    return;
+                const el = document.createElement('span');
+                el.slot = `cell-${rowIndex}-${col.id}`;
+                if (col.type === 'actions') {
+                    el.style.display = 'flex';
+                    el.style.gap = '8px';
+                }
+                if (typeof result === 'string') {
+                    el.innerHTML = result;
                 }
+                else {
+                    D(result, el);
+                }
+                this.appendChild(el);
             });
         });
     }
@@ -3113,23 +3117,34 @@ let KRTable = class KRTable extends i$2 {
                     ></div>` : A}</div>
               `)}
             </div>
-            ${this._data.map((row, rowIndex) => b `
-              <div
-                class=${e$1({ 'row': true, 'row--clickable': !!this._def.rowClickable })}
-                @mousedown=${() => this._handleRowMouseDown()}
-                @click=${() => this._handleRowClick(row, rowIndex)}
-              >
-                ${this.getDisplayedColumns().map((col, i) => b `
-                  <div
-                    class=${e$1(this._getCellClasses(col, i))}
-                    style=${o$1(this._getCellStyle(col, i))}
-                    data-column-id=${col.id}
-                  >
-                    ${this._renderCellContent(col, row, rowIndex)}
-                  </div>
-                `)}
-              </div>
-            `)}
+            ${this._data.map((row, rowIndex) => {
+            const cells = this.getDisplayedColumns().map((col, i) => b `
+                <div
+                  class=${e$1(this._getCellClasses(col, i))}
+                  style=${o$1(this._getCellStyle(col, i))}
+                  data-column-id=${col.id}
+                >
+                  ${this._renderCellContent(col, row, rowIndex)}
+                </div>
+              `);
+            if (this._def.rowHref) {
+                return b `
+                  <a
+                    href=${this._def.rowHref(row)}
+                    class=${e$1({ 'row': true, 'row--clickable': true, 'row--link': true })}
+                    @mousedown=${() => this._handleRowMouseDown()}
+                    @click=${() => this._handleRowClick(row, rowIndex)}
+                  >${cells}</a>
+                `;
+            }
+            return b `
+                <div
+                  class=${e$1({ 'row': true, 'row--clickable': !!this._def.rowClickable })}
+                  @mousedown=${() => this._handleRowMouseDown()}
+                  @click=${() => this._handleRowClick(row, rowIndex)}
+                >${cells}</div>
+              `;
+        })}
           </div>
         </div>
       </div>
@@ -3478,6 +3493,11 @@ KRTable.styles = [krBaseCSS, i$5 `
       cursor: pointer;
     }
 
+    .row--link {
+      color: inherit;
+      text-decoration: none;
+    }
+
     .header-row {
       display: contents;
     }