playbook_ui 14.19.0.pre.alpha.PLAY2033atactionbarrails7730 → 14.19.0.pre.alpha.PLAY2152mlssinglevariantrendersvaluebug7743

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 654590a50901aacde66d35bd4be201e411e132b400b2914cc5e037d3429caded
-  data.tar.gz: 8d0e41a47e517cf306c76815921ff9aa1f994491a7596b3f259fedd4e0d6e865
+  metadata.gz: 0c9bb1a4ff0951660ec5d3c24c2bd747d570a70397e131feb51449e4a02afb8c
+  data.tar.gz: 9ee8834f0d67becd4a00c42167cbbd386a44ef23a840762fb1ced0fdec7368a2
 SHA512:
-  metadata.gz: e2016cd384a81cd7d9f3d4f93e474f4bb5843d3f199b9e1989dfefd41eaa2cd943aee4823e70fde27d2c503f2e4c90e7a3503f176b5d7d5e07f0fa194d866454
-  data.tar.gz: 7be919bf509875aeb4beb91b4f25f6b163c2b2c5a20a7a510df6204216592e33c6d512991c2c73eec9a5c462b40bd29417c335c497269b13b582db3938445a52
+  metadata.gz: f83838fb88571a3e311c92dd51e7f9161db46b90f0573709b6f92172335d90c185c6e6fc02af5d255b6a9300486bc404be47278d270de5e392c7f7eb968c76bb
+  data.tar.gz: 3f7a87d7d42500ad069bdbcc0814ca8cbe5ca69b3d54166228f478184e547df3a4cd580919ad2614733533c2edbd6a6b74a58d7f4a41b7a1a75f4c129ae0f994

data/app/pb_kits/playbook/pb_advanced_table/advanced_table.html.erb

@@ -1,21 +1,10 @@
 <%= pb_content_tag do %>
-  <% table_id = object.id || "table-#{SecureRandom.hex(8)}" %>
-  <div id="<%= table_id %>" class="<%= object.classname %>">
-    <% if object.selectable_rows && object.show_actions_bar %>
-      <%= pb_rails("advanced_table/table_action_bar", props: { 
-        actions: object.actions,
-        is_visible: false,
-        selected_count: 0
-      }) %>
-    <% end %>
-    
-    <%= pb_rails("table", props: { size: "sm", data_table: true, number_spacing:"tabular", responsive:"none", dark: dark, classname: object.loading ? "content-loading" : ""  }.merge(object.table_props)) do %>
-      <% if content.present? %>
-        <% content.presence %>
-      <% else %>
-        <%= pb_rails("advanced_table/table_header", props: { column_definitions: object.column_definitions, enable_toggle_expansion: object.enable_toggle_expansion, responsive: object.responsive, loading: object.loading, selectable_rows: object.selectable_rows }) %>
-        <%= pb_rails("advanced_table/table_body", props: { id: object.id, table_data: object.table_data, column_definitions: object.column_definitions, responsive: object.responsive, loading: object.loading, selectable_rows: object.selectable_rows, enable_toggle_expansion: object.enable_toggle_expansion }) %>
-      <% end %>
-    <% end %>
-  </div>
+        <%= pb_rails("table", props: { size: "sm", data_table: true, number_spacing:"tabular", responsive:"none", dark: dark, classname: object.loading ? "content-loading" : ""  }.merge(object.table_props)) do %>
+          <% if content.present? %>
+            <% content.presence %>
+          <% else %>
+            <%= pb_rails("advanced_table/table_header", props: { column_definitions: object.column_definitions, enable_toggle_expansion: object.enable_toggle_expansion, responsive: object.responsive, loading: object.loading, selectable_rows: object.selectable_rows }) %>
+            <%= pb_rails("advanced_table/table_body", props: { id: object.id, table_data: object.table_data, column_definitions: object.column_definitions, responsive: object.responsive, loading: object.loading, selectable_rows: object.selectable_rows, enable_toggle_expansion: object.enable_toggle_expansion }) %>
+          <% end %>
+        <% end %>
 <% end %>

data/app/pb_kits/playbook/pb_advanced_table/advanced_table.rb

@@ -25,10 +25,6 @@ module Playbook
                         default: "auto"
       prop :selectable_rows, type: Playbook::Props::Boolean,
                              default: false
-      prop :show_actions_bar, type: Playbook::Props::Boolean,
-                              default: false
-      prop :actions, type: Playbook::Props::Array,
-                     default: []
 
       def classname
         additional_classes = [responsive_classname, max_height_classname]
@@ -51,11 +47,6 @@ module Playbook
       def selected_rows_length
         selected_rows.length
       end
-
-      def is_action_bar_visible
-        # Action bar visibility is controlled by JS based on selection
-        false
-      end
     end
   end
 end

data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml

@@ -15,7 +15,6 @@ examples:
   - advanced_table_column_border_color_rails: Column Group Border Color
   - advanced_table_selectable_rows_rails: Selectable Rows
   - advanced_table_selectable_rows_no_subrows_rails: Selectable Rows (No Subrows)
-  - advanced_table_selectable_rows_actions_rails: Selectable Rows (With Actions)
 
   react:
   - advanced_table_default: Default (Required Props)

data/app/pb_kits/playbook/pb_advanced_table/index.js

@@ -9,131 +9,19 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     return ADVANCED_TABLE_SELECTOR;
   }
 
-  // Track selections per table
-  static tableData = new Map();
-
-  // Get or initialize data for a specific table
-  static getTableData(tableId) {
-    if (!PbAdvancedTable.tableData.has(tableId)) {
-      PbAdvancedTable.tableData.set(tableId, {
-        selectedRows: new Set(),
-        expandedRows: new Set(),
-        initialized: false
-      });
-    }
-    return PbAdvancedTable.tableData.get(tableId);
-  }
-
-  // Get the table container from any element within the table
-  getTableContainer() {
-    return this.element.closest(".pb_advanced_table");
-  }
-
-  // Get table ID, create one if needed
-  getTableId() {
-    const tableContainer = this.getTableContainer();
-    if (!tableContainer) return null;
-
-    // Generate ID if none exists
-    if (!tableContainer.id) {
-      tableContainer.id = `table-${Date.now()}-${Math.floor(Math.random() * 10000)}`;
-    }
-
-    return tableContainer.id;
-  }
-
-  // Update the data attribute with selected rows
   updateTableSelectedRowsAttribute() {
-    const tableContainer = this.getTableContainer();
-    const tableId = this.getTableId();
-    if (!tableId) return;
-
-    const tableData = PbAdvancedTable.getTableData(tableId);
-    const selectedRowsArray = Array.from(tableData.selectedRows);
-
-    // Update data attribute
-    tableContainer.dataset.selectedRows = JSON.stringify(selectedRowsArray);
-
-    // Update action bar visibility
-    this.updateActionBarVisibility(tableContainer, tableData.selectedRows);
-  }
-
-  // Update action bar visibility based on selection state
-  updateActionBarVisibility(tableContainer, selectedRows) {
-    if (!tableContainer) return;
-
-    const actionBar = tableContainer.querySelector(".row-selection-actions-card");
-    if (!actionBar) return;
-
-    const selectedCount = selectedRows.size;
-
-    // Update count display
-    const countElement = actionBar.querySelector(".selected-count");
-    if (countElement) {
-      countElement.textContent = `${selectedCount} Selected`;
-    }
-
-    // Show/hide based on selection
-    if (selectedCount > 0) {
-      this.showActionBar(actionBar);
-    } else {
-      this.hideActionBar(actionBar);
-    }
-  }
-
-  // Show action bar with animation
-  showActionBar(actionBar) {
-    if (!actionBar) return;
-
-    // Force display block
-    actionBar.style.display = "block";
-
-    // Get the height before animation
-    const height = actionBar.scrollHeight + "px";
-
-    // Force all style changes directly
-    actionBar.style.height = height;
-    actionBar.classList.add("is-visible");
-    actionBar.classList.add("show-action-card");
-    actionBar.style.overflow = "hidden";
-
-    // Complete animation after delay
-    window.setTimeout(() => {
-      if (actionBar.classList.contains("is-visible")) {
-        actionBar.style.height = "";
-        actionBar.style.overflow = "visible";
-      }
-    }, 300);
-  }
-
-  // Hide action bar with animation
-  hideActionBar(actionBar) {
-    if (!actionBar) return;
-
-    // Set exact height before animation
-    actionBar.style.height = actionBar.scrollHeight + "px";
-    actionBar.offsetHeight; // Trigger reflow
-
-    // Animate to height 0
-    window.setTimeout(() => {
-      actionBar.style.height = "0";
-      actionBar.style.overflow = "hidden";
-    }, 10);
-
-    // Remove visibility classes after animation
-    window.setTimeout(() => {
-      actionBar.classList.remove("is-visible");
-      actionBar.classList.remove("show-action-card");
-    }, 300);
+    const mainTable = this.element.closest(".pb_advanced_table");
+    mainTable.dataset.selectedRows = JSON.stringify(Array.from(PbAdvancedTable.selectedRows));
   }
 
-  // Check if row is expanded
+  // Check if the row is expanded or collapsed
+  // This is used to determine the background color of the row
+  // when the checkbox is checked or unchecked
   isRowExpanded(rowEl) {
     const closeIcon = rowEl.querySelector(UP_ARROW_SELECTOR);
     return closeIcon?.style.display === "none" || !closeIcon;
   }
 
-  // Update parent checkboxes based on child selections
   updateParentCheckboxes(checkbox) {
     const rowEl = checkbox.closest("tr");
     if (!rowEl) return;
@@ -141,11 +29,6 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     const table = rowEl.closest("table");
     if (!table) return;
 
-    const tableId = this.getTableId();
-    if (!tableId) return;
-
-    const tableData = PbAdvancedTable.getTableData(tableId);
-
     const contentTrail = rowEl.dataset.advancedTableContent;
     if (!contentTrail) return;
 
@@ -188,15 +71,15 @@ export default class PbAdvancedTable extends PbEnhancedElement {
 
       const parentCheckboxId = parentCheckbox.id;
       if (allChildrenChecked) {
-        tableData.selectedRows.add(parentCheckboxId);
+        PbAdvancedTable.selectedRows.add(parentCheckboxId);
         parentRow.classList.add("bg-row-selection");
         parentRow.classList.remove("bg-white", "bg-silver");
       } else {
-        tableData.selectedRows.delete(parentCheckboxId);
+        PbAdvancedTable.selectedRows.delete(parentCheckboxId);
       }
       if (!allChildrenChecked) {
         parentRow.classList.remove("bg-row-selection");
-
+  
         if (this.isRowExpanded(parentRow)) {
           parentRow.classList.remove("bg-silver");
           parentRow.classList.add("bg-white");
@@ -208,24 +91,18 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     });
   }
 
-  // Handle row checkbox click
   handleCheckboxClick(event) {
     const checkbox = event.currentTarget;
     const rowId = checkbox.id;
     const isChecked = checkbox.checked;
     const rowEl = checkbox.closest("tr");
 
-    const tableId = this.getTableId();
-    if (!tableId) return;
-
-    const tableData = PbAdvancedTable.getTableData(tableId);
-
     if (isChecked) {
-      tableData.selectedRows.add(rowId);
+      PbAdvancedTable.selectedRows.add(rowId);
       rowEl.classList.add("bg-row-selection");
       rowEl.classList.remove("bg-white", "bg-silver");
     } else {
-      tableData.selectedRows.delete(rowId);
+      PbAdvancedTable.selectedRows.delete(rowId);
     }
      // Update background color on row
     if (!isChecked) {
@@ -239,7 +116,6 @@ export default class PbAdvancedTable extends PbEnhancedElement {
         rowEl.classList.add("bg-silver");
       }
     }
-
     if (rowEl) {
       const table = rowEl.closest("table");
       const rowContent = rowEl.dataset.advancedTableContent;
@@ -261,11 +137,11 @@ export default class PbAdvancedTable extends PbEnhancedElement {
           const childRowId = childCheckbox.id;
           const childRowEl = childCheckbox.closest("tr");
           if (isChecked) {
-            tableData.selectedRows.add(childRowId);
+            PbAdvancedTable.selectedRows.add(childRowId);
             childRowEl?.classList.add("bg-row-selection");
             childRowEl?.classList.remove("bg-white", "bg-silver");
           } else {
-            tableData.selectedRows.delete(childRowId);
+            PbAdvancedTable.selectedRows.delete(childRowId);
           }
           if (!isChecked) {
             childRowEl?.classList.remove("bg-row-selection");
@@ -307,121 +183,43 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     return table.querySelectorAll(`[data-row-parent="${this.element.id}"]`);
   }
 
+  static expandedRows = new Set();
+  static selectedRows = new Set();
   static isCollapsing = false;
 
   connect() {
-    // Get table container and generate ID if needed
-    const tableContainer = this.getTableContainer();
-    if (!tableContainer) return;
-
-    const tableId = this.getTableId();
-    if (!tableId) return;
-
-    // Get or initialize table data
-    const tableData = PbAdvancedTable.getTableData(tableId);
-
-    // Handle toggle click
     this.element.addEventListener("click", () => {
       if (!PbAdvancedTable.isCollapsing) {
         const isExpanded =
           this.element.querySelector(UP_ARROW_SELECTOR).style.display ===
           "inline-block";
         if (!isExpanded) {
-          tableData.expandedRows.add(this.element.id);
+          PbAdvancedTable.expandedRows.add(this.element.id);
         } else {
-          tableData.expandedRows.delete(this.element.id);
+          PbAdvancedTable.expandedRows.delete(this.element.id);
         }
-        this.toggleElement(this.target, tableData.expandedRows);
+        this.toggleElement(this.target);
       }
     });
-
+  
     this.hideCloseIcon();
-
+  
     const table = this.element.closest("table");
-    if (!table) return;
-
-    // Skip if this table is already initialized
-    if (tableData.initialized) return;
-
-    // Initialize the action bar
-    const actionBar = tableContainer.querySelector(".row-selection-actions-card");
-    if (actionBar) {
-      // Direct style application
-      Object.assign(actionBar.style, {
-        height: '0px',
-        overflow: 'hidden',
-        display: 'block',
-        opacity: '0'
-      });
-
-      // Remove visibility classes
-      actionBar.classList.remove("is-visible", "show-action-card");
-
-      // Add CSS rules
-      const styleId = `action-bar-styles-${tableId}`;
-      let styleTag = document.getElementById(styleId);
-      if (!styleTag) {
-        styleTag = document.createElement('style');
-        styleTag.id = styleId;
-        document.head.appendChild(styleTag);
-      }
-
-      styleTag.textContent = `
-        #${tableId} .row-selection-actions-card.is-visible.show-action-card {
-          height: auto !important;
-          overflow: visible !important;
-          display: block !important;
-          opacity: 1 !important;
-          transition: height 0.3s ease, opacity 0.3s ease !important;
-        }
-      `;
-
-      // Direct DOM event listeners for checkboxes
-      const checkboxes = table.querySelectorAll('input[type="checkbox"]');
-      checkboxes.forEach(checkbox => {
-        checkbox.addEventListener('change', function() {
-          // Count selected checkboxes
-          const selectedCount = Array.from(checkboxes).filter(cb => cb.checked).length;
-
-          if (selectedCount > 0) {
-            // Show action bar directly
-            actionBar.style.height = 'auto';
-            actionBar.style.overflow = 'visible';
-            actionBar.style.opacity = '1';
-            actionBar.classList.add("is-visible", "show-action-card");
-
-            // Update the count
-            const countElement = actionBar.querySelector(".selected-count");
-            if (countElement) {
-              countElement.textContent = `${selectedCount} Selected`;
-            }
-          } else {
-            // Hide action bar directly
-            actionBar.style.height = '0px';
-            actionBar.style.overflow = 'hidden';
-            actionBar.style.opacity = '0';
-            actionBar.classList.remove("is-visible", "show-action-card");
-          }
-        });
-      });
-    }
-
-    // Bind checkbox change handlers
+  
+    // Prevent duplicate initialization
+    if (table.dataset.pbAdvancedTableInitialized) return;
+    table.dataset.pbAdvancedTableInitialized = "true";
+  
+    // Bind checkbox change handlers for all row checkboxes
     const checkboxLabels = table.querySelectorAll("label[data-row-id]");
     checkboxLabels.forEach((label) => {
       const checkbox = label.querySelector("input[type='checkbox']");
       if (!checkbox) return;
-
-      // Remove any existing event listeners
-      const newCheckbox = checkbox.cloneNode(true);
-      checkbox.parentNode.replaceChild(newCheckbox, checkbox);
-
-      // Add our event listener
-      newCheckbox.addEventListener("change", (event) => {
+      checkbox.addEventListener("change", (event) => {
         this.handleCheckboxClick(event);
       });
     });
-
+  
     // Bind nested row expansion logic
     const nestedButtons = table.querySelectorAll("[data-advanced-table]");
     nestedButtons.forEach((button) => {
@@ -429,61 +227,54 @@ export default class PbAdvancedTable extends PbEnhancedElement {
         const isExpanded =
           button.querySelector(UP_ARROW_SELECTOR).style.display === "inline-block";
         if (isExpanded) {
-          tableData.expandedRows.add(button.id);
+          PbAdvancedTable.expandedRows.add(button.id);
         } else {
-          tableData.expandedRows.delete(button.id);
+          PbAdvancedTable.expandedRows.delete(button.id);
         }
       });
     });
-
-    // Bind select-all logic
+  
+    // Bind select-all logic for this table
     const selectAllCheckbox = table.querySelector("#select-all-rows");
     if (selectAllCheckbox) {
-      // Remove any existing event listeners
-      const newSelectAllCheckbox = selectAllCheckbox.cloneNode(true);
-      selectAllCheckbox.parentNode.replaceChild(newSelectAllCheckbox, selectAllCheckbox);
-
-      // Add our event listener
-      newSelectAllCheckbox.addEventListener("change", () => {
-        const checkboxInput = newSelectAllCheckbox.querySelector('input[type="checkbox"]');
+      selectAllCheckbox.addEventListener("change", () => {
+        const checkboxInput = selectAllCheckbox.querySelector('input[type="checkbox"]');
         const checkAll = checkboxInput.checked;
-
+  
         const checkboxes = Array.from(
           table.querySelectorAll("label[data-row-id] input[type='checkbox']")
         );
-
+  
         checkboxes.forEach((cb) => {
           cb.checked = checkAll;
           const rowId = cb.id;
           const rowEl = cb.closest("tr");
 
           if (checkAll) {
-            tableData.selectedRows.add(rowId);
+            PbAdvancedTable.selectedRows.add(rowId);
             rowEl?.classList.add("bg-row-selection");
             rowEl?.classList.remove("bg-white", "bg-silver");
           } else {
-            tableData.selectedRows.delete(rowId);
+            PbAdvancedTable.selectedRows.delete(rowId);
             rowEl?.classList.remove("bg-row-selection");
             rowEl?.classList.add("bg-white");
           }
         });
-
+  
         checkboxes.forEach((cb) => this.updateParentCheckboxes(cb));
-
+  
         this.updateTableSelectedRowsAttribute();
       });
     }
-
-    // Mark table as initialized
-    tableData.initialized = true;
   }
+  
 
   hideCloseIcon() {
     const closeIcon = this.element.querySelector(UP_ARROW_SELECTOR);
     closeIcon.style.display = "none";
   }
 
-  showElement(elements, expandedRows) {
+  showElement(elements) {
     elements.forEach((elem) => {
       elem.style.display = "table-row";
       elem.classList.add("is-visible");
@@ -506,7 +297,7 @@ export default class PbAdvancedTable extends PbEnhancedElement {
           (id) => `${childRow.id}_${id}`
         );
         const allAncestorsExpanded = prefixedAncestorIds.every((id) =>
-          expandedRows.has(id)
+          PbAdvancedTable.expandedRows.has(id)
         );
 
         const checkIfParentIsExpanded = () => {
@@ -515,7 +306,7 @@ export default class PbAdvancedTable extends PbEnhancedElement {
             const isParentVisible =
               childRow.previousElementSibling.classList.contains("is-visible");
             if (parentRowId) {
-              const isInSet = expandedRows.has(parentRowId);
+              const isInSet = PbAdvancedTable.expandedRows.has(parentRowId);
               if (isInSet && isParentVisible) {
                 return true;
               }
@@ -535,14 +326,14 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     });
   }
 
-  hideElement(elements, expandedRows) {
+  hideElement(elements) {
     elements.forEach((elem) => {
       elem.style.display = "none";
       elem.classList.remove("is-visible");
 
       // Remove the row ID from expandedRows when this row is hidden
-      if (expandedRows.has(elem.id)) {
-        expandedRows.delete(elem.id);
+      if (PbAdvancedTable.expandedRows.has(elem.id)) {
+        PbAdvancedTable.expandedRows.delete(elem.id);
       }
 
       const childrenArray = elem.dataset.advancedTableContent.split("-");
@@ -563,12 +354,12 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     });
   }
 
-  toggleElement(elements, expandedRows) {
+  toggleElement(elements) {
     if (!elements.length) return;
 
     const isVisible = elements[0].classList.contains("is-visible");
 
-    isVisible ? this.hideElement(elements, expandedRows) : this.showElement(elements, expandedRows);
+    isVisible ? this.hideElement(elements) : this.showElement(elements);
     isVisible ? this.displayDownArrow() : this.displayUpArrow();
 
     const row = this.element.closest("tr");
@@ -591,12 +382,6 @@ export default class PbAdvancedTable extends PbEnhancedElement {
   }
 
   static handleToggleAllHeaders(element) {
-    // Get table ID
-    const tableContainer = element.closest(".pb_advanced_table");
-    if (!tableContainer || !tableContainer.id) return;
-
-    const tableData = PbAdvancedTable.getTableData(tableContainer.id);
-
     const table = element.closest(".pb_table");
     const firstLevelButtons = table.querySelectorAll(
       ".pb_advanced_table_body > .pb_table_tr[data-row-depth='0'] [data-advanced-table]"
@@ -610,17 +395,17 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     if (allExpanded) {
       firstLevelButtons.forEach((button) => {
         button.click();
-        tableData.expandedRows.delete(button.id);
+        PbAdvancedTable.expandedRows.delete(button.id);
       });
     } else {
       firstLevelButtons.forEach((button) => {
-        if (!tableData.expandedRows.has(button.id)) {
+        if (!PbAdvancedTable.expandedRows.has(button.id)) {
           button.click();
-          tableData.expandedRows.add(button.id);
+          PbAdvancedTable.expandedRows.add(button.id);
         }
       });
 
-      tableData.expandedRows.forEach((rowId) => {
+      PbAdvancedTable.expandedRows.forEach((rowId) => {
         const nestedButton = table.querySelector(
           `[data-advanced-table][id="${rowId}"]`
         );
@@ -632,12 +417,6 @@ export default class PbAdvancedTable extends PbEnhancedElement {
   }
 
   static handleToggleAllSubRows(element, rowDepth) {
-    // Get table ID
-    const tableContainer = element.closest(".pb_advanced_table");
-    if (!tableContainer || !tableContainer.id) return;
-
-    const tableData = PbAdvancedTable.getTableData(tableContainer.id);
-
     const table = element.closest(".pb_table");
     const parentRow = element.closest("tr");
     if (!parentRow) {
@@ -657,79 +436,19 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     if (allExpanded) {
       subRowButtons.forEach((button) => {
         button.click();
-        tableData.expandedRows.delete(button.id);
+        PbAdvancedTable.expandedRows.delete(button.id);
       });
     } else {
       subRowButtons.forEach((button) => {
-        if (!tableData.expandedRows.has(button.id)) {
+        if (!PbAdvancedTable.expandedRows.has(button.id)) {
           button.click();
-          tableData.expandedRows.add(button.id);
+          PbAdvancedTable.expandedRows.add(button.id);
         }
       });
     }
   }
 }
 
-// Initialize on page load
-document.addEventListener('DOMContentLoaded', () => {
-  const advancedTables = document.querySelectorAll('.pb_advanced_table');
-
-  // Initialize each table and its action bar
-  advancedTables.forEach(table => {
-    // Generate ID if needed
-    if (!table.id) {
-      table.id = `table-${Date.now()}-${Math.floor(Math.random() * 10000)}`;
-    }
-
-    // Initialize table data
-    PbAdvancedTable.getTableData(table.id);
-
-    // Initialize action bar
-    const actionBar = table.querySelector('.row-selection-actions-card');
-    if (actionBar) {
-      // Direct styling override
-      Object.assign(actionBar.style, {
-        height: '0px',
-        overflow: 'hidden',
-        display: 'block',
-        opacity: '0'
-      });
-
-      // Remove any visibility classes
-      actionBar.classList.remove("is-visible", "show-action-card");
-
-      // Direct DOM manipulation for checkboxes
-      const checkboxes = table.querySelectorAll('input[type="checkbox"]');
-      checkboxes.forEach(checkbox => {
-        checkbox.addEventListener('change', function() {
-          // Count selected checkboxes
-          const selectedCount = Array.from(checkboxes).filter(cb => cb.checked).length;
-
-          if (selectedCount > 0) {
-            // Show action bar directly
-            actionBar.style.height = 'auto';
-            actionBar.style.overflow = 'visible';
-            actionBar.style.opacity = '1';
-            actionBar.classList.add("is-visible", "show-action-card");
-
-            // Update the count
-            const countElement = actionBar.querySelector(".selected-count");
-            if (countElement) {
-              countElement.textContent = `${selectedCount} Selected`;
-            }
-          } else {
-            // Hide action bar directly
-            actionBar.style.height = '0px';
-            actionBar.style.overflow = 'hidden';
-            actionBar.style.opacity = '0';
-            actionBar.classList.remove("is-visible", "show-action-card");
-          }
-        });
-      });
-    }
-  });
-});
-
 window.expandAllRows = (element) => {
   PbAdvancedTable.handleToggleAllHeaders(element);
 };