playbook_ui 14.20.0.pre.alpha.revert4637revert4621PLAY2033atactionbarrails7855 → 14.20.0.pre.rc.0

data/lib/playbook/kit_base.rb

@@ -129,9 +129,9 @@ module Playbook
       end
 
       inline_styles = dynamic_inline_props
-      if inline_styles.present?
-        merged[:style] = merged[:style].present? ? "#{merged[:style]}; #{inline_styles}" : inline_styles
-      end
+      merged[:style] = if inline_styles.present?
+                         merged[:style].present? ? "#{merged[:style]}; #{inline_styles}" : inline_styles
+                       end
 
       merged.deep_merge(data_attributes)
     end

data/lib/playbook/version.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
 module Playbook
-  PREVIOUS_VERSION = "14.20.0"
-  VERSION = "14.20.0.pre.alpha.revert4637revert4621PLAY2033atactionbarrails7855"
+  PREVIOUS_VERSION = "14.19.0"
+  VERSION = "14.20.0.pre.rc.0"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 14.20.0.pre.alpha.revert4637revert4621PLAY2033atactionbarrails7855
+  version: 14.20.0.pre.rc.0
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-05-23 00:00:00.000000000 Z
+date: 2025-05-13 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -347,12 +347,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
@@ -397,8 +393,6 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/scss_partials/_loading.scss
 - app/pb_kits/playbook/pb_advanced_table/scss_partials/_pseudo_states.scss
 - app/pb_kits/playbook/pb_advanced_table/scss_partials/advanced_table_sticky_mixin.scss
-- app/pb_kits/playbook/pb_advanced_table/table_action_bar.html.erb
-- app/pb_kits/playbook/pb_advanced_table/table_action_bar.rb
 - app/pb_kits/playbook/pb_advanced_table/table_body.html.erb
 - app/pb_kits/playbook/pb_advanced_table/table_body.rb
 - app/pb_kits/playbook/pb_advanced_table/table_header.html.erb
@@ -1324,29 +1318,13 @@ files:
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_clear_selection.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_clear_selection.md
+- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_rails.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_rails.md
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_value.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_value.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_error.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_error.jsx
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select.jsx
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_display.jsx
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_display.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_display_rails.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_display_rails.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_rails.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_rails.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_autocomplete.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_autocomplete.jsx
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_autocomplete.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_custom_options.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_custom_options.jsx
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_default.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_default.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_separators_hidden.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_separators_hidden.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.jsx
@@ -1405,7 +1383,6 @@ files:
 - app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownContainer.tsx
 - app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownOption.tsx
 - app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownTrigger.tsx
-- app/pb_kits/playbook/pb_dropdown/subcomponents/MultiSelectTriggerDisplay.tsx
 - app/pb_kits/playbook/pb_dropdown/utilities/clickOutsideHelper.tsx
 - app/pb_kits/playbook/pb_dropdown/utilities/index.ts
 - app/pb_kits/playbook/pb_dropdown/utilities/subComponentHelper.tsx
@@ -3384,8 +3361,6 @@ files:
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_margin_bottom.jsx
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_multi_kit.html.erb
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_multi_kit.jsx
-- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input.jsx
-- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input.md
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.jsx
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.md
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.html.erb
@@ -3592,11 +3567,11 @@ files:
 - app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
 - app/pb_kits/playbook/utilities/text.ts
 - app/pb_kits/playbook/utilities/validEmojiChecker.ts
-- dist/chunks/_typeahead-BmOWdDtp.js
-- dist/chunks/_weekday_stacked-CvcuQyr9.js
+- dist/chunks/_typeahead-BPSIWtFT.js
+- dist/chunks/_weekday_stacked-PfWrqC3z.js
 - dist/chunks/lazysizes-B7xYodB-.js
-- dist/chunks/lib-D5R1BjUn.js
-- dist/chunks/pb_form_validation-BZ2AVAi_.js
+- dist/chunks/lib-B20MXZcW.js
+- dist/chunks/pb_form_validation-WWvUXPKD.js
 - dist/chunks/vendor.js
 - dist/menu.yml
 - dist/playbook-doc.js

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_advanced_table/table_action_bar.html.erb

@@ -1,23 +0,0 @@
-<%= pb_rails("card", props: {
-  border_none: object.is_visible,
-  classname: object.classname,
-  padding: object.is_visible ? "xs" : "none",
-  data: {
-    action_bar: true
-  }
-}) do %>
-  <%= pb_rails("flex", props: { align_items: "center", justify: "between" }) do %>
-    <%= pb_rails("caption", props: { color: "light", padding_left: "xs", size: "xs" }) do %>
-      <span class="selected-count"><%= object.selected_count %> Selected</span>
-    <% end %>
-    <%= pb_rails("flex/flex_item") do %>
-      <%= pb_rails("flex") do %>
-        <% if object.actions.present? %>
-          <% object.actions.each do |action| %>
-            <%= action %>
-          <% end %>
-        <% end %>
-      <% end %>
-    <% end %>
-  <% end %>
-<% end %>

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

@@ -1,19 +0,0 @@
-# frozen_string_literal: true
-
-module Playbook
-  module PbAdvancedTable
-    class TableActionBar < Playbook::KitBase
-      prop :actions, type: Playbook::Props::Array,
-                     default: []
-      prop :is_visible, type: Playbook::Props::Boolean,
-                        default: false
-      prop :selected_count, type: Playbook::Props::Number,
-                            default: 0
-
-      def classname
-        # Just use row-selection-actions-card as the base class
-        generate_classname("row-selection-actions-card", separator: " ")
-      end
-    end
-  end
-end

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_rails.html.erb

@@ -1,31 +0,0 @@
-<% 
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-  ]
-
-%>
-
-<% 
-  options2 = [
-    { label: 'India', value: 'India', id: 'in' },
-    { label: 'Mexico', value: 'Mexico', id: 'mx' },
-    { label: 'Brazil', value: 'Brazil', id: 'br' },
-    { label: 'Argentina', value: 'Argentina', id: 'ar' },
-    { label: 'Colombia', value: 'Colombia', id: 'co' },
-    { label: 'Chile', value: 'Chile', id: 'cl' },
-    { label: 'Peru', value: 'Peru', id: 'pe' },
-  ]
-
-%>
-
-<%= pb_rails("dropdown", props: {options: options}) %>
-
-<script>
-  document.addEventListener("pb:dropdown:selected", (e) => {
-    const option   = e.detail;
-    const dropdown = e.target;
-    console.log("Selected option:", option);
-})
-</script>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_rails.md

@@ -1,5 +0,0 @@
-This kit's `options` prop requires an array of objects, each of which will be used as the selectable options within the dropdown. Each option object can support any number of key-value pairs, but each MUST contain `label`, `value` and `id`. 
-
-The kit also comes with a custom event called "pb:dropdown:selected" which updates dynamically with the selection as it changes. See code snippet to see this in action.
-
-In addition, a data attribute called `data-option-selected` with the selection is also rendered on the parent dropdown div.

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select.jsx

@@ -1,56 +0,0 @@
-import React from 'react'
-import Dropdown from '../../pb_dropdown/_dropdown'
-
-const DropdownMultiSelect = (props) => {
-
-  const options = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-        label: "United Kingdom",
-        value: "United Kingdom",
-    },  
-    {
-      label: "Canada",
-      value: "Canada",
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-    },
-    {
-      label: "India",
-      value: "India",
-    },
-    {
-      label: "Australia",
-      value: "Australia",
-    },
-    {
-      label: "New Zealand",
-      value: "New Zealand",
-    },
-    {
-      label: "Italy",
-      value: "Italy",
-    },
-    {
-      label: "Spain",
-      value: "Spain",
-    }
-  ];  
-
-  return (
-  <div>
-    <Dropdown
-        multiSelect
-        options={options}
-        {...props}
-    />
-  </div>
-  )
-}
-
-export default DropdownMultiSelect

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select.md

@@ -1,3 +0,0 @@
-`multiSelect` is a boolean prop that if set to true will allow for multiple options to be selected from the Dropdown.
-
-`multiSelect` is set to false by default.

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_display.jsx

@@ -1,58 +0,0 @@
-import React from 'react'
-import Dropdown from '../../pb_dropdown/_dropdown'
-
-const DropdownMultiSelectDisplay = (props) => {
-
-  const options = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-        label: "United Kingdom",
-        value: "United Kingdom",
-    },  
-    {
-      label: "Canada",
-      value: "Canada",
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-    },
-    {
-      label: "India",
-      value: "India",
-    },
-    {
-      label: "Australia",
-      value: "Australia",
-    },
-    {
-      label: "New Zealand",
-      value: "New Zealand",
-    },
-    {
-      label: "Italy",
-      value: "Italy",
-    },
-    {
-      label: "Spain",
-      value: "Spain",
-    }
-  ];  
-
-
-  return (
-  <div>
-    <Dropdown
-        formPillProps={{size:"small", color:"neutral"}}
-        multiSelect
-        options={options}
-        {...props}
-    />
-  </div>
-  )
-}
-
-export default DropdownMultiSelectDisplay

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_display.md

@@ -1,3 +0,0 @@
-By default, the `multiSelect` prop will render selected options as the default FormPill. `FormPillProps` however can be used to customize these Pills with any props that exist for the FormPill. 
-
-This prop must be an object that contains valid FormPill props. For a full list of FormPill props, see [here](https://playbook.powerapp.cloud/kits/form_pill/react).

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_display_rails.html.erb

@@ -1,20 +0,0 @@
-<%
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-    { label: 'India', value: 'India', id: 'in' },
-    { label: 'United Kingdom', value: 'United Kingdom', id: 'uk' },
-    { label: 'Australia', value: 'Australia', id: 'au' },
-    { label: 'New Zealand', value: 'New Zealand', id: 'nz' },
-    { label: 'Germany', value: 'Germany', id: 'de' },
-    { label: 'France', value: 'France', id: 'fr' },
-    { label: 'Italy', value: 'Italy', id: 'it' },
-  ]
-%>
-
-<%= pb_rails("dropdown", props: {
-  options: options,
-  multi_select: true,
-  form_pill_props: { size:"small", color:"neutral" },
-}) %>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_display_rails.md

@@ -1 +0,0 @@
-By default, the `multi_select` prop will render selected options as the default form_pill. `form_pill_props` however can be used to customize these Pills with props that exist for the form_pill. Currently, only the '[color](https://playbook.powerapp.cloud/kits/form_pill/rails#form-pill-colors)' and '[size](https://playbook.powerapp.cloud/kits/form_pill/rails#form-pill-size)' props are supported as shown here.

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_rails.html.erb

@@ -1,19 +0,0 @@
-<%
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-    { label: 'India', value: 'India', id: 'in' },
-    { label: 'United Kingdom', value: 'United Kingdom', id: 'uk' },
-    { label: 'Australia', value: 'Australia', id: 'au' },
-    { label: 'New Zealand', value: 'New Zealand', id: 'nz' },
-    { label: 'Germany', value: 'Germany', id: 'de' },
-    { label: 'France', value: 'France', id: 'fr' },
-    { label: 'Italy', value: 'Italy', id: 'it' },
-  ]
-%>
-
-<%= pb_rails("dropdown", props: {
-  options: options,
-  multi_select: true,
-}) %>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_rails.md

@@ -1,3 +0,0 @@
-`multi_select` is a boolean prop that if set to true will allow for multiple options to be selected from the Dropdown.
-
-`multi_select` is set to false by default.

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_autocomplete.html.erb

@@ -1,20 +0,0 @@
-<%
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-    { label: 'India', value: 'India', id: 'in' },
-    { label: 'United Kingdom', value: 'United Kingdom', id: 'uk' },
-    { label: 'Australia', value: 'Australia', id: 'au' },
-    { label: 'New Zealand', value: 'New Zealand', id: 'nz' },
-    { label: 'Germany', value: 'Germany', id: 'de' },
-    { label: 'France', value: 'France', id: 'fr' },
-    { label: 'Italy', value: 'Italy', id: 'it' },
-  ]
-%>
-
-<%= pb_rails("dropdown", props: {
-  autocomplete: true,
-  options: options,
-  multi_select: true,
-}) %>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_autocomplete.jsx

@@ -1,57 +0,0 @@
-import React from 'react'
-import Dropdown from '../../pb_dropdown/_dropdown'
-
-const DropdownMultiSelectWithAutocomplete = (props) => {
-
-  const options = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-        label: "United Kingdom",
-        value: "United Kingdom",
-    },  
-    {
-      label: "Canada",
-      value: "Canada",
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-    },
-    {
-      label: "India",
-      value: "India",
-    },
-    {
-      label: "Australia",
-      value: "Australia",
-    },
-    {
-      label: "New Zealand",
-      value: "New Zealand",
-    },
-    {
-      label: "Italy",
-      value: "Italy",
-    },
-    {
-      label: "Spain",
-      value: "Spain",
-    }
-  ];  
-
-  return (
-  <div>
-    <Dropdown
-        autocomplete
-        multiSelect
-        options={options}
-        {...props}
-    />
-  </div>
-  )
-}
-
-export default DropdownMultiSelectWithAutocomplete

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_autocomplete.md

@@ -1 +0,0 @@
-`multiSelect` can also be used with the `autocomplete` functionality.