playbook_ui_docs 13.28.0 → 13.29.0.pre.alpha.testingcollapsibleissue3052

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

@@ -0,0 +1,76 @@
+import React from 'react'
+
+import Table from '../_table'
+import Button from '../../pb_button/_button'
+
+const TableOuterPadding = (props) => {
+  return (
+    <Table
+        outerPadding="sm"
+        size="sm"
+        {...props}
+    >
+      <thead>
+        <tr>
+          <th>{'Column 1'}</th>
+          <th>{'Column 2'}</th>
+          <th>{'Column 3'}</th>
+          <th>{'Column 4'}</th>
+          <th>{''}</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>{'Value 1'}</td>
+          <td>{'Value 2'}</td>
+          <td>{'Value 3'}</td>
+          <td>{'Value 4'}</td>
+          <td align="right">
+            {' '}
+            <Button
+                onClick={() => alert('button clicked!')}
+                text="Action"
+                variant="secondary"
+                {...props}
+            />
+            {' '}
+          </td>
+        </tr>
+        <tr>
+          <td>{'Value 1'}</td>
+          <td>{'Value 2'}</td>
+          <td>{'Value 3'}</td>
+          <td>{'Value 4'}</td>
+          <td align="right">
+            {' '}
+            <Button
+                onClick={() => alert('button clicked!')}
+                text="Action"
+                variant="secondary"
+                {...props}
+            />
+            {' '}
+          </td>
+        </tr>
+        <tr>
+          <td>{'Value 1'}</td>
+          <td>{'Value 2'}</td>
+          <td>{'Value 3'}</td>
+          <td>{'Value 4'}</td>
+          <td align="right">
+            {' '}
+            <Button
+                onClick={() => alert('button clicked!')}
+                text="Action"
+                variant="secondary"
+                {...props}
+            />
+            {' '}
+          </td>
+        </tr>
+      </tbody>
+    </Table>
+  )
+}
+
+export default TableOuterPadding

data/app/pb_kits/playbook/pb_table/docs/_table_outer_padding.md

@@ -0,0 +1 @@
+Pass any of our spacing tokens to the `outerPadding` / `outer_padding` prop to customize a table's outer padding (both the left padding of the first column and the right padding of the last column).

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

@@ -5,10 +5,10 @@ examples:
     - table_lg: Large
     - table_sticky: Sticky Header
     - table_header: Table Header
-    - table_alignment_row: Row Alignment
-    - table_alignment_column: Column Alignment
-    - table_alignment_shift_row: Shift Row
-    - table_alignment_shift_data: Shift Column Data
+    - table_alignment_row_rails: Row Alignment
+    - table_alignment_column_rails: Cell Alignment
+    - table_alignment_shift_row_rails: Row Shift
+    - table_alignment_shift_data_rails: Cell Shift
     - table_side_highlight: Side Highlight
     - table_container: Table Container Off
     - table_disable_hover: Disable Hover
@@ -26,7 +26,7 @@ examples:
     - table_striped: Striped Table
     - table_with_subcomponents_rails: Table with Sub Components (Table Elements)
     - table_with_subcomponents_as_divs: Table with Sub Components (Divs)
-
+    - table_outer_padding: Outer Padding
 
   react:
     - table_sm: Small
@@ -34,9 +34,9 @@ examples:
     - table_lg: Large
     - table_sticky: Sticky Header
     - table_alignment_row: Row Alignment
-    - table_alignment_column: Column Alignment
-    - table_alignment_shift_row: Shift Row
-    - table_alignment_shift_data: Shift Column Data
+    - table_alignment_column: Cell Alignment
+    - table_alignment_shift_row: Row Shift
+    - table_alignment_shift_data: Cell Shift
     - table_side_highlight: Side Highlight
     - table_container: Table Container Off
     - table_disable_hover: Disable Hover
@@ -54,4 +54,4 @@ examples:
     - table_striped: Striped Table
     - table_with_subcomponents: Table with Sub Components (Table Elements)
     - table_with_subcomponents_as_divs: Table with Sub Components (Divs)
-
+    - table_outer_padding: Outer Padding

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

@@ -24,3 +24,4 @@ export { default as TableStriped } from './_table_striped.jsx'
 export { default as TableDiv } from './_table_div.jsx'
 export { default as TableWithSubcomponents } from './_table_with_subcomponents.jsx'
 export { default as TableWithSubcomponentsAsDivs } from './_table_with_subcomponents_as_divs.jsx'
+export { default as TableOuterPadding } from './_table_outer_padding.jsx'

data/dist/menu.yml

@@ -352,6 +352,10 @@ kits:
         platforms: *web
         description: 
         status: "stable"
+      - name: "draggable"
+        platforms: *react_only
+        description:
+        status: "beta"
   - name: message_text_patterns
     description: 
     components:
@@ -463,5 +467,4 @@ kits:
         status: "stable"
       - name: "user"
         platforms: *web
-        description: This kit was created for having a systematic way of displaying users with avatar, titles, name and territory. This is a versatile kit with features than can be added to display more info.
-        status: "stable"
+        description: This kit was created for having a systematic way of displaying users with avatar, titles, name and territory. This is a versatile kit with features than can be added to display more info.