playbook_ui 14.5.0.pre.alpha.PLAY1485selectablecardoverflowoutlinebug4216 → 14.5.0.pre.alpha.PLAY1486highchartscssdrivenPOC3930

data/lib/playbook/kit_base.rb

@@ -73,10 +73,6 @@ module Playbook
     prop :aria, type: Playbook::Props::HashProp, default: {}
     prop :html_options, type: Playbook::Props::HashProp, default: {}
     prop :children, type: Playbook::Props::Proc
-    prop :style, type: Playbook::Props::HashProp, default: {}
-    prop :height
-    prop :min_height
-    prop :max_height
 
     def object
       self
@@ -86,14 +82,6 @@ module Playbook
       default_html_options.merge(html_options.deep_merge(data_attributes))
     end
 
-    def global_inline_props
-      {
-        height: height,
-        min_height: min_height,
-        max_height: max_height,
-      }.compact
-    end
-
     # rubocop:disable Layout/CommentIndentation
     # pb_content_tag information (potentially to be abstracted into its own dev doc in the future)
     # The pb_content_tag generates HTML content tags for rails kits with flexible options.
@@ -125,15 +113,12 @@ module Playbook
   private
 
     def default_options
-      options = {
+      {
         id: id,
         data: data,
         class: classname,
         aria: aria,
       }
-      inline_styles = dynamic_inline_props
-      options[:style] = inline_styles if inline_styles.present?
-      options
     end
 
     def default_html_options
@@ -146,10 +131,5 @@ module Playbook
         aria: aria,
       }.transform_keys { |key| key.to_s.tr("_", "-").to_sym }
     end
-
-    def dynamic_inline_props
-      styles = global_inline_props.map { |key, value| "#{key.to_s.gsub('_', '-')}: #{value};" if value.present? }.compact
-      styles.join(" ").presence
-    end
   end
 end

data/lib/playbook/pb_doc_helper.rb

@@ -45,7 +45,7 @@ module Playbook
 
     # rubocop:disable Naming/AccessorMethodName
     def get_kits
-      menu = ActiveSupport::ConfigurationFile.parse(Playbook::Engine.root.join("dist/menu.yml"))
+      menu = YAML.load_file(Playbook::Engine.root.join("dist/menu.yml"))
       all_kits = []
       menu["kits"].each do |kit|
         kit_name = kit["name"]
@@ -61,7 +61,7 @@ module Playbook
     end
 
     def get_kits_pb_website
-      menu = ActiveSupport::ConfigurationFile.parse(Rails.root.join("config/menu.yml"))
+      menu = YAML.load_file(Rails.root.join("config/menu.yml"))
       menu["kits"]
     end
     # rubocop:enable Naming/AccessorMethodName
@@ -84,9 +84,9 @@ module Playbook
     def pb_doc_kit_examples(kit, type)
       example_file = pb_doc_kit_path(kit, "example.yml")
       if File.exist?(example_file)
-        ActiveSupport::ConfigurationFile.parse(example_file)
-                                        .transform_keys(&:to_sym)
-                                        .dig(:examples, type) || []
+        examples_list = YAML.load_file(example_file)
+                            .inject({}) { |item, (k, v)| item[k.to_sym] = v; item }
+        examples_list.dig(:examples, type) || []
       else
         []
       end

data/lib/playbook/pb_forms_helper.rb

@@ -22,10 +22,9 @@ module Playbook
     # @param data [Hash] hash of data attributes
     # @param validate [Boolean] whether validation should be triggered or not
     # @see [#form_with] for other options
-    def pb_form_with(data: {}, validate: false, loading: false, **kwargs, &block)
+    def pb_form_with(data: {}, validate: false, **kwargs, &block)
       data = data.merge("pb-form-validation" => validate)
       classname = ["pb-form", kwargs[:class]].join(" ")
-      classname += " pb_form_loading" if loading
       options = kwargs.merge(
         class: classname,
         data: data,
@@ -34,7 +33,6 @@ module Playbook
 
       content_for(:pb_js, javascript_tag(<<~JS))
         window.addEventListener("DOMContentLoaded", function() { PbFormValidation.start() })
-        window.addEventListener("DOMContentLoaded", () => formHelper())
       JS
 
       form_with(**options, &block)

data/lib/playbook/version.rb

@@ -2,5 +2,5 @@
 
 module Playbook
   PREVIOUS_VERSION = "14.5.0"
-  VERSION = "14.5.0.pre.alpha.PLAY1485selectablecardoverflowoutlinebug4216"
+  VERSION = "14.5.0.pre.alpha.PLAY1486highchartscssdrivenPOC3930"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui
 version: !ruby/object:Gem::Version
-  version: 14.5.0.pre.alpha.PLAY1485selectablecardoverflowoutlinebug4216
+  version: 14.5.0.pre.alpha.PLAY1486highchartscssdrivenPOC3930
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-10-23 00:00:00.000000000 Z
+date: 2024-10-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: actionpack
@@ -268,8 +268,6 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta_subrow_headers.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.md
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell.jsx
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.jsx
@@ -1128,8 +1126,6 @@ files:
 - app/pb_kits/playbook/pb_dropdown/context/index.tsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection.html.erb
 - 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
@@ -1137,15 +1133,10 @@ files:
 - 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_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
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.md
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure_rails.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure_rails.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subtle_variant.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subtle_variant.jsx
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subtle_variant.md
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.md
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.jsx
@@ -1242,10 +1233,6 @@ files:
 - app/pb_kits/playbook/pb_filter/docs/_filter_placement.html.erb
 - app/pb_kits/playbook/pb_filter/docs/_filter_placement.jsx
 - app/pb_kits/playbook/pb_filter/docs/_filter_placement.md
-- app/pb_kits/playbook/pb_filter/docs/_filter_popover_props.html.erb
-- app/pb_kits/playbook/pb_filter/docs/_filter_popover_props.jsx
-- app/pb_kits/playbook/pb_filter/docs/_filter_popover_props_rails.md
-- app/pb_kits/playbook/pb_filter/docs/_filter_popover_props_react.md
 - app/pb_kits/playbook/pb_filter/docs/_filter_single.html.erb
 - app/pb_kits/playbook/pb_filter/docs/_filter_single.jsx
 - app/pb_kits/playbook/pb_filter/docs/_sort_only.html.erb
@@ -1333,13 +1320,10 @@ files:
 - app/pb_kits/playbook/pb_form/docs/_description.md
 - app/pb_kits/playbook/pb_form/docs/_footer.md
 - app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb
-- app/pb_kits/playbook/pb_form/docs/_form_form_with_loading.html.erb
-- app/pb_kits/playbook/pb_form/docs/_form_form_with_loading.md
 - app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb
 - app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.md
 - app/pb_kits/playbook/pb_form/docs/example.yml
 - app/pb_kits/playbook/pb_form/form.rb
-- app/pb_kits/playbook/pb_form/formHelper.js
 - app/pb_kits/playbook/pb_form/pb_form_validation.js
 - app/pb_kits/playbook/pb_form_group/_form_group.scss
 - app/pb_kits/playbook/pb_form_group/_form_group.tsx
@@ -1380,9 +1364,6 @@ files:
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_size.jsx
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_tag.html.erb
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_tag.jsx
-- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.html.erb
-- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx
-- app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.md
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_user.html.erb
 - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_user.jsx
 - app/pb_kits/playbook/pb_form_pill/docs/example.yml
@@ -1812,7 +1793,6 @@ files:
 - app/pb_kits/playbook/pb_multi_level_select/_helper_functions.tsx
 - app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.scss
 - app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx
-- app/pb_kits/playbook/pb_multi_level_select/context/index.tsx
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color.html.erb
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color.jsx
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color_rails.md
@@ -1820,8 +1800,6 @@ files:
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_default.html.erb
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_default.jsx
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_default.md
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_reset.html.erb
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_reset.md
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_return_all_selected.html.erb
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_return_all_selected.jsx
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_return_all_selected.md
@@ -1835,17 +1813,12 @@ files:
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_single_children_only.html.erb
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_single_children_only.jsx
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_single_children_only.md
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_with_children.jsx
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_with_children.md
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_with_children_with_radios.jsx
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_with_children_with_radios.md
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_with_form.html.erb
 - app/pb_kits/playbook/pb_multi_level_select/docs/example.yml
 - app/pb_kits/playbook/pb_multi_level_select/docs/index.js
 - app/pb_kits/playbook/pb_multi_level_select/multi_level_select.html.erb
 - app/pb_kits/playbook/pb_multi_level_select/multi_level_select.rb
 - app/pb_kits/playbook/pb_multi_level_select/multi_level_select.test.jsx
-- app/pb_kits/playbook/pb_multi_level_select/multi_level_select_options.tsx
 - app/pb_kits/playbook/pb_multiple_users/_multiple_users.scss
 - app/pb_kits/playbook/pb_multiple_users/_multiple_users.tsx
 - app/pb_kits/playbook/pb_multiple_users/docs/_description.md
@@ -1875,8 +1848,6 @@ files:
 - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_default.jsx
 - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_default_swift.md
 - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_props_swift.md
-- app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_size.html.erb
-- app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_size.jsx
 - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_small_swift.md
 - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_xsmall_swift.md
 - app/pb_kits/playbook/pb_multiple_users_stacked/docs/example.yml
@@ -3099,11 +3070,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-BhHnXJjy.js
-- dist/chunks/_weekday_stacked-B9Sy5PN8.js
+- dist/chunks/_typeahead-BywvWGAm.js
+- dist/chunks/_weekday_stacked-5OGZKZeo.js
 - dist/chunks/lazysizes-B7xYodB-.js
-- dist/chunks/lib-D-mTv-kp.js
-- dist/chunks/pb_form_validation-BkWGwJsl.js
+- dist/chunks/lib-DMOmCoAX.js
+- dist/chunks/pb_form_validation-Dna2I7fw.js
 - dist/chunks/vendor.js
 - dist/menu.yml
 - dist/playbook-doc.js

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell.jsx

@@ -1,72 +0,0 @@
-import React from "react"
-import { AdvancedTable, Pill, Body, Flex, Detail, Caption } from "playbook-ui"
-import MOCK_DATA from "./advanced_table_mock_data.json"
-
-const AdvancedTableCustomCell = (props) => {
-  const columnDefinitions = [
-    {
-      accessor: "year",
-      label: "Year",
-      cellAccessors: ["quarter", "month", "day"],
-
-    },
-    {
-      accessor: "newEnrollments",
-      label: "New Enrollments",
-      customRenderer: (row, value) => (
-        <Pill text={value} 
-            variant="success"    
-        />
-      ), 
-    },
-    {
-      accessor: "scheduledMeetings",
-      label: "Scheduled Meetings",
-      customRenderer: (row, value) => <Body><a href="#">{value}</a></Body>, 
-    },
-    {
-      accessor: "attendanceRate",
-      label: "Attendance Rate",
-      customRenderer: (row, value) => (
-        <Flex alignItems="end" 
-            orientation="column"
-        >
-          <Detail bold 
-              color="default" 
-              text={value} 
-          />
-          <Caption size="xs">{row.original.graduatedStudents}</Caption>
-        </Flex>
-      ),
-    },
-    {
-      accessor: "completedClasses",
-      label: "Completed Classes",
-    },
-    {
-      accessor: "classCompletionRate",
-      label: "Class Completion Rate",
-    },
-    {
-      accessor: "graduatedStudents",
-      label: "Graduated Students",
-    },
-  ]
-
-  return (
-    <div>
-      <AdvancedTable
-          columnDefinitions={columnDefinitions}
-          enableToggleExpansion="all"
-          responsive="none"
-          tableData={MOCK_DATA}
-          {...props}
-      >
-        <AdvancedTable.Header enableSorting />
-        <AdvancedTable.Body />
-      </AdvancedTable>
-    </div>
-  )
-}
-
-export default AdvancedTableCustomCell

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

@@ -1,5 +0,0 @@
-The Advanced Table also allows for rendering custom components within individual Cells. To achieve this, you can make use of the optional `customRenderer` item within each columnDefinition. This function gives you access to the current Cell's value if you just want to use that with a custom Kit, but it also gives you access to the entire `row` object. The row object provides all data for the current row. To access the data, use `row.original` which is the entire data object for the current row. See the code snippet below for 3 separate use cases and how they were acheived. 
-
-See [here](https://playbook.powerapp.cloud/kits/advanced_table/react#columnDefinitions) for more indepth information on columnDefinitions are how to use them.
-
-See [here](https://github.com/powerhome/playbook/tree/master/playbook/app/pb_kits/playbook/pb_advanced_table#readme) for the structure of the tableData used.

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

@@ -1,45 +0,0 @@
-import React, { useRef } from 'react'
-import { Button, Dropdown } from 'playbook-ui'
-
-const options = [
-    {
-        label: "United States",
-        value: "United States",
-    },
-    {
-        label: "Canada",
-        value: "Canada",
-    },
-    {
-        label: "Pakistan",
-        value: "Pakistan",
-    }
-]
-
-const DropdownClearSelection = (props) => {
-    const dropdownRef = useRef(null)
-
-    const handleReset = () => {
-        if (dropdownRef.current) {
-            dropdownRef.current.clearSelected()
-        }
-    }
-
-    return (
-        <>
-            <Dropdown
-                defaultValue={options[2]}
-                options={options}
-                ref={dropdownRef}
-                {...props}
-            />
-            <Button
-                marginTop="md"
-                onClick={handleReset}
-                text="Reset"
-            />
-        </>
-    )
-}
-
-export default DropdownClearSelection

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

@@ -1 +0,0 @@
-To use an external control (like a reset button) to clear Dropdown selection, you can make use of the `useRef` hook. You must pass a ref to the Dropdown component and use that ref within the onClick for the external control in the way shown in the code snippet below.

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

@@ -1,9 +0,0 @@
-<% 
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-  ]
-
-%>
-<%= pb_rails("dropdown", props: {options: options, separators: false}) %>

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

@@ -1,33 +0,0 @@
-import React from 'react'
-import { Dropdown } from 'playbook-ui'
-
-const DropdownSeparatorsHidden = (props) => {
-
-  const options = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-      label: "Canada",
-      value: "Canada",
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-    }
-  ];  
-
-
-  return (
-  <div>
-    <Dropdown
-        options={options}
-        separators={false}
-        {...props}
-    />
-  </div>
-  )
-}
-
-export default DropdownSeparatorsHidden

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

@@ -1,10 +0,0 @@
-<% 
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-  ]
-
-%>
-
-<%= pb_rails("dropdown", props: { options: options, variant: "subtle", separators: false }) %>

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

@@ -1,34 +0,0 @@
-import React from 'react'
-import { Dropdown } from 'playbook-ui'
-
-const DropdownSubtleVariant = (props) => {
-
-  const options = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-      label: "Canada",
-      value: "Canada",
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-    }
-  ];  
-
-
-  return (
-  <>
-     <Dropdown
-         options={options}
-         separators={false}
-         variant="subtle"
-         {...props}
-    />
-  </>
-  )
-}
-
-export default DropdownSubtleVariant

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

@@ -1 +0,0 @@
-For the `subtle` variant, it is recommended that you set the `Separators` prop to `false` to remove the separator lines between the options for a more cleaner look.

data/app/pb_kits/playbook/pb_filter/docs/_filter_popover_props.html.erb

@@ -1,41 +0,0 @@
-<%=
-  pb_rails("filter", props: {
-    id: "filter_popover_props",
-    position: "top",
-    filters: [
-      { name: "name", value: "John Wick" },
-      { name: "city", value: "San Francisco"}
-    ],
-    sort_menu: [
-      { item: "Popularity", link: "?q[sorts]=managers_popularity+asc", active: true, direction: "desc" },
-      { item: "Mananger's Title", link: "?q[sorts]=managers_title+asc", active: false },
-      { item: "Manager's Name", link: "?q[sorts]=managers_name+asc", active: false },
-    ],
-    template: "default",
-    results: 1,
-    popover_props: { width: "250px" },
-  }) do
-%>
-  <%
-   example_collection = [
-      OpenStruct.new(name: "USA", value: 1),
-      OpenStruct.new(name: "Canada", value: 2),
-      OpenStruct.new(name: "Brazil", value: 3),
-      OpenStruct.new(name: "Philippines", value: 4),
-      OpenStruct.new(name: "A galaxy far far away, like really far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far away...", value: 5)
-    ]
-  %>
-  <%= pb_rails("form", props: { form_system_options: { scope: :example, method: :get } }) do |form| %>
-    <%= form.text_field :example_text_field, props: { label: true } %>
-    <%= form.collection_select :example_collection_select, example_collection, :value, :name, props: {max_width: "sm", label: true } %>
-
-    <%= form.actions do |action| %>
-      <%= action.submit props: {
-        text: "Apply",
-        data: {
-          disable_with: "pb_rails('icon', props: { icon: 'spinner', spin: true, fixed_width: true })Searching...".html_safe
-      },}%>
-      <%= action.button props: { type: "reset", text: "Clear", variant: "secondary" } %>
-    <% end %>
-  <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_filter/docs/_filter_popover_props.jsx

@@ -1,71 +0,0 @@
-import React from 'react'
-import { Button, Filter, Flex, Select, TextInput } from 'playbook-ui'
-
-const FilterPopoverProps = (props) => {
-  const options = [
-    { value: 'USA' },
-    { value: 'Canada' },
-    { value: 'Brazil' },
-    { value: 'Philippines' },
-    { value: 'A galaxy far far away, like really far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far far away...' },
-  ]
-
-  const popoverProps = {
-    width: "250px"
-  }
-
-  return (
-    <Filter
-        {...props}
-        double
-        filters={{
-          'Full Name': 'John Wick',
-          'City': 'San Francisco',
-        }}
-        popoverProps={popoverProps}
-        results={1}
-        sortOptions={{
-          popularity: 'Popularity',
-          // eslint-disable-next-line
-          manager_title: 'Manager\'s Title',
-          // eslint-disable-next-line
-          manager_name: 'Manager\'s Name',
-        }}
-        sortValue={[{ name: 'popularity', dir: 'desc' }]}
-    >
-      {({ closePopover }) => (
-        <form>
-          <TextInput
-              label="Example Text Field"
-              placeholder="Enter Text"
-              {...props}
-          />
-          <Select
-              blankSelection="Select One..."
-              label="Example Collection Select"
-              name="Collection Select"
-              options={options}
-              {...props}
-          />
-          <Flex
-              spacing="between"
-              {...props}
-          >
-            <Button
-                onClick={closePopover}
-                text="Apply"
-                {...props}
-            />
-            <Button
-                text="Clear"
-                variant="secondary"
-                {...props}
-            />
-          </Flex>
-        </form>
-      )}
-    </Filter>
-  )
-}
-
-export default FilterPopoverProps

data/app/pb_kits/playbook/pb_filter/docs/_filter_popover_props_rails.md

@@ -1 +0,0 @@
-This kit uses the [Popover kit](https://playbook.powerapp.cloud/kits/popover) under the hood for the Filter Popover which comes with its own set of props. If you want to apply certain Popover props to that underlying kit, you can do so by using the optional `popover_props` prop. This prop must be an object that contains valid Popover props. For a full list of Popover props, see [here](https://playbook.powerapp.cloud/kits/popover).

data/app/pb_kits/playbook/pb_filter/docs/_filter_popover_props_react.md

@@ -1 +0,0 @@
-This kit uses the [Popover kit](https://playbook.powerapp.cloud/kits/popover/react) under the hood for the Filter Popover which comes with its own set of props. If you want to apply certain Popover props to that underlying kit, you can do so by using the optional `popoverProps` prop. This prop must be an object that contains valid Popover props. For a full list of Popover props, see [here](https://playbook.powerapp.cloud/kits/popover/react).

data/app/pb_kits/playbook/pb_form/docs/_form_form_with_loading.html.erb

@@ -1,39 +0,0 @@
-<%= pb_form_with(scope: :example, url: "", method: :get, loading: true) do |form| %>
-  <%= form.text_field :example_text_field, props: { label: true } %>
-
-  <%= form.actions do |action| %>
-    <%= action.submit %>
-    <%= action.button props: { type: "reset", text: "Cancel", variant: "secondary" } %>
-  <% end %>
-<% end %>
-
-<script>
-    const loadingForm = document.querySelector(".pb_form_loading")
-    if (loadingForm) {
-        loadingForm.addEventListener("submit", function(event) {
-            event.preventDefault();
-
-            const submitButton = event['submitter'];
-            const cancelButton = event['target'].querySelector('button[type="reset"]');
-
-            if (submitButton) {
-                let currentClass = submitButton.className;
-                let newClass = currentClass.replace("_disabled_loading", "_enabled");
-
-                let cancelClass = cancelButton ? cancelButton.className : "";
-                let newCancelClass = cancelClass.replace("_disabled", "_enabled");
-
-                setTimeout(function() {
-                    submitButton.disabled = false;
-                    submitButton.className = currentClass;
-
-                    if (cancelButton) {
-                        cancelButton.disabled = false;
-                        cancelButton.className = cancelClass;
-                    }
-                }, 5000);
-            }
-        });
-    }
-</script>
-

data/app/pb_kits/playbook/pb_form/docs/_form_form_with_loading.md

@@ -1 +0,0 @@
-Pressing Submit will trigger a loading state where the button content is replaced by a spinner icon and the submit button will be disabled.