playbook_ui_docs 13.27.0.pre.alpha.testingcollapsible2917 → 13.27.0

metadata

@@ -1,15 +1,15 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui_docs
 version: !ruby/object:Gem::Version
-  version: 13.27.0.pre.alpha.testingcollapsible2917
+  version: 13.27.0
 platform: ruby
 authors:
 - Power UX
 - Power Devs
-autorequire: 
+autorequire:
 bindir: bin
 cert_chain: []
-date: 2024-05-16 00:00:00.000000000 Z
+date: 2024-05-06 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: playbook_ui
@@ -61,10 +61,8 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/docs/index.js
 - app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.html.erb
 - app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.jsx
-- app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.md
 - app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.html.erb
 - app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.jsx
-- app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.md
 - app/pb_kits/playbook/pb_avatar/docs/_avatar_default.html.erb
 - app/pb_kits/playbook/pb_avatar/docs/_avatar_default.jsx
 - app/pb_kits/playbook/pb_avatar/docs/_avatar_default_swift.md
@@ -352,10 +350,6 @@ files:
 - app/pb_kits/playbook/pb_collapsible/docs/_collapsible_color.jsx
 - app/pb_kits/playbook/pb_collapsible/docs/_collapsible_color.md
 - app/pb_kits/playbook/pb_collapsible/docs/_collapsible_colors_swift.md
-- app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main.jsx
-- app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main.md
-- app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_rails.html.erb
-- app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_rails.md
 - app/pb_kits/playbook/pb_collapsible/docs/_collapsible_default.html.erb
 - app/pb_kits/playbook/pb_collapsible/docs/_collapsible_default.jsx
 - app/pb_kits/playbook/pb_collapsible/docs/_collapsible_default_swift.md
@@ -611,29 +605,25 @@ files:
 - 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_subcomponent_structure.html.erb
 - 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_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
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.md
+- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display_rails.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display_rails.md
+- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options_rails.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options_rails.md
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.md
+- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.html.erb
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.md
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger_rails.html.erb
-- app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger_rails.md
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_external_control.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_hook.jsx
 - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.html.erb
@@ -1859,7 +1849,7 @@ homepage: https://playbook.powerapp.cloud/
 licenses:
 - ISC
 metadata: {}
-post_install_message: 
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -1875,7 +1865,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubygems_version: 3.5.3
-signing_key: 
+signing_key:
 specification_version: 4
 summary: Playbook Design System Docs
 test_files: []

data/app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.md

@@ -1,3 +0,0 @@
-NOTE: All `componentOverlay` implementations require a `placement` prop, that accepts any of the following values: `top-right`, `top-left`, `bottom-right`, `bottom-left`, `top-center`, `bottom-center`, `left-center`, and `right-center`.
-
-When passing the `badge` component as an overlay, you must also specify its text content,and you may optionally control the color by passing an [approved value](https://playbook.powerapp.cloud/kits/badge#colors) as a `variant`.

data/app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.md

@@ -1,3 +0,0 @@
-NOTE: All `componentOverlay` implementations require a `placement` prop, that accepts any of the following values: `top-right`, `top-left`, `bottom-right`, `bottom-left`, `top-center`, `bottom-center`, `left-center`, and `right-center`.
-
-When passing the `iconCircle` component as an overlay, you must also specify an `icon`, and you may optionally control the color by passing an [approved value](https://playbook.powerapp.cloud/kits/icon_circle/rails#color) as a `variant`.

data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main.jsx

@@ -1,73 +0,0 @@
-import React from 'react'
-import { Collapsible, useCollapsible, Background, Flex, Title, List, ListItem } from '../..'
-
-const CollapsibleCustomMain = () => {
-  const [isCollapsed, setIsCollapsed] = useCollapsible(true)
-
-  return (
-  <>
-    <Collapsible
-        collapsed={isCollapsed}
-    >
-          <Background 
-              backgroundColor="white" 
-              cursor="pointer"
-              htmlOptions={{onClick:() => setIsCollapsed(!isCollapsed)}}
-              position="sticky" 
-              top="0" 
-          >
-              <Flex 
-                  align="center" 
-                  gap="sm"
-                  justify="between" 
-              >
-                <Title 
-                    size={4} 
-                    text="Custom Main Section" 
-                />
-                <Collapsible.Icon collapsed={isCollapsed}/>
-              </Flex>
-          </Background>
-      <Collapsible.Content padding="none">
-          <div>
-          <List>
-              <ListItem 
-                  align="stretch"
-                  flexDirection="column" 
-              >
-                Checklist item
-              </ListItem>
-              <ListItem 
-                  align="stretch"
-                  flexDirection="column" 
-              >
-                Checklist item
-              </ListItem>
-              <ListItem 
-                  align="stretch"
-                  flexDirection="column" 
-              >
-                Checklist item
-              </ListItem>
-              <ListItem 
-                  align="stretch"
-                  flexDirection="column" 
-              >
-                Checklist item
-              </ListItem>
-              <ListItem 
-                  align="stretch"
-                  flexDirection="column" 
-              >
-                Checklist item
-              </ListItem>
-            </List>
-          </div>
-      </Collapsible.Content>
-    </Collapsible>
-   
-  </>
-  )
-}
-
-export default CollapsibleCustomMain

data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main.md

@@ -1,5 +0,0 @@
-A custom Main section can also be used in place of the provided `Collapsible.Main`. This gives devs full control over that subcomponent. For example, here we are using global props to make that custom Main 'sticky' on scroll.
-
-If a custom component is used in place of the default, devs must handle collapsible toggling themselves via the useCollapsible hook as seen in this example.
-
-The default Collapsible icon can also be used as part of the custom Main as shown, you will need to pass the Collapsible state to the `collapsed` prop on the optional `Collapsible.Icon`.

data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_rails.html.erb

@@ -1,20 +0,0 @@
-<%= pb_rails("collapsible", props: { name: "default-example" }) do %>
-    <%= pb_rails("background", props: { background_color: "white", position: "sticky", top: "0", cursor:"pointer", data: {"collapsible-main": "true"} }) do %>
-      <%= pb_rails("flex", props: {align:"center", gap:"sm", justify:"between"}) do %>
-        <%= pb_rails("title", props: { text: "Custom Main Section", tag: "h4", size: 4 }) %>
-    <%= pb_rails("collapsible/collapsible_icon") %>
-     <% end %>
-      <% end %>
-     <%= pb_rails("flex", props: { align: "center", justify: "between" }) do %>
-    <% end %>
-      <%= pb_rails("collapsible/collapsible_content", props: { padding: "none"  }) do %>
-        <%= pb_rails("list", props: {ordered: false, dark: false, borderless: false}) do %>
-            <%= pb_rails("list/item") do %> Checklist Item <% end %>
-            <%= pb_rails("list/item") do %> Checklist Item <% end %>
-            <%= pb_rails("list/item") do %> Checklist Item <% end %>
-            <%= pb_rails("list/item") do %> Checklist Item <% end %>
-            <%= pb_rails("list/item") do %> Checklist Item <% end %>
-            <% end %>
-      <% end %>
-    <% end %>
-    

data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_rails.md

@@ -1,5 +0,0 @@
-A custom Main section can also be used in place of the provided `collapsible/collapsible_main`. This gives devs full control over that subcomponent. For example, here we are using global props to make that custom Main 'sticky' on scroll.
-
-If a custom component is used in place of the default, devs must add `data: {"collapsible-main": "true"}` to the custom Main for toggling of the collapsible to work correctly.
-
-The default Collapsible icon can also be used as part of the custom Main as shown with the optional  `collapsible/collapsible_icon`. This optional subcomponent accepts all icon related props `color`, `icon` and `size`.

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

@@ -1,6 +0,0 @@
-The dropdown is built using all of the following required subcomponents:
-
-`dropdown/dropdown_trigger` is the UI component that users interact with to toggle the dropdown. 
-`dropdown/dropdown_container` is the floating container that wraps the list of dropdown options.
-`dropdown/dropdown_option` renders options that are passed to the container. 
-Each of these subcomponents can be altered using global props and/or their respective props. See doc examples below for more information on each.

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

@@ -1,5 +0,0 @@
-Optionally utilize `custom_display` on the `dropdown/dropdown_trigger` subcomponent to customize its content after an option is selected. The component passed to custom_display will be rendered to the left of the default text-based display. In this example the Avatar kit is being used.
-
-The `placeholder` prop can also be used to customize the placeholder text for the default `dropdown/dropdown_trigger`. 
-
-The dropdown follows the typical rails pattern of utilizing hidden inputs for form submission. The hidden input value is the selected options' id.

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

@@ -1 +0,0 @@
-`dropdown/dropdown_option` subcomponent accepts any child components to customize the options' contents and display. By default, options are Body kit text that is set by the `label` value from the `option` object.

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

@@ -1 +0,0 @@
-Optionally replace the default trigger's select element by passing child components directly to the `dropdown/dropdown_trigger`.