fix: merge standardcolumns and lxConfig columns before create header; and add jquery event for bootstrap

Author: jdugh

example/w_bootstrap/main.js

@@ -7,20 +7,18 @@ const table = new LyxeaDatatable('#myTable', {
   data: dataTableData,
   scrollCollapse: true,
   scrollY: 200,
+  columns: [
+    {
+      data: 'first_name',
+      name: 'first_name',
+      title: 'Prénom',
+      className: 'salut',
+      maSuperConfig: 'Ohé toto',
+    },
+  ],
   lxConfig: {
     filters: true,
     headers: [
-      {
-        columns: [
-          {
-            data: 'first_name',
-            name: 'first_name',
-            title: 'Prénom',
-            className: 'salut',
-            maSuperConfig: 'Ohé toto',
-          },
-        ],
-      },
       {
         headerGroup: 'Mon super groupe',
         columns: [

lib/core/LyxeaDatatable.ts

@@ -170,6 +170,13 @@ class LyxeaDatatable<T>
     }
 
     if (lxConfig) {
+      /*
+        If columns in the standard object and in lxconfig, header generation is only based on lxconfig.
+        This allows you to generate the header with all the columns (and not just the columns defined in lxconfig).
+      */
+      if (lxConfig.headers && standardColumns) {
+        lxConfig.headers?.unshift({ 'columns': [...standardColumns] });
+      }
       new LxRenderer(lxConfig);
       const headersBuilder = this.#customColumnBuilder
         .setColsDef(lxConfig)
@@ -243,8 +250,6 @@ class LyxeaDatatable<T>
 
     this.#dtButtons.parse(this.config.buttons);
 
-    //@ts-ignore
-    window.lxConfig = this.config;
     /**
      * Initializing datatable
      * Init event, get the datable instance on event.detail
@@ -273,6 +278,13 @@ class LyxeaDatatable<T>
   __filterDataWithKey() {}
 
   handleBootrapTabChange<T>(instance: DataTable<T>) {
+    // For JQUERY user
+    if (typeof $ == 'function') {
+      $('a[data-toggle="tab"]').on('shown.bs.tab', function () {
+        // @ts-ignore
+        instance.draw();
+      })
+    }
     document.querySelectorAll('button[data-bs-toggle="tab"]').forEach((el) => {
       el.addEventListener('shown.bs.tab', () => {
         // @ts-ignore