playbook_ui_docs 14.13.0.pre.alpha.play1852reacthookformsupportradio6153 → 14.13.0.pre.alpha.play1884progresspill6064

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3393153e2793cb10818f94490610143ff831b218ceec5643e6e6667532f0f1e5
-  data.tar.gz: 4c5f2d93d79ba625e0e5cde9160a0e7f14badee4db49bc35e8a4a7947fcc5bac
+  metadata.gz: 3c83f0eacac679528c2c2b5b8d0ad2d4d6eb2582a2ec60d33256bd3874d2eb26
+  data.tar.gz: 29c3865d4cf0e46f7ab0e48ea00c5657aa1c1358caef530dccad9d810d63bfc7
 SHA512:
-  metadata.gz: 3d63ba0cdad65ac4ffa2bf8f6f55699c46aa7bec7063f3fe34f780246f89197c6d8acb0965b0aa3c6d09a9b07257d2b5628613d296ea1ae44e2c51e015b71caa
-  data.tar.gz: 4976ec01cb4495e95701abf93424e4f21e516d2e42ff6f8f6b52c960d71b8d8f745352ce00b8426a546594d63d3eb29fe87e4dab9482ce6db399ee75e25346de
+  metadata.gz: 3b7b52717bc8fbdc2cff62d3f936c2c73d6d5f94c8577674eecaf53f14a449a8ddc160367c7e925110191e0d36526052ec13319d31f2debb75b069e848268cb6
+  data.tar.gz: 75b97ba73ec196d36ddb7a1ea38311618d630ecb829c23702d2c8a02148162c378ca44009dce3cfdd493f1e1e1885b6bb61fcf714eabc7096aa4045998dd2dab

data/app/pb_kits/playbook/pb_bar_graph/docs/example.yml

@@ -17,7 +17,6 @@ examples:
 
   react:
   - bar_graph_default: Default
-  - bar_graph_pb_styles: Playbook Styles
   - bar_graph_legend: Legend
   - bar_graph_legend_position: Legend Position
   - bar_graph_legend_non_clickable: Legend Non Clickable

data/app/pb_kits/playbook/pb_bar_graph/docs/index.js

@@ -10,4 +10,3 @@ export { default as BarGraphStacked } from './_bar_graph_stacked.jsx'
 export { default as BarGraphNegativeNumbers } from './_bar_graph_negative_numbers.jsx'
 export { default as BarGraphSecondaryYAxis } from './_bar_graph_secondary_y_axis.jsx'
 export { default as BarGraphHorizontal } from './_bar_graph_horizontal.jsx'
-export { default as BarGraphPbStyles } from './_bar_graph_pb_styles.jsx'

data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.html.erb

@@ -43,9 +43,9 @@
       <% end %>
     <% end %>
 
-    <%= pb_rails("table/table_body", props: {draggable_container: true}) do %>
+    <%= pb_rails("draggable/draggable_container", props: {tag:"tbody"}) do %>
       <% initial_items.each do |item| %>
-        <%= pb_rails("table/table_row", props:{drag_id: item[:id], draggable_item: true}) do %>
+        <%= pb_rails("draggable/draggable_item", props:{drag_id: item[:id], tag:"tr"}) do %>
           <%= pb_rails("table/table_cell", props: { text: item[:id]}) %>
           <%= pb_rails("table/table_cell") do %>
             <%= pb_rails("flex", props:{align:"center"}) do %>

data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.md

@@ -1,4 +1 @@
-The draggable kit can also be used in conjunction with the table kit to create draggable table rows. To do this:
-
-- use the `draggable_container` prop on the table/table_body to designate it as the Draggable Container
-- use the `draggable_item` prop on the table/table_row to designate it as the Draggable Item. Make sure to also pass id to the `drag_id` prop here. 
+The draggable kit can also be used in conjunction with the table kit to create draggable table rows. To do this, make use of the `tag` prop on the draggable_container to set it to 'tbody' and the same prop on the draggable_item to set that to 'tr'. This will create the functionality seen here. 

data/app/pb_kits/playbook/pb_draggable/docs/example.yml

@@ -4,9 +4,7 @@ examples:
   - draggable_with_list: Draggable with List Kit
   - draggable_with_selectable_list: Draggable with SelectableList Kit
   - draggable_with_cards: Draggable with Cards
-  - draggable_with_table_react: Draggable with Table
   - draggable_multiple_containers: Dragging Across Multiple Containers
-
   rails:
   - draggable_default_rails: Default
   - draggable_with_list_rails: Draggable with List Kit

data/app/pb_kits/playbook/pb_draggable/docs/index.js

@@ -2,5 +2,4 @@ export { default as DraggableDefault } from './_draggable_default.jsx'
 export { default as DraggableWithCards } from './_draggable_with_cards.jsx'
 export { default as DraggableWithList } from './_draggable_with_list.jsx'
 export { default as DraggableWithSelectableList } from './_draggable_with_selectable_list.jsx'
-export { default as DraggableMultipleContainers } from './_draggable_multiple_containers.jsx'
-export { default as DraggableWithTableReact } from './_draggable_with_table_react.jsx'
+export { default as DraggableMultipleContainers } from './_draggable_multiple_containers.jsx'

data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.html.erb

@@ -1 +1,2 @@
 <%= pb_rails("progress_pills", props: { aria: { label: "2 out of 3 steps complete" }, steps: 3, active: 2 }) %>
+<%= pb_rails("progress_pills", props: { aria: { label: "9 out of 18 steps complete" }, steps: 18, active: 9, margin_top: "md" }) %>

data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.jsx

@@ -10,6 +10,13 @@ const ProgressPillsDefault = (props) => {
                 steps={3}
                 {...props}
             />
+            <ProgressPills
+                active={9}
+                aria={{ label: '9 out of 18 steps complete' }}
+                marginTop="md"
+                steps={18}
+                {...props}
+            />
         </>
     )
 }

data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.md

@@ -0,0 +1 @@
+Progress pills start at `45px` wide if the container allows, but will shrink down to `1px` as the container gets smaller. Resize this window to see each pill shrink.

data/app/pb_kits/playbook/pb_radio/docs/example.yml

@@ -16,7 +16,6 @@ examples:
   - radio_alignment: Alignment
   - radio_disabled: Disabled
   - radio_custom_children: Custom Children
-  - radio_react_hook: React Hook Form
 
   swift:
   - radio_default_swift: Default
@@ -27,4 +26,4 @@ examples:
   - radio_spacing_swift: Spacing
   - radio_padding_swift: Padding
   - radio_subtitle_swift: Subtitle
-  - radio_props_swift: ""
+  - radio_props_swift: ""

data/app/pb_kits/playbook/pb_radio/docs/index.js

@@ -4,4 +4,3 @@ export { default as RadioError } from './_radio_error.jsx'
 export { default as RadioAlignment } from './_radio_alignment.jsx'
 export { default as RadioDisabled } from './_radio_disabled.jsx'
 export { default as RadioCustomChildren } from './_radio_custom_children.jsx'
-export { default as RadioReactHook } from './_radio_react_hook.jsx'

data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible.jsx

@@ -16,7 +16,7 @@ const TableWithCollapsible = (props) => {
     );
   };
 
-  return (
+return (
       <Table
           size="sm"
           {...props}

data/app/pb_kits/playbook/pb_table/docs/example.yml

@@ -31,12 +31,10 @@ examples:
     - table_with_subcomponents_as_divs: Table with Sub Components (Divs)
     - table_outer_padding: Outer Padding
     - table_with_collapsible: Table with Collapsible
-    - table_with_collapsible_with_custom_click: Table with Collapsible with Custom Click
     - table_with_collapsible_with_custom_content_rails: Table with Collapsible with Custom Content
     - table_with_collapsible_with_nested_rows_rails: Table with Collapsible with Nested Rows
     - table_with_collapsible_with_nested_table_rails: Table with Collapsible with Nested Table
     - table_with_clickable_rows: Table with Clickable Rows
-    - table_with_selectable_rows: Table with Selectable Rows
 
   react:
     - table_sm: Small
@@ -73,5 +71,4 @@ examples:
     - table_with_collapsible_with_custom_content: Table with Collapsible with Custom Content
     - table_with_collapsible_with_nested_rows: Table with Collapsible with Nested Rows
     - table_with_collapsible_with_nested_table: Table with Collapsible with Nested Table
-    - table_with_clickable_rows: Table with Clickable Rows
-    - table_with_selectable_rows: Table with Selectable Rows
+    - table_with_clickable_rows: Table with Clickable Rows

data/app/pb_kits/playbook/pb_table/docs/index.js

@@ -33,5 +33,4 @@ export { default as TableWithCollapsibleWithCustomContent } from './_table_with_
 export { default as TableWithCollapsibleWithNestedTable } from './_table_with_collapsible_with_nested_table.jsx'
 export { default as TableWithCollapsibleWithNestedRows } from './_table_with_collapsible_with_nested_rows.jsx'
 export { default as TableWithCollapsibleWithCustomClick } from './_table_with_collapsible_with_custom_click.jsx'
-export { default as TableWithSelectableRows } from './_table_with_selectable_rows.jsx'
-export { default as TableWithClickableRows } from './_table_with_clickable_rows.jsx'
+export { default as TableWithClickableRows } from './_table_with_clickable_rows.jsx'

data/app/pb_kits/playbook/pb_text_input/docs/_text_input_mask.html.erb

@@ -27,20 +27,6 @@
     placeholder: "123-45-6789"
   }) %>
 
-  <%= pb_rails("text_input", props: {
-    label: "Credit Card",
-    mask: "credit_card",
-    margin_bottom: "md",
-    placeholder: "1234 5678 9012 3456"
-  }) %>
-
-  <%= pb_rails("text_input", props: {
-    label: "CVV",
-    mask: "cvv",
-    margin_bottom: "md",
-    placeholder: "123"
-  }) %>
-
   <%= pb_rails("title" , props: {
     text: "Hidden Input Under The Hood",
     padding_bottom: "sm"