playbook_ui_docs 14.20.0.pre.alpha.play2224scrollbarfix7991 → 14.20.0.pre.alpha.revert4453PBNTR933reactdraggablebugdragbtwnexamples7854

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui_docs
 version: !ruby/object:Gem::Version
-  version: 14.20.0.pre.alpha.play2224scrollbarfix7991
+  version: 14.20.0.pre.alpha.revert4453PBNTR933reactdraggablebugdragbtwnexamples7854
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-05-30 00:00:00.000000000 Z
+date: 2025-05-23 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: playbook_ui
@@ -95,12 +95,8 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions.md
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions_rails.html.erb
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions_rails.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_header.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_header.md
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_header_rails.html.erb
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_header_rails.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_no_subrows_rails.html.erb
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_no_subrows_rails.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_no_subrows_react.jsx
@@ -385,7 +381,6 @@ files:
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_error_swift.md
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate.html.erb
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate.jsx
-- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate_rails.md
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate_swift.md
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_options.html.erb
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_props_swift.md
@@ -1613,9 +1608,6 @@ files:
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.html.erb
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.jsx
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.md
-- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_exclude_countries.html.erb
-- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_exclude_countries.jsx
-- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_exclude_countries.md
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.html.erb
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.jsx
 - app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.md
@@ -1801,9 +1793,6 @@ files:
 - app/pb_kits/playbook/pb_select/docs/_select_blank.jsx
 - app/pb_kits/playbook/pb_select/docs/_select_custom_select.html.erb
 - app/pb_kits/playbook/pb_select/docs/_select_custom_select.jsx
-- app/pb_kits/playbook/pb_select/docs/_select_custom_select_subheaders.html.erb
-- app/pb_kits/playbook/pb_select/docs/_select_custom_select_subheaders.jsx
-- app/pb_kits/playbook/pb_select/docs/_select_custom_select_subheaders.md
 - app/pb_kits/playbook/pb_select/docs/_select_default.html.erb
 - app/pb_kits/playbook/pb_select/docs/_select_default.jsx
 - app/pb_kits/playbook/pb_select/docs/_select_default_swift.md

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions_rails.html.erb

@@ -1,137 +0,0 @@
-<% column_definitions = [
-  {
-    accessor: "year",
-    label: "Year",
-    cellAccessors: ["quarter", "month", "day"],
-  },
-  {
-    accessor: "newEnrollments",
-    label: "New Enrollments",
-  },
-  {
-    accessor: "scheduledMeetings",
-    label: "Scheduled Meetings",
-  },
-  {
-    accessor: "attendanceRate",
-    label: "Attendance Rate",
-  },
-  {
-    accessor: "completedClasses",
-    label: "Completed Classes",
-  },
-  {
-    accessor: "classCompletionRate",
-    label: "Class Completion Rate",
-  },
-  {
-    accessor: "graduatedStudents",
-    label: "Graduated Students",
-  }
-]
-
-actions = [
-  pb_rails("circle_icon_button", props: {
-    icon: "file-csv",
-    variant: "link",
-    id: "export-selected-rows-btn",
-    data: {
-      action_type: "export"
-    }
-  }),
-  pb_rails("circle_icon_button", props: {
-    icon: "trash-alt",
-    variant: "link",
-    id: "delete-selected-rows-btn",
-    data: {
-      action_type: "delete"
-    }
-  })
-]
-%>
-
-<%= pb_rails("advanced_table", props: {
-  id: "selectable_rows_with_actions",
-  table_data: @table_data_no_subrows,
-  column_definitions: column_definitions,
-  selectable_rows: true,
-  enable_toggle_expansion: "none",
-  actions: actions
-}) %>
-
-<script>
-  // Handle action clicks using the data-selected-rows attribute
-  window.handleActionClick = function(actionType) {
-    const tableContainer = document.getElementById('selectable_rows_with_actions');
-    if (!tableContainer) return;
-
-    // Get selected rows from the data attribute
-    const selectedRowsJSON = tableContainer.getAttribute('data-selected-rows');
-    let selectedRowIds = [];
-
-    try {
-      // Parse the JSON string from the data attribute
-      if (selectedRowsJSON) {
-        selectedRowIds = JSON.parse(selectedRowsJSON);
-      }
-    } catch (e) {
-      // Fallback if JSON parsing fails
-      const checkboxes = tableContainer.querySelectorAll('input[type="checkbox"]:checked');
-      const selectedCheckboxes = Array.from(checkboxes).filter(checkbox =>
-        checkbox.id !== 'select-all-rows' &&
-        !checkbox.closest('#select-all-rows')
-      );
-      selectedRowIds = selectedCheckboxes.map(checkbox => checkbox.id);
-    }
-
-    // Show appropriate message
-    if (!selectedRowIds || selectedRowIds.length === 0) {
-      alert('No Selection Made');
-    } else {
-      if (actionType === 'export') {
-        alert(`Row ids ${selectedRowIds.join(', ')} will be exported!`);
-      } else if (actionType === 'delete') {
-        alert(`Row ids ${selectedRowIds.join(', ')} will be deleted!`);
-      }
-    }
-  };
-
-  // Add event listeners when the DOM is ready
-  document.addEventListener('DOMContentLoaded', function() {
-    // Get the buttons
-    const exportBtn = document.getElementById('export-selected-rows-btn');
-    const deleteBtn = document.getElementById('delete-selected-rows-btn');
-
-    // Add click event listeners
-    if (exportBtn) {
-      exportBtn.addEventListener('click', function(e) {
-        e.preventDefault();
-        window.handleActionClick('export');
-      });
-    }
-
-    if (deleteBtn) {
-      deleteBtn.addEventListener('click', function(e) {
-        e.preventDefault();
-        window.handleActionClick('delete');
-      });
-    }
-
-    // Optional: Event delegation through the action bar
-    const actionBar = document.querySelector('.row-selection-actions-card');
-    if (actionBar) {
-      actionBar.addEventListener('click', function(e) {
-        const exportButton = e.target.closest('#export-selected-rows-btn');
-        const deleteButton = e.target.closest('#delete-selected-rows-btn');
-
-        if (exportButton) {
-          e.preventDefault();
-          window.handleActionClick('export');
-        } else if (deleteButton) {
-          e.preventDefault();
-          window.handleActionClick('delete');
-        }
-      });
-    }
-  });
-</script>

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions_rails.md

@@ -1,3 +0,0 @@
-Custom actions content can be rendered within the Actions Bar as shown in this doc example. The component passed to `actions` will be rendered on the right of the actionsBar.
-
-You can utilize script tags with your actions to provide your buttons with any clickable events needed.

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_header_rails.html.erb

@@ -1,40 +0,0 @@
-<% column_definitions = [
-  {
-    accessor: "year",
-    label: "Year",
-    cellAccessors: ["quarter", "month", "day"],
-  },
-  {
-    accessor: "newEnrollments",
-    label: "New Enrollments",
-  },
-  {
-    accessor: "scheduledMeetings",
-    label: "Scheduled Meetings",
-  },
-  {
-    accessor: "attendanceRate",
-    label: "Attendance Rate",
-  },
-  {
-    accessor: "completedClasses",
-    label: "Completed Classes",
-  },
-  {
-    accessor: "classCompletionRate",
-    label: "Class Completion Rate",
-  },
-  {
-    accessor: "graduatedStudents",
-    label: "Graduated Students",
-  }
-] %>
-
-<%= pb_rails("advanced_table", props: {
-  id: "selectable_rows_with_actions",
-  table_data: @table_data_no_subrows,
-  column_definitions: column_definitions,
-  selectable_rows: true,
-  enable_toggle_expansion: "none",
-  show_actions_bar: false
-}) %>

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_header_rails.md

@@ -1 +0,0 @@
-`show_actions_bar` is an optional prop that renders the header at the top showing the row count. This is set to `true` by default but can be toggled off by setting it to `false`

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

@@ -1 +0,0 @@
-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.

data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_exclude_countries.html.erb

@@ -1,4 +0,0 @@
-<%= pb_rails("phone_number_input", props: {
-    initial_country: 'gb',
-    exclude_countries: ['us', 'br']
-}) %>

data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_exclude_countries.jsx

@@ -1,15 +0,0 @@
-import React from 'react'
-import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
-
-const PhoneNumberInputExcludeCountries = (props) => (
-  <>
-    <PhoneNumberInput
-        excludeCountries={['us', 'br']}
-        id='exclude'
-        initialCountry='gb'
-        {...props}
-    />
-  </>
-)
-
-export default PhoneNumberInputExcludeCountries

data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_exclude_countries.md

@@ -1 +0,0 @@
-Excluding countries removes the selected countries from the dropdown.

data/app/pb_kits/playbook/pb_select/docs/_select_custom_select_subheaders.html.erb

@@ -1,12 +0,0 @@
-<%= pb_rails("select", props: { label: "Favorite Animal" }) do %>
-  <select name="animal" id="animal">
-    <optgroup label="Mammal">
-      <option value="1">Cat</option>
-      <option value="2">Dog</option>
-    </optgroup>
-    <optgroup label="Amphibian">
-      <option value="3">Frog</option>
-      <option value="4">Salamander</option>
-    </optgroup>
-  </select>
-<% end %>

data/app/pb_kits/playbook/pb_select/docs/_select_custom_select_subheaders.jsx

@@ -1,31 +0,0 @@
-import React from 'react'
-
-import Select from '../_select'
-
-const SelectCustomSelectSubheaders = (props) => {
-  return (
-    <div>
-      <Select
-          label="Favorite Animal"
-          {...props}
-      >
-        <select
-            id="animal"
-            name="animal"
-            {...props}
-        >
-          <optgroup label="Mammal">
-            <option value="1">{'Cat'}</option>
-            <option value="2">{'Dog'}</option>
-          </optgroup>
-          <optgroup label="Amphibian">
-            <option value="3">{'Frog'}</option>
-            <option value="4">{'Salamander'}</option>
-          </optgroup>
-        </select>
-      </Select>
-    </div>
-  )
-}
-
-export default SelectCustomSelectSubheaders

data/app/pb_kits/playbook/pb_select/docs/_select_custom_select_subheaders.md

@@ -1 +0,0 @@
-To create a select with non-selectable subheaders, use a Custom Select component to render a native `<select>` containing `<optgroup>` elements. The [optgroup HTML element](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/optgroup) groups related options under a non-selectable label in the dropdown.