playbook_ui_docs 16.8.0 → 16.9.0.pre.alpha.PLAY3001updateviewcomponent16983
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling.jsx +1 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling.md +6 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_width.jsx +57 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_width.md +66 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_enable_toggle_expansion_rails.html.erb +62 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_enable_toggle_expansion_rails.md +7 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_header.jsx +12 -4
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_header.md +4 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_header_rails.html.erb +16 -2
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_header_rails.md +4 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_scroll_limitation.jsx +68 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_scroll_limitation.md +7 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.html.erb +16 -2
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.jsx +12 -5
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_rails.md +4 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_react.md +5 -3
- data/app/pb_kits/playbook/pb_advanced_table/docs/_playground.json +5 -2
- data/app/pb_kits/playbook/pb_advanced_table/docs/_playground.overrides.json +1 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_column_definitions_styling.json +4 -1
- data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +3 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +2 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_dialog_submission.jsx +2 -2
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_asc.html.erb +1 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_asc.jsx +15 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_asc.md +1 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_playground.json +1 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_cards_rails.md +2 -0
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_cards_react.md +1 -0
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list_rails.md +2 -0
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list_react.md +3 -1
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.md +3 -1
- data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_react.md +3 -1
- data/app/pb_kits/playbook/pb_filter/docs/_filter_default.html.erb +5 -1
- data/app/pb_kits/playbook/pb_filter/docs/_filter_no_background.html.erb +1 -1
- data/app/pb_kits/playbook/pb_form/docs/_form_with_required_indicator.html.erb +20 -19
- data/app/pb_kits/playbook/pb_icon/docs/example.yml +0 -2
- data/app/pb_kits/playbook/pb_icon/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_centered_data.html.erb +90 -0
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_centered_data.jsx +100 -0
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_centered_data.md +1 -0
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_default.jsx +1 -1
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_pb_circle_chart/docs/index.js +2 -1
- data/app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx +9 -11
- data/app/pb_kits/playbook/pb_rich_text_editor/docs/_playground.json +4 -1
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky.html.erb +85 -83
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky.jsx +88 -86
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky.md +3 -1
- data/app/pb_kits/playbook/pb_table/docs/_table_with_filter_variant_external_filter_rails.md +1 -1
- data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_default.md +3 -1
- data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler.html.erb +24 -0
- data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler_rails.md +6 -0
- data/app/pb_kits/playbook/pb_time_picker/docs/example.yml +1 -0
- metadata +18 -7
- data/app/pb_kits/playbook/pb_icon/docs/_icon_fa_kit.html.erb +0 -1
- data/app/pb_kits/playbook/pb_icon/docs/_icon_fa_kit.jsx +0 -21
- data/app/pb_kits/playbook/pb_icon/docs/_icon_fa_kit.md +0 -7
- /data/app/pb_kits/playbook/pb_time_picker/docs/{_time_picker_on_handler.md → _time_picker_on_handler_react.md} +0 -0
|
@@ -3,92 +3,94 @@ import React from "react"
|
|
|
3
3
|
import Table from "../_table"
|
|
4
4
|
|
|
5
5
|
const TableSticky = (props) => (
|
|
6
|
-
<
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
<
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
<
|
|
21
|
-
<
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
<
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
<
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
<
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
<
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
<
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
<
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
<
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
<
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
<
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
6
|
+
<div style={{ maxHeight: "320px", overflowY: "auto" }}>
|
|
7
|
+
<Table
|
|
8
|
+
sticky
|
|
9
|
+
{...props}
|
|
10
|
+
>
|
|
11
|
+
<thead>
|
|
12
|
+
<tr>
|
|
13
|
+
<th>{'Column 1'}</th>
|
|
14
|
+
<th>{'Column 2'}</th>
|
|
15
|
+
<th>{'Column 3'}</th>
|
|
16
|
+
<th>{'Column 4'}</th>
|
|
17
|
+
<th>{'Column 5'}</th>
|
|
18
|
+
</tr>
|
|
19
|
+
</thead>
|
|
20
|
+
<tbody>
|
|
21
|
+
<tr>
|
|
22
|
+
<td>{'Value 1'}</td>
|
|
23
|
+
<td>{'Value 2'}</td>
|
|
24
|
+
<td>{'Value 3'}</td>
|
|
25
|
+
<td>{'Value 4'}</td>
|
|
26
|
+
<td>{'Value 5'}</td>
|
|
27
|
+
</tr>
|
|
28
|
+
<tr>
|
|
29
|
+
<td>{'Value 1'}</td>
|
|
30
|
+
<td>{'Value 2'}</td>
|
|
31
|
+
<td>{'Value 3'}</td>
|
|
32
|
+
<td>{'Value 4'}</td>
|
|
33
|
+
<td>{'Value 5'}</td>
|
|
34
|
+
</tr>
|
|
35
|
+
<tr>
|
|
36
|
+
<td>{'Value 1'}</td>
|
|
37
|
+
<td>{'Value 2'}</td>
|
|
38
|
+
<td>{'Value 3'}</td>
|
|
39
|
+
<td>{'Value 4'}</td>
|
|
40
|
+
<td>{'Value 5'}</td>
|
|
41
|
+
</tr>
|
|
42
|
+
<tr>
|
|
43
|
+
<td>{'Value 1'}</td>
|
|
44
|
+
<td>{'Value 2'}</td>
|
|
45
|
+
<td>{'Value 3'}</td>
|
|
46
|
+
<td>{'Value 4'}</td>
|
|
47
|
+
<td>{'Value 5'}</td>
|
|
48
|
+
</tr>
|
|
49
|
+
<tr>
|
|
50
|
+
<td>{'Value 1'}</td>
|
|
51
|
+
<td>{'Value 2'}</td>
|
|
52
|
+
<td>{'Value 3'}</td>
|
|
53
|
+
<td>{'Value 4'}</td>
|
|
54
|
+
<td>{'Value 5'}</td>
|
|
55
|
+
</tr>
|
|
56
|
+
<tr>
|
|
57
|
+
<td>{'Value 1'}</td>
|
|
58
|
+
<td>{'Value 2'}</td>
|
|
59
|
+
<td>{'Value 3'}</td>
|
|
60
|
+
<td>{'Value 4'}</td>
|
|
61
|
+
<td>{'Value 5'}</td>
|
|
62
|
+
</tr>
|
|
63
|
+
<tr>
|
|
64
|
+
<td>{'Value 1'}</td>
|
|
65
|
+
<td>{'Value 2'}</td>
|
|
66
|
+
<td>{'Value 3'}</td>
|
|
67
|
+
<td>{'Value 4'}</td>
|
|
68
|
+
<td>{'Value 5'}</td>
|
|
69
|
+
</tr>
|
|
70
|
+
<tr>
|
|
71
|
+
<td>{'Value 1'}</td>
|
|
72
|
+
<td>{'Value 2'}</td>
|
|
73
|
+
<td>{'Value 3'}</td>
|
|
74
|
+
<td>{'Value 4'}</td>
|
|
75
|
+
<td>{'Value 5'}</td>
|
|
76
|
+
</tr>
|
|
77
|
+
<tr>
|
|
78
|
+
<td>{'Value 1'}</td>
|
|
79
|
+
<td>{'Value 2'}</td>
|
|
80
|
+
<td>{'Value 3'}</td>
|
|
81
|
+
<td>{'Value 4'}</td>
|
|
82
|
+
<td>{'Value 5'}</td>
|
|
83
|
+
</tr>
|
|
84
|
+
<tr>
|
|
85
|
+
<td>{'Value 1'}</td>
|
|
86
|
+
<td>{'Value 2'}</td>
|
|
87
|
+
<td>{'Value 3'}</td>
|
|
88
|
+
<td>{'Value 4'}</td>
|
|
89
|
+
<td>{'Value 5'}</td>
|
|
90
|
+
</tr>
|
|
91
|
+
</tbody>
|
|
92
|
+
</Table>
|
|
93
|
+
</div>
|
|
92
94
|
)
|
|
93
95
|
|
|
94
96
|
export default TableSticky
|
|
@@ -2,7 +2,9 @@ React: Use `sticky` on a table to allow the table header to be fixed in place wh
|
|
|
2
2
|
|
|
3
3
|
Rails: Pass `sticky: true` to props.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
The live example uses a scroll container so sticky behavior is visible in the docs. Scroll inside the preview to see it.
|
|
6
|
+
|
|
7
|
+
If the table header is not sticking in the right place you will need to pass an inline `top` style to the `thead`. This is often needed when a parent adds padding above the table.
|
|
6
8
|
React Example: `<thead style={{ top: "-16px" }}>`
|
|
7
9
|
Rails Example: `<thead style="top: -16px">`
|
|
8
10
|
|
|
@@ -36,4 +36,4 @@ When `filter` is present, `filter_content` and `filter_props` are ignored.
|
|
|
36
36
|
<% end %>
|
|
37
37
|
```
|
|
38
38
|
|
|
39
|
-
For Nitro apps that use a shared search/filter pattern, reference the example on Alpha for implementation details.
|
|
39
|
+
For Nitro apps that use a shared search/filter pattern, reference the [example on Alpha](https://github.com/powerhome/nitro-web/pull/56859/changes/aa2afcdc97d39d74beb65cf53eb3bb2517eb2181) for implementation details.
|
|
@@ -1 +1,3 @@
|
|
|
1
|
-
Use the Time Picker for time-only selection. For date and time selection, use the [DatePicker with Time Selection Enabled](https://playbook.powerapp.cloud/kits/date_picker/react#time-selection) instead.
|
|
1
|
+
Use the Time Picker for time-only selection. For date and time selection, use the [DatePicker with Time Selection Enabled](https://playbook.powerapp.cloud/kits/date_picker/react#time-selection) instead.
|
|
2
|
+
|
|
3
|
+
`id` is a **required prop** to instantiate the Time Picker. The presence of a unique `id` for each Time Picker on a page also associates the label with the input, providing the ability to focus the Time Picker by clicking the label.
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
<%= pb_rails("flex", props: { margin_bottom: "sm", orientation: "column" }) do %>
|
|
2
|
+
<%= pb_rails("body", props: { id: "time-picker-on-change-output", text: "" }) %>
|
|
3
|
+
<%= pb_rails("body", props: { id: "time-picker-on-close-output", text: "" }) %>
|
|
4
|
+
<% end %>
|
|
5
|
+
|
|
6
|
+
<%= pb_rails("time_picker", props: { id: "time-picker-on-handler" }) %>
|
|
7
|
+
|
|
8
|
+
<script>
|
|
9
|
+
(function() {
|
|
10
|
+
var picker = document.getElementById("time-picker-on-handler");
|
|
11
|
+
var changeOutput = document.getElementById("time-picker-on-change-output");
|
|
12
|
+
var closeOutput = document.getElementById("time-picker-on-close-output");
|
|
13
|
+
|
|
14
|
+
if (!picker) return;
|
|
15
|
+
|
|
16
|
+
picker.addEventListener("pb-time-picker-change", function(event) {
|
|
17
|
+
changeOutput.textContent = "onChange: " + (event.detail.time || "");
|
|
18
|
+
});
|
|
19
|
+
|
|
20
|
+
picker.addEventListener("pb-time-picker-close", function(event) {
|
|
21
|
+
closeOutput.textContent = "onClose: " + (event.detail.time || "");
|
|
22
|
+
});
|
|
23
|
+
})();
|
|
24
|
+
</script>
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
Demonstrates listening for Time Picker custom events on the Rails enhanced element. Attach listeners to the picker root element (the element with `data-pb-time-picker`).
|
|
2
|
+
|
|
3
|
+
| Event | When it fires | `event.detail` |
|
|
4
|
+
| --- | --- | --- |
|
|
5
|
+
| `pb-time-picker-change` | Hour, minute, or period changes while the dropdown is open | `{ time: string }` — 24-hour `HH:MM` value, or `""` when cleared |
|
|
6
|
+
| `pb-time-picker-close` | Dropdown closes with a valid selection | `{ time: string }` — 24-hour `HH:MM` value |
|
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: 16.
|
|
4
|
+
version: 16.9.0.pre.alpha.PLAY3001updateviewcomponent16983
|
|
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: 2026-
|
|
12
|
+
date: 2026-06-10 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: playbook_ui
|
|
@@ -76,6 +76,8 @@ files:
|
|
|
76
76
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_column_headers_rails.md
|
|
77
77
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_rails.html.erb
|
|
78
78
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_rails.md
|
|
79
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_width.jsx
|
|
80
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_width.md
|
|
79
81
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_visibility.jsx
|
|
80
82
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_visibility.md
|
|
81
83
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_visibility_custom.jsx
|
|
@@ -92,6 +94,8 @@ files:
|
|
|
92
94
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_sort.md
|
|
93
95
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.jsx
|
|
94
96
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.md
|
|
97
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_enable_toggle_expansion_rails.html.erb
|
|
98
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_enable_toggle_expansion_rails.md
|
|
95
99
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expand_by_depth.jsx
|
|
96
100
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expand_by_depth.md
|
|
97
101
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.jsx
|
|
@@ -173,6 +177,8 @@ files:
|
|
|
173
177
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_header.md
|
|
174
178
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_header_rails.html.erb
|
|
175
179
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_header_rails.md
|
|
180
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_scroll_limitation.jsx
|
|
181
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sticky_scroll_limitation.md
|
|
176
182
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_subrow_headers.jsx
|
|
177
183
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_subrow_headers.md
|
|
178
184
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_options.jsx
|
|
@@ -717,6 +723,9 @@ files:
|
|
|
717
723
|
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_week.html.erb
|
|
718
724
|
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_week.jsx
|
|
719
725
|
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_week.md
|
|
726
|
+
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_asc.html.erb
|
|
727
|
+
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_asc.jsx
|
|
728
|
+
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_asc.md
|
|
720
729
|
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_range.html.erb
|
|
721
730
|
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_range.jsx
|
|
722
731
|
- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_year_range.md
|
|
@@ -1303,9 +1312,6 @@ files:
|
|
|
1303
1312
|
- app/pb_kits/playbook/pb_icon/docs/_icon_default.html.erb
|
|
1304
1313
|
- app/pb_kits/playbook/pb_icon/docs/_icon_default.jsx
|
|
1305
1314
|
- app/pb_kits/playbook/pb_icon/docs/_icon_default_swift.md
|
|
1306
|
-
- app/pb_kits/playbook/pb_icon/docs/_icon_fa_kit.html.erb
|
|
1307
|
-
- app/pb_kits/playbook/pb_icon/docs/_icon_fa_kit.jsx
|
|
1308
|
-
- app/pb_kits/playbook/pb_icon/docs/_icon_fa_kit.md
|
|
1309
1315
|
- app/pb_kits/playbook/pb_icon/docs/_icon_flip.html.erb
|
|
1310
1316
|
- app/pb_kits/playbook/pb_icon/docs/_icon_flip.jsx
|
|
1311
1317
|
- app/pb_kits/playbook/pb_icon/docs/_icon_flip_swift.md
|
|
@@ -1839,6 +1845,9 @@ files:
|
|
|
1839
1845
|
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_description.md
|
|
1840
1846
|
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_block_content.html.erb
|
|
1841
1847
|
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_block_content.jsx
|
|
1848
|
+
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_centered_data.html.erb
|
|
1849
|
+
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_centered_data.jsx
|
|
1850
|
+
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_centered_data.md
|
|
1842
1851
|
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.html.erb
|
|
1843
1852
|
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.jsx
|
|
1844
1853
|
- app/pb_kits/playbook/pb_pb_circle_chart/docs/_pb_circle_chart_color_overrides.md
|
|
@@ -2623,8 +2632,10 @@ files:
|
|
|
2623
2632
|
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_min_max_time.html.erb
|
|
2624
2633
|
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_min_max_time.jsx
|
|
2625
2634
|
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_min_max_time.md
|
|
2635
|
+
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler.html.erb
|
|
2626
2636
|
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler.jsx
|
|
2627
|
-
- app/pb_kits/playbook/pb_time_picker/docs/
|
|
2637
|
+
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler_rails.md
|
|
2638
|
+
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler_react.md
|
|
2628
2639
|
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_required_indicator.html.erb
|
|
2629
2640
|
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_required_indicator.jsx
|
|
2630
2641
|
- app/pb_kits/playbook/pb_time_picker/docs/_time_picker_required_indicator.md
|
|
@@ -2956,7 +2967,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
2956
2967
|
- !ruby/object:Gem::Version
|
|
2957
2968
|
version: '0'
|
|
2958
2969
|
requirements: []
|
|
2959
|
-
rubygems_version: 3.5.
|
|
2970
|
+
rubygems_version: 3.5.22
|
|
2960
2971
|
signing_key:
|
|
2961
2972
|
specification_version: 4
|
|
2962
2973
|
summary: Playbook Design System Docs
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<%= pb_rails("icon", props: { icon: "powergon", font_style: "fak", fixed_width: true, size: "5x" }) %>
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
|
|
3
|
-
import Icon from '../_icon'
|
|
4
|
-
|
|
5
|
-
import '../../../../../../playbook-website/app/javascript/scripts/custom-icons'
|
|
6
|
-
|
|
7
|
-
const IconFaKit = (props) => {
|
|
8
|
-
return (
|
|
9
|
-
<div>
|
|
10
|
-
<Icon
|
|
11
|
-
{...props}
|
|
12
|
-
fixedWidth
|
|
13
|
-
fontStyle="fak"
|
|
14
|
-
icon="powergon"
|
|
15
|
-
size="5x"
|
|
16
|
-
/>
|
|
17
|
-
</div>
|
|
18
|
-
)
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
export default IconFaKit
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
Our Icon kit allows integration with [FontAwesome's custom kit](https://fontawesome.com/v6/docs/web/setup/use-kit#contentHeader) functionality out-of-the-box.
|
|
2
|
-
|
|
3
|
-
All you need to do is 3 things:
|
|
4
|
-
1) Import your custom-icon.js file as outlined in the FontAwesome docs.
|
|
5
|
-
2) Use our fontStyle prop called "fak" so that our Icon component knows you are using a "fa-kit" icon.
|
|
6
|
-
3) Pass in your FaKit name as a string to our icon prop (This is the name that you designated when you uploaded the icon on their site).
|
|
7
|
-
|
|
File without changes
|