playbook_ui_docs 14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5757 → 14.12.0.pre.alpha.PBNTR720railscarddraggable5649
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_advanced_table/docs/{_advanced_table_loading_react.md → _advanced_table_loading.md} +2 -2
- data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/example.yml +0 -1
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content.jsx +8 -12
- data/app/pb_kits/playbook/pb_table/docs/example.yml +0 -3
- data/dist/playbook-doc.js +1 -1
- metadata +4 -20
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.html.erb +0 -33
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading_rails.md +0 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_responsive.html.erb +0 -38
- data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.jsx +0 -21
- data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.jsx +0 -45
- data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.md +0 -1
- data/app/pb_kits/playbook/pb_copy_button/docs/example.yml +0 -8
- data/app/pb_kits/playbook/pb_copy_button/docs/index.js +0 -2
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb +0 -58
- data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close_rails.md +0 -3
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content_rails.html.erb +0 -52
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content_rails.md +0 -0
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_rows_rails.html.erb +0 -52
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_rows_rails.md +0 -3
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.html.erb +0 -80
- data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.md +0 -1
- /data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/{_fixed_confirmation_toast_auto_close_react.md → _fixed_confirmation_toast_auto_close.md} +0 -0
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: playbook_ui_docs
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 14.12.0.pre.alpha.
|
4
|
+
version: 14.12.0.pre.alpha.PBNTR720railscarddraggable5649
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Power UX
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2025-01-
|
12
|
+
date: 2025-01-27 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: playbook_ui
|
@@ -59,16 +59,13 @@ files:
|
|
59
59
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.md
|
60
60
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading.jsx
|
61
61
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading.md
|
62
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.html.erb
|
63
62
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.jsx
|
64
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/
|
65
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading_react.md
|
63
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.md
|
66
64
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_no_subrows.jsx
|
67
65
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination.jsx
|
68
66
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination.md
|
69
67
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination_with_props.jsx
|
70
68
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination_with_props.md
|
71
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_responsive.html.erb
|
72
69
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_responsive.jsx
|
73
70
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_responsive.md
|
74
71
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows.jsx
|
@@ -436,11 +433,6 @@ files:
|
|
436
433
|
- app/pb_kits/playbook/pb_contact/docs/_description.md
|
437
434
|
- app/pb_kits/playbook/pb_contact/docs/example.yml
|
438
435
|
- app/pb_kits/playbook/pb_contact/docs/index.js
|
439
|
-
- app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.jsx
|
440
|
-
- app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.jsx
|
441
|
-
- app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.md
|
442
|
-
- app/pb_kits/playbook/pb_copy_button/docs/example.yml
|
443
|
-
- app/pb_kits/playbook/pb_copy_button/docs/index.js
|
444
436
|
- app/pb_kits/playbook/pb_currency/docs/_currency_abbreviated.html.erb
|
445
437
|
- app/pb_kits/playbook/pb_currency/docs/_currency_abbreviated.jsx
|
446
438
|
- app/pb_kits/playbook/pb_currency/docs/_currency_alignment.html.erb
|
@@ -811,10 +803,8 @@ files:
|
|
811
803
|
- app/pb_kits/playbook/pb_filter/docs/example.yml
|
812
804
|
- app/pb_kits/playbook/pb_filter/docs/index.js
|
813
805
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_description.md
|
814
|
-
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.html.erb
|
815
806
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.jsx
|
816
|
-
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/
|
817
|
-
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close_react.md
|
807
|
+
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_auto_close.md
|
818
808
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_children.html.erb
|
819
809
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_children.jsx
|
820
810
|
- app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_children.md
|
@@ -1836,16 +1826,10 @@ files:
|
|
1836
1826
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.md
|
1837
1827
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content.jsx
|
1838
1828
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content.md
|
1839
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content_rails.html.erb
|
1840
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content_rails.md
|
1841
1829
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_rows.jsx
|
1842
1830
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_rows.md
|
1843
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_rows_rails.html.erb
|
1844
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_rows_rails.md
|
1845
1831
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table.jsx
|
1846
1832
|
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table.md
|
1847
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.html.erb
|
1848
|
-
- app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.md
|
1849
1833
|
- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.jsx
|
1850
1834
|
- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.md
|
1851
1835
|
- app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.html.erb
|
@@ -1,33 +0,0 @@
|
|
1
|
-
<% column_definitions = [
|
2
|
-
{
|
3
|
-
accessor: "year",
|
4
|
-
label: "Year",
|
5
|
-
cellAccessors: ["quarter", "month", "day"],
|
6
|
-
},
|
7
|
-
{
|
8
|
-
accessor: "newEnrollments",
|
9
|
-
label: "New Enrollments",
|
10
|
-
},
|
11
|
-
{
|
12
|
-
accessor: "scheduledMeetings",
|
13
|
-
label: "Scheduled Meetings",
|
14
|
-
},
|
15
|
-
{
|
16
|
-
accessor: "attendanceRate",
|
17
|
-
label: "Attendance Rate",
|
18
|
-
},
|
19
|
-
{
|
20
|
-
accessor: "completedClasses",
|
21
|
-
label: "Completed Classes",
|
22
|
-
},
|
23
|
-
{
|
24
|
-
accessor: "classCompletionRate",
|
25
|
-
label: "Class Completion Rate",
|
26
|
-
},
|
27
|
-
{
|
28
|
-
accessor: "graduatedStudents",
|
29
|
-
label: "Graduated Students",
|
30
|
-
}
|
31
|
-
] %>
|
32
|
-
|
33
|
-
<%= pb_rails("advanced_table", props: { id: "beta_table", table_data: @table_data, column_definitions: column_definitions, loading: true }) %>
|
@@ -1 +0,0 @@
|
|
1
|
-
The optional `loading` prop takes a boolean value that can be managed using state. If loading is true, the table will display the loading skeleton and once loading is false, the table will render with the data provided.
|
@@ -1,38 +0,0 @@
|
|
1
|
-
|
2
|
-
<% column_definitions = [
|
3
|
-
{
|
4
|
-
accessor: "year",
|
5
|
-
label: "Year",
|
6
|
-
cellAccessors: ["quarter", "month", "day"],
|
7
|
-
},
|
8
|
-
{
|
9
|
-
accessor: "newEnrollments",
|
10
|
-
label: "New Enrollments",
|
11
|
-
},
|
12
|
-
{
|
13
|
-
accessor: "scheduledMeetings",
|
14
|
-
label: "Scheduled Meetings",
|
15
|
-
},
|
16
|
-
{
|
17
|
-
accessor: "attendanceRate",
|
18
|
-
label: "Attendance Rate",
|
19
|
-
},
|
20
|
-
{
|
21
|
-
accessor: "completedClasses",
|
22
|
-
label: "Completed Classes",
|
23
|
-
},
|
24
|
-
{
|
25
|
-
accessor: "classCompletionRate",
|
26
|
-
label: "Class Completion Rate",
|
27
|
-
},
|
28
|
-
{
|
29
|
-
accessor: "graduatedStudents",
|
30
|
-
label: "Graduated Students",
|
31
|
-
},
|
32
|
-
] %>
|
33
|
-
|
34
|
-
<%= pb_rails("title", props: { size: 4 }) do %> Not Responsive <% end %>
|
35
|
-
<%= pb_rails("advanced_table", props: { id: "table_props_table_non_responsive", table_data: @table_data, column_definitions: column_definitions, responsive: "none" }) %>
|
36
|
-
|
37
|
-
<%= pb_rails("title", props: { padding_top: "sm", size: 4 }) do %> Responsive as Default <% end %>
|
38
|
-
<%= pb_rails("advanced_table", props: { id: "table_props_table_responsive", table_data: @table_data, column_definitions: column_definitions }) %>
|
@@ -1,21 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import { CopyButton, Textarea } from 'playbook-ui'
|
3
|
-
|
4
|
-
const CopyButtonDefault = (props) => (
|
5
|
-
<div>
|
6
|
-
<CopyButton
|
7
|
-
{...props}
|
8
|
-
text="Copy Text"
|
9
|
-
tooltipPlacement="right"
|
10
|
-
tooltipText="Text copied!"
|
11
|
-
value="Playbook makes it easy to support bleeding edge, or legacy systems. Use Playbook’s 200+ components and end-to-end design language to create simple, intuitive and beautiful experiences with ease."
|
12
|
-
/>
|
13
|
-
|
14
|
-
<Textarea
|
15
|
-
{...props}
|
16
|
-
placeholder="Copy and paste here"
|
17
|
-
/>
|
18
|
-
</div>
|
19
|
-
)
|
20
|
-
|
21
|
-
export default CopyButtonDefault
|
@@ -1,45 +0,0 @@
|
|
1
|
-
import React, { useState } from 'react'
|
2
|
-
import { CopyButton, Body, TextInput, Textarea } from 'playbook-ui'
|
3
|
-
|
4
|
-
const CopyButtonFrom = (props) => {
|
5
|
-
const [text, setText] = useState("Copy this text input text")
|
6
|
-
|
7
|
-
const handleChange = (event) => {
|
8
|
-
setText(event.target.value);
|
9
|
-
}
|
10
|
-
|
11
|
-
return (<div>
|
12
|
-
<Body id="body">Copy this body text!</Body>
|
13
|
-
<CopyButton
|
14
|
-
{...props}
|
15
|
-
from="body"
|
16
|
-
marginBottom="sm"
|
17
|
-
text="Copy Body text"
|
18
|
-
tooltipPlacement="right"
|
19
|
-
tooltipText="Body text copied!"
|
20
|
-
/>
|
21
|
-
|
22
|
-
<TextInput
|
23
|
-
{...props}
|
24
|
-
id="textinput"
|
25
|
-
onChange={handleChange}
|
26
|
-
value={text}
|
27
|
-
/>
|
28
|
-
<CopyButton
|
29
|
-
{...props}
|
30
|
-
from="textinput"
|
31
|
-
marginBottom="sm"
|
32
|
-
text="Copy Text Input"
|
33
|
-
tooltipPlacement="right"
|
34
|
-
tooltipText="Text input copied!"
|
35
|
-
/>
|
36
|
-
|
37
|
-
<Textarea
|
38
|
-
{...props}
|
39
|
-
placeholder="Copy and paste here"
|
40
|
-
/>
|
41
|
-
</div>
|
42
|
-
)
|
43
|
-
}
|
44
|
-
|
45
|
-
export default CopyButtonFrom
|
@@ -1 +0,0 @@
|
|
1
|
-
Provide an element's ID as the `from` parameter, and its text will be copied. If the element is an input, its `value` will be copied; otherwise, the `innerText` will be used. Additionally, if a `value` prop is provided, it will override the content from the `from` element and be copied instead.
|
@@ -1,58 +0,0 @@
|
|
1
|
-
<%= pb_rails("button", props: { text: "Show Auto Close Toast", variant: "secondary", data: { toast: "#toast-auto-close" } }) %>
|
2
|
-
<%= pb_rails("button", props: { text: "Show Closeable Auto Close Toast", variant: "secondary", data: { toast: "#toast-auto-close-closeable" } }) %>
|
3
|
-
|
4
|
-
<%= pb_rails("fixed_confirmation_toast", props: {
|
5
|
-
auto_close: 3000,
|
6
|
-
classname: "toast-to-hide",
|
7
|
-
id: "toast-auto-close",
|
8
|
-
text: "I will disappear in 3 seconds.",
|
9
|
-
status: "tip",
|
10
|
-
vertical: "top",
|
11
|
-
horizontal: "center"
|
12
|
-
}) %>
|
13
|
-
|
14
|
-
<%= pb_rails("fixed_confirmation_toast", props: {
|
15
|
-
auto_close: 10000,
|
16
|
-
closeable: true,
|
17
|
-
id: "toast-auto-close-closeable",
|
18
|
-
text: "I will disappear in 10 seconds.",
|
19
|
-
status: "tip",
|
20
|
-
vertical: "top",
|
21
|
-
horizontal: "center"
|
22
|
-
}) %>
|
23
|
-
|
24
|
-
<script>
|
25
|
-
document.addEventListener('DOMContentLoaded', () => {
|
26
|
-
// Initialize toast elements and buttons
|
27
|
-
const toasts = {
|
28
|
-
'#toast-auto-close': document.querySelector("#toast-auto-close"),
|
29
|
-
'#toast-auto-close-closeable': document.querySelector("#toast-auto-close-closeable")
|
30
|
-
}
|
31
|
-
|
32
|
-
const buttons = {
|
33
|
-
'#toast-auto-close': document.querySelector("button[data-toast='#toast-auto-close']"),
|
34
|
-
'#toast-auto-close-closeable': document.querySelector("button[data-toast='#toast-auto-close-closeable']")
|
35
|
-
}
|
36
|
-
|
37
|
-
// Store original toasts and remove them from DOM
|
38
|
-
const originalToasts = {}
|
39
|
-
Object.entries(toasts).forEach(([id, toast]) => {
|
40
|
-
if (toast) {
|
41
|
-
originalToasts[id] = toast.cloneNode(true)
|
42
|
-
toast.remove()
|
43
|
-
}
|
44
|
-
})
|
45
|
-
|
46
|
-
// Set up button click handlers
|
47
|
-
Object.keys(buttons).forEach((toastId) => {
|
48
|
-
const button = buttons[toastId]
|
49
|
-
if (button) {
|
50
|
-
button.onclick = () => {
|
51
|
-
const newToast = originalToasts[toastId].cloneNode(true)
|
52
|
-
newToast.style.display = "flex"
|
53
|
-
document.body.appendChild(newToast)
|
54
|
-
}
|
55
|
-
}
|
56
|
-
})
|
57
|
-
})
|
58
|
-
</script>
|
@@ -1,3 +0,0 @@
|
|
1
|
-
Auto close is used when you want the confirmation toast to close automatically after a certain time. `auto_close` property will be a delay number in ms.
|
2
|
-
|
3
|
-
The script tag in this code snippet is for demonstration purposes only. It clones the toasts in order to have it appear with a button click prompt and not upon initial page load. In a typical production environment the event triggering a fixed confirmation toast to appear would be handled by a controller or a separate javascript file.
|
data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content_rails.html.erb
DELETED
@@ -1,52 +0,0 @@
|
|
1
|
-
<% content = capture do %>
|
2
|
-
<%= pb_rails("card", props: { border_none: true, border_radius: "none", padding: "md" }) do %>
|
3
|
-
<%= pb_rails("body", props: { text: "Expanded Custom Layout", padding_bottom: "sm" }) %>
|
4
|
-
<%= pb_rails("flex", props: { justify: "between" }) do %>
|
5
|
-
<%= pb_rails("image", props: { size: "sm", url: "https://unsplash.it/500/400/?image=634" }) %>
|
6
|
-
<%= pb_rails("image", props: { size: "sm", url: "https://unsplash.it/500/400/?image=634" }) %>
|
7
|
-
<%= pb_rails("image", props: { size: "sm", url: "https://unsplash.it/500/400/?image=634" }) %>
|
8
|
-
<%= pb_rails("image", props: { size: "sm", url: "https://unsplash.it/500/400/?image=634" }) %>
|
9
|
-
<% end %>
|
10
|
-
<% end %>
|
11
|
-
<% end %>
|
12
|
-
|
13
|
-
<%= pb_rails("table", props: { size: "sm" }) do %>
|
14
|
-
<%= pb_rails("table/table_head") do %>
|
15
|
-
<%= pb_rails("table/table_row") do %>
|
16
|
-
<%= pb_rails("table/table_header", props: { text: "Column 1"}) %>
|
17
|
-
<%= pb_rails("table/table_header", props: { text: "Column 2"}) %>
|
18
|
-
<%= pb_rails("table/table_header", props: { text: "Column 3"}) %>
|
19
|
-
<%= pb_rails("table/table_header", props: { text: "Column 4"}) %>
|
20
|
-
<%= pb_rails("table/table_header", props: { text: "Column 5"}) %>
|
21
|
-
<%= pb_rails("table/table_header", props: { text: ""}) %>
|
22
|
-
<% end %>
|
23
|
-
<% end %>
|
24
|
-
<%= pb_rails("table/table_body") do %>
|
25
|
-
<%= pb_rails("table/table_row", props: { collapsible: true, collapsible_content: content, id: "2" }) do %>
|
26
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
27
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
28
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
29
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
30
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
31
|
-
<%= pb_rails("table/table_cell", props: { text_align: "right"}) do %>
|
32
|
-
<%= pb_rails("icon", props: { icon: "chevron-down", fixed_width: true, color: "primary" }) %>
|
33
|
-
<% end %>
|
34
|
-
<% end %>
|
35
|
-
<%= pb_rails("table/table_row") do %>
|
36
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
37
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
38
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
39
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
40
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
41
|
-
<%= pb_rails("table/table_cell", props: { text: ""}) %>
|
42
|
-
<% end %>
|
43
|
-
<%= pb_rails("table/table_row") do %>
|
44
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
45
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
46
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
47
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
48
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
49
|
-
<%= pb_rails("table/table_cell", props: { text: ""}) %>
|
50
|
-
<% end %>
|
51
|
-
<% end %>
|
52
|
-
<% end %>
|
data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content_rails.md
DELETED
File without changes
|
data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_rows_rails.html.erb
DELETED
@@ -1,52 +0,0 @@
|
|
1
|
-
<% content = capture do %>
|
2
|
-
<%= pb_rails("table", props: { container: false, border_radius: "none", size: "sm"}) do %>
|
3
|
-
<%= pb_rails("background", props: { tag: "tr" }) do %>
|
4
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
5
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
6
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
7
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
8
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
9
|
-
<% end %>
|
10
|
-
<% end %>
|
11
|
-
<% end %>
|
12
|
-
|
13
|
-
<%= pb_rails("table", props: { size: "sm" }) do %>
|
14
|
-
<%= pb_rails("table/table_head") do %>
|
15
|
-
<%= pb_rails("table/table_row") do %>
|
16
|
-
<%= pb_rails("table/table_header", props: { text: "Column 1"}) %>
|
17
|
-
<%= pb_rails("table/table_header", props: { text: "Column 2"}) %>
|
18
|
-
<%= pb_rails("table/table_header", props: { text: "Column 3"}) %>
|
19
|
-
<%= pb_rails("table/table_header", props: { text: "Column 4"}) %>
|
20
|
-
<%= pb_rails("table/table_header", props: { text: "Column 5"}) %>
|
21
|
-
<%= pb_rails("table/table_header", props: { text: ""}) %>
|
22
|
-
<% end %>
|
23
|
-
<% end %>
|
24
|
-
<%= pb_rails("table/table_body") do %>
|
25
|
-
<%= pb_rails("table/table_row", props: { collapsible: true, collapsible_content: content, collapsible_side_highlight: false, id: "3" }) do %>
|
26
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
27
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
28
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
29
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
30
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
31
|
-
<%= pb_rails("table/table_cell", props: { text_align: "right"}) do %>
|
32
|
-
<%= pb_rails("icon", props: { icon: "chevron-down", fixed_width: true, color: "primary" }) %>
|
33
|
-
<% end %>
|
34
|
-
<% end %>
|
35
|
-
<%= pb_rails("table/table_row") do %>
|
36
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
37
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
38
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
39
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
40
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
41
|
-
<%= pb_rails("table/table_cell", props: { text: ""}) %>
|
42
|
-
<% end %>
|
43
|
-
<%= pb_rails("table/table_row") do %>
|
44
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
45
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
46
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
47
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
48
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
49
|
-
<%= pb_rails("table/table_cell", props: { text: ""}) %>
|
50
|
-
<% end %>
|
51
|
-
<% end %>
|
52
|
-
<% end %>
|
data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.html.erb
DELETED
@@ -1,80 +0,0 @@
|
|
1
|
-
<% content = capture do %>
|
2
|
-
<%= pb_rails("table", props: { container: false, border_radius: "none", size: "sm"}) do %>
|
3
|
-
<%= pb_rails("table/table_head") do %>
|
4
|
-
<%= pb_rails("background", props: { tag: "tr" }) do %>
|
5
|
-
<%= pb_rails("table/table_header") do %>Alt Header<% end %>
|
6
|
-
<%= pb_rails("table/table_header") do %>Alt Header<% end %>
|
7
|
-
<%= pb_rails("table/table_header") do %>Alt Header<% end %>
|
8
|
-
<%= pb_rails("table/table_header") do %>Alt Header<% end %>
|
9
|
-
<% end %>
|
10
|
-
<% end %>
|
11
|
-
<%= pb_rails("table/table_body") do %>
|
12
|
-
<%= pb_rails("table/table_row") do %>
|
13
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
14
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
15
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
16
|
-
<%= pb_rails("table/table_cell") do %>
|
17
|
-
<%= pb_rails("pill", props: { text: "Pill", variant: "primary" }) %>
|
18
|
-
<% end %>
|
19
|
-
<% end %>
|
20
|
-
<%= pb_rails("table/table_row") do %>
|
21
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
22
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
23
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
24
|
-
<%= pb_rails("table/table_cell") do %>
|
25
|
-
<%= pb_rails("pill", props: { text: "Pill", variant: "primary" }) %>
|
26
|
-
<% end %>
|
27
|
-
<% end %>
|
28
|
-
<%= pb_rails("table/table_row") do %>
|
29
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
30
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
31
|
-
<%= pb_rails("table/table_cell") do %>Expanded<% end %>
|
32
|
-
<%= pb_rails("table/table_cell") do %>
|
33
|
-
<%= pb_rails("pill", props: { text: "Pill", variant: "primary" }) %>
|
34
|
-
<% end %>
|
35
|
-
<% end %>
|
36
|
-
<% end %>
|
37
|
-
<% end %>
|
38
|
-
<% end %>
|
39
|
-
|
40
|
-
|
41
|
-
<%= pb_rails("table", props: { size: "sm" }) do %>
|
42
|
-
<%= pb_rails("table/table_head") do %>
|
43
|
-
<%= pb_rails("table/table_row") do %>
|
44
|
-
<%= pb_rails("table/table_header", props: { text: "Column 1"}) %>
|
45
|
-
<%= pb_rails("table/table_header", props: { text: "Column 2"}) %>
|
46
|
-
<%= pb_rails("table/table_header", props: { text: "Column 3"}) %>
|
47
|
-
<%= pb_rails("table/table_header", props: { text: "Column 4"}) %>
|
48
|
-
<%= pb_rails("table/table_header", props: { text: "Column 5"}) %>
|
49
|
-
<%= pb_rails("table/table_header", props: { text: ""}) %>
|
50
|
-
<% end %>
|
51
|
-
<% end %>
|
52
|
-
<%= pb_rails("table/table_body") do %>
|
53
|
-
<%= pb_rails("table/table_row", props: { collapsible: true, collapsible_content: content, collapsible_side_highlight: false, id: "4" }) do %>
|
54
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
55
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
56
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
57
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
58
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
59
|
-
<%= pb_rails("table/table_cell", props: { text_align: "right"}) do %>
|
60
|
-
<%= pb_rails("icon", props: { icon: "chevron-down", fixed_width: true, color: "primary" }) %>
|
61
|
-
<% end %>
|
62
|
-
<% end %>
|
63
|
-
<%= pb_rails("table/table_row") do %>
|
64
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
65
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
66
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
67
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
68
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
69
|
-
<%= pb_rails("table/table_cell", props: { text: ""}) %>
|
70
|
-
<% end %>
|
71
|
-
<%= pb_rails("table/table_row") do %>
|
72
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 1"}) %>
|
73
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 2"}) %>
|
74
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 3"}) %>
|
75
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 4"}) %>
|
76
|
-
<%= pb_rails("table/table_cell", props: { text: "Value 5"}) %>
|
77
|
-
<%= pb_rails("table/table_cell", props: { text: ""}) %>
|
78
|
-
<% end %>
|
79
|
-
<% end %>
|
80
|
-
<% end %>
|
@@ -1 +0,0 @@
|
|
1
|
-
The `collapsible_content` can also be used to display nested Tables within each Row.
|