playbook_ui 14.23.0.pre.rc.3 → 14.24.0.pre.alpha.PLAY1972validatemissingareacodeandrepeatcountrycode9457

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

@@ -39,6 +39,70 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     );
   }
 
+  // Recalculate selected count based on all checked checkboxes
+  recalculateSelectedCount() {
+    const table = this.element.closest("table");
+    
+    // Get all checkboxes that could be part of the selection
+    // This includes row checkboxes and any parent checkboxes that might be programmatically checked
+    const rowCheckboxes = table.querySelectorAll(
+      'label[data-row-id] input[type="checkbox"]'
+    );
+    
+    // Also get any checkboxes that might be parent checkboxes (those with data-pb-checkbox-indeterminate-main)
+    // But exclude the select-all checkbox itself from the count
+    const parentCheckboxes = table.querySelectorAll(
+      '[data-pb-checkbox-indeterminate-main="true"] input[type="checkbox"]'
+    );
+    
+    // Filter out the select-all checkbox from parent checkboxes
+    const selectAllCheckbox = table.querySelector('#select-all-rows input[type="checkbox"]');
+    const filteredParentCheckboxes = Array.from(parentCheckboxes).filter(checkbox => 
+      checkbox !== selectAllCheckbox && !checkbox.id.includes('select-all-rows')
+    );
+    
+    // Combine all checkboxes and remove duplicates
+    const allCheckboxes = new Set([...rowCheckboxes, ...filteredParentCheckboxes]);
+    
+    // Clear the selectedRows Set and rebuild it from checked checkboxes
+    PbAdvancedTable.selectedRows.clear();
+    
+    allCheckboxes.forEach((checkbox) => {
+      const rowEl = checkbox.closest("tr");
+      const isChecked = checkbox.checked;
+      
+      if (isChecked) {
+        PbAdvancedTable.selectedRows.add(checkbox.id);
+        // Only apply styling if the checkbox is inside a table row
+        if (rowEl) {
+          rowEl.classList.add("bg-row-selection");
+          rowEl.classList.remove("bg-white", "bg-silver");
+        }
+      } else {
+        // Only apply styling if the checkbox is inside a table row
+        if (rowEl) {
+          rowEl.classList.remove("bg-row-selection");
+          
+          if (this.isRowExpanded(rowEl)) {
+            rowEl.classList.remove("bg-silver");
+            rowEl.classList.add("bg-white");
+          } else {
+            rowEl.classList.remove("bg-white");
+            rowEl.classList.add("bg-silver");
+          }
+        }
+      }
+    });
+    
+    this.updateTableSelectedRowsAttribute();
+    updateSelectionActionBar(table.closest(".pb_advanced_table"), PbAdvancedTable.selectedRows.size);
+    
+    // Sync header select-all state
+    if (selectAllCheckbox) {
+      selectAllCheckbox.checked = Array.from(rowCheckboxes).every((cb) => cb.checked);
+    }
+  }
+
   // 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
@@ -47,75 +111,6 @@ export default class PbAdvancedTable extends PbEnhancedElement {
     return closeIcon?.style.display === "none" || !closeIcon;
   }
 
-  updateParentCheckboxes(checkbox) {
-    const rowEl = checkbox.closest("tr");
-    if (!rowEl) return;
-
-    const table = rowEl.closest("table");
-    if (!table) return;
-
-    const contentTrail = rowEl.dataset.advancedTableContent;
-    if (!contentTrail) return;
-
-    const ancestorIds = contentTrail.split("-").slice(0, -1);
-
-    ancestorIds.reverse();
-    ancestorIds.forEach((ancestorId) => {
-      const parentRowSelector = `[data-advanced-table-content$="${ancestorId}"]`;
-      const parentRow = table.querySelector(parentRowSelector);
-      if (!parentRow) return;
-
-      const parentLabel = parentRow.querySelector("label[data-row-id]");
-      if (!parentLabel) return;
-
-      const parentCheckbox = parentLabel.querySelector(
-        "input[type='checkbox']"
-      );
-      if (!parentCheckbox) return;
-
-      // Find all immediate children of parent linked to ancestor Id, filter our subrow headers
-      const children = Array.from(
-        table.querySelectorAll(`tr[data-row-parent$="_${ancestorId}"]`)
-      ).filter((child) => {
-        const content = child.dataset.advancedTableContent;
-        return !(content && content.endsWith("sr"));
-      });
-
-      const allChildrenChecked = Array.from(children).every((child) => {
-        const childLabel = child.querySelector("label[data-row-id]");
-        if (!childLabel) return false;
-        const childCheckbox = childLabel.querySelector(
-          "input[type='checkbox']"
-        );
-        if (!childCheckbox) return false;
-        return childCheckbox.checked;
-      });
-
-      // Update parent checkbox
-      parentCheckbox.checked = allChildrenChecked;
-
-      const parentCheckboxId = parentCheckbox.id;
-      if (allChildrenChecked) {
-        PbAdvancedTable.selectedRows.add(parentCheckboxId);
-        parentRow.classList.add("bg-row-selection");
-        parentRow.classList.remove("bg-white", "bg-silver");
-      } else {
-        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");
-        } else {
-          parentRow.classList.remove("bg-white");
-          parentRow.classList.add("bg-silver");
-        }
-      }
-    });
-  }
-
   handleCheckboxClick(event) {
     const checkbox = event.currentTarget;
     const rowId = checkbox.id;
@@ -141,49 +136,6 @@ export default class PbAdvancedTable extends PbEnhancedElement {
         rowEl.classList.add("bg-silver");
       }
     }
-    if (rowEl) {
-      const table = rowEl.closest("table");
-      const rowContent = rowEl.dataset.advancedTableContent;
-
-      if (rowContent) {
-        const childRows = table.querySelectorAll(
-          `[data-advanced-table-content^="${rowContent}-"]`
-        );
-
-        childRows.forEach((childRow) => {
-          const label = childRow.querySelector("label[data-row-id]");
-          if (!label) return;
-
-          const childCheckbox = label.querySelector("input[type='checkbox']");
-          if (!childCheckbox) return;
-
-          childCheckbox.checked = isChecked;
-
-          const childRowId = childCheckbox.id;
-          const childRowEl = childCheckbox.closest("tr");
-          if (isChecked) {
-            PbAdvancedTable.selectedRows.add(childRowId);
-            childRowEl?.classList.add("bg-row-selection");
-            childRowEl?.classList.remove("bg-white", "bg-silver");
-          } else {
-            PbAdvancedTable.selectedRows.delete(childRowId);
-          }
-          if (!isChecked) {
-            childRowEl?.classList.remove("bg-row-selection");
-
-            if (this.isRowExpanded(childRowEl)) {
-              childRowEl?.classList.remove("bg-silver");
-              childRowEl?.classList.add("bg-white");
-            } else {
-              childRowEl?.classList.remove("bg-white");
-              childRowEl?.classList.add("bg-silver");
-            }
-          }
-        });
-      }
-    }
-
-    this.updateParentCheckboxes(checkbox);
 
     this.updateTableSelectedRowsAttribute();
 
@@ -249,8 +201,11 @@ export default class PbAdvancedTable extends PbEnhancedElement {
             this.handleCheckboxClick({ currentTarget: cb });
           }
         });
-        this.updateTableSelectedRowsAttribute();
-        updateSelectionActionBar(table.closest(".pb_advanced_table"), PbAdvancedTable.selectedRows.size);
+        
+        // Recalculate the count to ensure all checkboxes are properly tracked
+        setTimeout(() => {
+          this.recalculateSelectedCount();
+        }, 0);
         return;
       }
 
@@ -258,17 +213,41 @@ export default class PbAdvancedTable extends PbEnhancedElement {
       const rowLabel = checkbox.closest("label[data-row-id]");
       if (rowLabel) {
         this.handleCheckboxClick({ currentTarget: checkbox });
-        this.updateTableSelectedRowsAttribute();
+        
+        // Recalculate the count to ensure all checkboxes are properly tracked
+        setTimeout(() => {
+          this.recalculateSelectedCount();
+        }, 0);
+      }
+    });
 
-        // Sync header select-all state
-        const selectAllInput = table.querySelector(
-          '#select-all-rows input[type="checkbox"]'
-        );
-        if (selectAllInput) {
-          selectAllInput.checked = Array.from(
-            table.querySelectorAll('label[data-row-id] input[type="checkbox"]')
-          ).every((cb) => cb.checked);
-        }
+    // If a parent checkbox changed a checkbox, update styling
+    // Listen for programmatic checkbox changes from parent-child relationships
+    table.addEventListener("checkbox-programmatic-change", (event) => {
+      const checkbox = event.target;
+      if (!checkbox || checkbox.type !== 'checkbox') return;
+
+      // Individual row checkbox logic
+      const rowLabel = checkbox.closest("label[data-row-id]");
+      if (rowLabel) {
+        this.handleCheckboxClick({ currentTarget: checkbox });
+      }
+      
+      // Recalculate the count to ensure all programmatically changed checkboxes are included
+      setTimeout(() => {
+        this.recalculateSelectedCount();
+      }, 10); // Slightly longer delay to ensure all changes are processed
+    });
+
+
+    // Also listen for all checkbox changes to ensure we catch everything
+    table.addEventListener("change", (event) => {
+      const checkbox = event.target;
+      if (checkbox && checkbox.type === 'checkbox') {
+        // Force recalculation after a short delay to ensure all changes are processed
+        setTimeout(() => {
+          this.recalculateSelectedCount();
+        }, 50);
       }
     });
 
@@ -314,12 +293,16 @@ export default class PbAdvancedTable extends PbEnhancedElement {
         "tr.is-visible, tr:not(.toggle-content)"
       );
 
-      visibleRows.forEach((row) => row.classList.remove("last-visible-row"));
+      visibleRows.forEach((row) => {
+        row.classList.remove("last-visible-row");
+        row.classList.remove("last-row-cell");
+      });
 
       const lastVisibleRow = visibleRows[visibleRows.length - 1];
 
       if (lastVisibleRow) {
         lastVisibleRow.classList.add("last-visible-row");
+        lastVisibleRow.classList.add("last-row-cell");
       }
     }
   }

data/app/pb_kits/playbook/pb_advanced_table/scss_partials/advanced_table_sticky_mixin.scss

@@ -79,8 +79,14 @@
     left: 0;
     border-radius: unset;
     z-index: 5;
-  }
 
+    // Add proper border radius when action bar is visible
+    &.is-visible,
+    &.show-action-card {
+      border-top-left-radius: 4px !important;
+      border-top-right-radius: 4px !important;
+    }
+  }
   .checkbox-cell {
     display: table-cell !important;
   }

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

@@ -23,6 +23,8 @@ module Playbook
                         default: "scroll"
       prop :selectable_rows, type: Playbook::Props::Boolean,
                              default: false
+      prop :row_styling, type: Playbook::Props::Array,
+                         default: []
 
       def flatten_columns(columns)
         columns.flat_map do |col|
@@ -38,13 +40,14 @@ module Playbook
         end.compact
       end
 
-      def render_row_and_children(row, column_definitions, current_depth, first_parent_child, ancestor_ids = [], top_parent_id = nil, additional_classes: "", table_data_attributes: {})
+      def render_row_and_children(row, column_definitions, current_depth, first_parent_child, ancestor_ids = [], top_parent_id = nil, additional_classes: "", table_data_attributes: {}, immediate_parent_row_id: nil)
         top_parent_id ||= row.object_id
         new_ancestor_ids = ancestor_ids + [row.object_id]
         leaf_columns = flatten_columns(column_definitions)
 
         output = ActiveSupport::SafeBuffer.new
         is_first_child_of_subrow = current_depth.positive? && first_parent_child && subrow_headers[current_depth - 1].present?
+        last_row = subrow_headers.length == current_depth
 
         subrow_ancestor_ids = ancestor_ids + ["#{row.object_id}sr"]
         subrow_data_attributes = {
@@ -53,7 +56,7 @@ module Playbook
           row_parent: "#{id}_#{ancestor_ids.last}",
         }
         # Subrow header if applicable
-        output << pb_rails("advanced_table/table_subrow_header", props: { row: row, column_definitions: leaf_columns, depth: current_depth, subrow_header: subrow_headers[current_depth - 1], collapsible_trail: collapsible_trail, classname: "toggle-content", responsive: responsive, subrow_data_attributes: subrow_data_attributes }) if is_first_child_of_subrow && enable_toggle_expansion == "all"
+        output << pb_rails("advanced_table/table_subrow_header", props: { row: row, column_definitions: leaf_columns, depth: current_depth, subrow_header: subrow_headers[current_depth - 1], collapsible_trail: collapsible_trail, classname: "toggle-content", responsive: responsive, subrow_data_attributes: subrow_data_attributes, last_row: last_row, immediate_parent_row_id: immediate_parent_row_id }) if is_first_child_of_subrow && enable_toggle_expansion == "all"
 
         current_data_attributes = if current_depth.zero?
                                     {
@@ -66,7 +69,7 @@ module Playbook
                                   end
 
         # Additional class and data attributes needed for toggle logic
-        output << pb_rails("advanced_table/table_row", props: { id: id, row: row, column_definitions: leaf_columns, depth: current_depth, collapsible_trail: collapsible_trail, classname: additional_classes, table_data_attributes: current_data_attributes, responsive: responsive, loading: loading, selectable_rows: selectable_rows, row_id: row[:id], enable_toggle_expansion: enable_toggle_expansion })
+        output << pb_rails("advanced_table/table_row", props: { id: id, row: row, column_definitions: leaf_columns, depth: current_depth, collapsible_trail: collapsible_trail, classname: additional_classes, table_data_attributes: current_data_attributes, responsive: responsive, loading: loading, selectable_rows: selectable_rows, row_id: row[:id], enable_toggle_expansion: enable_toggle_expansion, row_styling: row_styling, last_row: last_row, immediate_parent_row_id: immediate_parent_row_id })
 
         if row[:children].present?
           row[:children].each do |child_row|
@@ -81,7 +84,7 @@ module Playbook
               advanced_table_content: data_content,
             }
 
-            output << render_row_and_children(child_row, column_definitions, current_depth + 1, is_first_child, new_ancestor_ids, top_parent_id, additional_classes: "toggle-content", table_data_attributes: child_data_attributes)
+            output << render_row_and_children(child_row, column_definitions, current_depth + 1, is_first_child, new_ancestor_ids, top_parent_id, additional_classes: "toggle-content", table_data_attributes: child_data_attributes, immediate_parent_row_id: row[:id])
           end
         end
 

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

@@ -26,7 +26,11 @@
                 <% end %>
               <% end %>
             <% end %>
-            <%= cell[:label] %>
+            <% if object.has_header_renderer?(cell) %>
+              <%= raw(object.render_header(cell)) %>
+            <% else %>
+              <%= cell[:label] %>
+            <% end %>
           <% end %>
         <% end %>
       <% end %>

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

@@ -3,6 +3,8 @@
 module Playbook
   module PbAdvancedTable
     class TableHeader < Playbook::KitBase
+      prop :id, type: Playbook::Props::String,
+                default: ""
       prop :column_definitions, type: Playbook::Props::Array,
                                 default: []
       prop :enable_toggle_expansion, type: Playbook::Props::Enum,
@@ -56,8 +58,10 @@ module Playbook
                      classname: additional_classes.join(" "),
                    }) do
             pb_rails("checkbox", props: {
-                       id: "select-all-rows",
-                       name: "select-all-rows",
+                       id: "#{id ? "#{id}-" : ''}select-all-rows",
+                       indeterminate_main: true,
+                       indeterminate_main_labels: ["", ""],
+                       name: "#{id ? "#{id}-" : ''}select-all-rows",
                      })
           end
         end
@@ -67,8 +71,10 @@ module Playbook
       def render_select_all_checkbox
         if selectable_rows
           pb_rails("checkbox", props: {
-                     id: "select-all-rows",
-                     name: "select-all-rows",
+                     id: "#{id ? "#{id}-" : ''}select-all-rows",
+                     indeterminate_main: true,
+                     indeterminate_main_labels: ["", ""],
+                     name: "#{id ? "#{id}-" : ''}select-all-rows",
                      data: {
                        action: "click->pb-advanced-table#toggleAllRowSelection",
                      },
@@ -76,6 +82,30 @@ module Playbook
         end
       end
 
+      # Get original column definition for custom rendering
+      def find_original_column_def(accessor)
+        find_column_def_by_accessor(column_definitions, accessor)
+      end
+
+      # Check if a header cell has a custom renderer
+      def has_header_renderer?(cell)
+        return false unless cell[:accessor].present?
+
+        original_def = find_original_column_def(cell[:accessor])
+        original_def && original_def[:header].present?
+      end
+
+      # Render custom header content
+      def render_header(cell)
+        return cell[:label] unless has_header_renderer?(cell)
+
+        original_def = find_original_column_def(cell[:accessor])
+        custom_renderer = original_def[:header]
+
+        # Call the custom renderer with the cell data and label
+        custom_renderer.call(cell, cell[:label])
+      end
+
     private
 
       def compute_max_depth(columns)
@@ -148,6 +178,18 @@ module Playbook
         end
         wrapped
       end
+
+      def find_column_def_by_accessor(defs, target_accessor)
+        defs.each do |col|
+          return col if col[:accessor] == target_accessor
+
+          if col[:columns].is_a?(Array)
+            found = find_column_def_by_accessor(col[:columns], target_accessor)
+            return found if found
+          end
+        end
+        nil
+      end
     end
   end
 end

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

@@ -1,3 +1,10 @@
+<% 
+  row_style = object.row_styling.find { |style| style[:row_id].to_s == object.row_id.to_s } 
+  button_color = row_style&.[](:expand_button_color)
+  bg_color = row_style&.[](:background_color)
+  font_color = row_style&.[](:font_color)
+%>
+
 <%= pb_content_tag(:tr) do %>
     <% has_separate_checkbox = object.selectable_rows && object.enable_toggle_expansion == "none" %>
     <% if has_separate_checkbox %>
@@ -5,7 +12,7 @@
     <% end %>
     <% object.column_definitions.each_with_index do |column, index| %>
         <% next unless column[:accessor].present? %>
-        <%= pb_rails("table/table_cell", props: { classname:object.td_classname(column, index)}) do %>
+        <%= pb_rails("table/table_cell", props: {  html_options: { style: { "background-color": bg_color, color: font_color } }, classname:object.td_classname(column, index)}) do %>
             <%= pb_rails("flex", props:{ align: "center", justify: object.justify_for(column, index), classname: object.loading ? "loading-cell" : "" }) do %>
                 <% if collapsible_trail && index.zero? %>
                     <% (1..depth).each do |i| %>
@@ -28,13 +35,15 @@
                                 <button
                                     id="<%= "#{object.id}_#{object.row.object_id}" %>"
                                     class="gray-icon expand-toggle-icon"
-                                    data-advanced-table="true">
+                                    data-advanced-table="true"
+                                    style="color: <%= button_color %>"
+                                >
                                     <%= pb_rails("icon", props: { id: "advanced-table_open_icon", icon: "circle-play", cursor: "pointer" }) %>
-                                    <%= pb_rails("icon", props: { id: "advanced-table_close_icon", icon: "circle-play-down", cursor: "pointer" }) %>
+                                    <%= pb_rails("icon", props: { id: "advanced-table_close_icon", icon: "circle-play", cursor: "pointer", rotation: 90 }) %>
                                 </button>
                             <% end %>
                         <% end %>
-                        <%= pb_rails("flex/flex_item") do %>
+                        <%= pb_rails("flex/flex_item") do %>       
                             <% if column[:custom_renderer].present? %>
                                 <%= raw(column[:custom_renderer].call(object.row, custom_renderer_value(column, index))) %>
                             <% elsif index.zero? %>

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

@@ -27,6 +27,12 @@ module Playbook
       prop :enable_toggle_expansion, type: Playbook::Props::Enum,
                                      values: %w[all header none],
                                      default: "header"
+      prop :row_styling, type: Playbook::Props::Array,
+                         default: []
+      prop :last_row, type: Playbook::Props::Boolean,
+                      default: false
+      prop :immediate_parent_row_id, type: Playbook::Props::String,
+                                     default: ""
 
       def data
         Hash(prop(:data)).merge(table_data_attributes)
@@ -37,7 +43,7 @@ module Playbook
       end
 
       def td_classname(column, index)
-        classes = %w[id-cell chrome-styles]
+        classes = %w[id-cell]
         classes << "last-cell" if column[:is_last_in_group]
         classes << "pinned-left" if index.zero? && is_pinned_left && responsive == "scroll"
         classes.join(" ")
@@ -52,12 +58,14 @@ module Playbook
       # Selectable Rows No Subrows - checkboxes in their own first cell
       def render_checkbox_cell
         if selectable_rows
+          prefix = id ? "#{id}-" : ""
           pb_rails("table/table_cell", props: {
                      classname: "checkbox-cell",
                    }) do
             pb_rails("checkbox", props: {
-                       id: "select-row-#{row_id || row.object_id}",
-                       name: "select-row-#{row_id || row.object_id}",
+                       id: "#{prefix}select-row-#{row_id || row.object_id}",
+                       indeterminate_parent: "#{id ? "#{id}-" : ''}select-all-rows",
+                       name: "#{prefix}select-row-#{row_id || row.object_id}",
                        data: {
                          row_id: row_id || row.object_id.to_s,
                          flat_advanced_table_select: true,
@@ -70,9 +78,20 @@ module Playbook
       # Selectable Rows w/ Subrows - checkboxes part of toggleable first cell
       def render_row_checkbox
         if selectable_rows
+          prefix = id ? "#{id}-" : ""
+          indeterminate_parent =
+            if depth.zero?
+              "#{prefix}select-all-rows"
+            else
+              "#{prefix}select-row-#{immediate_parent_row_id}"
+            end
+
           pb_rails("checkbox", props: {
-                     id: "select-row-#{row_id || row.object_id}",
-                     name: "select-row-#{row_id || row.object_id}",
+                     id: "#{prefix}select-row-#{row_id || row.object_id}",
+                     indeterminate_main: !last_row,
+                     indeterminate_main_labels: ["", ""],
+                     indeterminate_parent: indeterminate_parent,
+                     name: "#{prefix}select-row-#{row_id || row.object_id}",
                      data: {
                        row_id: row_id || row.object_id.to_s,
                      },

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

@@ -29,7 +29,7 @@ module Playbook
       end
 
       def td_classname(index)
-        classes = %w[id-cell chrome-styles]
+        classes = %w[id-cell]
         classes << "pinned-left" if index.zero? && responsive == "scroll"
         classes.join(" ")
       end

data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_position.md

@@ -1,7 +1,7 @@
 ##### Prop
 
 `align` **Type**: String | **Values**: left | center | right (defaults to center)
-`verticalAlign` **Type**: String | **Values**: top | middle | bottom (defaults middle)
+`verticalAlign` **Type**: String | **Values**: top | middle | bottom (defaults to bottom)
 `layout` **Type**: String | **Values**: horizontal | vertical | proximate (defaults to horizontal)
 `x` **Type**: Number (defaults to 0)
 `y` **Type**: Number (defaults to 0)

data/app/pb_kits/playbook/pb_checkbox/checkbox.rb

@@ -6,6 +6,8 @@ module Playbook
       prop :error, type: Playbook::Props::Boolean, default: false
       prop :checked, type: Playbook::Props::Boolean, default: false
       prop :indeterminate_main, type: Playbook::Props::Boolean, default: false
+      prop :indeterminate_main_labels, type: Playbook::Props::Array,
+                                       default: []
       prop :indeterminate_parent
       prop :text
       prop :value
@@ -49,10 +51,19 @@ module Playbook
       end
 
       def data
-        Hash(prop(:data)).merge(
+        base_data = Hash(prop(:data)).merge(
           pb_checkbox_indeterminate_main: indeterminate_main,
           pb_checkbox_indeterminate_parent: indeterminate_parent
         )
+
+        if indeterminate_main && indeterminate_main_labels.size == 2
+          base_data.merge!(
+            pb_checkbox_indeterminate_main_label_check: indeterminate_main_labels[0],
+            pb_checkbox_indeterminate_main_label_uncheck: indeterminate_main_labels[1]
+          )
+        end
+
+        base_data
       end
 
     private

data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate.html.erb

@@ -9,10 +9,10 @@
     <tr>
       <th>
         <%= pb_rails("checkbox", props: {
-          text: "Uncheck All",
           value: "checkbox-value",
           name: "main-checkbox",
           indeterminate_main: true,
+          indeterminate_main_labels: ["Check All Ice Cream", "Uncheck All Ice Cream"],
           id: "indeterminate-checkbox"
         }) %>
       </th>

data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate_rails.md

@@ -1 +1,2 @@
-If you want to use indeterminate, "check/uncheck all" checkboxes, add `indeterminate_main: true` and an `id` to the main checkbox. Then, add an `indeterminate_parent` prop with the main checkbox's `id` to the children checkboxes.
+If you want to use indeterminate, "check/uncheck all" checkboxes, add `indeterminate_main: true` and an `id` to the main checkbox. Then, add an `indeterminate_parent` prop with the main checkbox's `id` to the children checkboxes.
+If you want to customize the main checkbox labels, set an array `indeterminate_main_labels` with "Check All" and "Uncheck All" labels.