playbook_ui_docs 14.23.0.pre.rc.0 → 14.23.0.pre.rc.2
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_custom_sort.jsx +65 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_sort.md +5 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header.jsx +69 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header.md +1 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +2 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.jsx +33 -15
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_default.jsx +33 -15
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.jsx +52 -22
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.md +3 -0
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_horizontal.jsx +12 -16
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend.jsx +31 -15
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_non_clickable.jsx +39 -16
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_position.jsx +86 -38
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.jsx +32 -15
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.jsx +72 -22
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.md +1 -1
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_spline.jsx +31 -15
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_stacked.jsx +37 -16
- data/app/pb_kits/playbook/pb_bar_graph/docs/_description.md +1 -3
- data/app/pb_kits/playbook/pb_bar_graph/docs/example.yml +1 -3
- data/app/pb_kits/playbook/pb_bar_graph/docs/index.js +0 -2
- data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open.html.erb +14 -0
- data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open_rails.md +1 -0
- data/app/pb_kits/playbook/pb_tooltip/docs/example.yml +1 -0
- data/dist/playbook-doc.js +1 -1
- metadata +10 -7
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom.jsx +0 -72
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom.md +0 -6
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.jsx +0 -64
- data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.md +0 -1
- /data/app/pb_kits/playbook/pb_tooltip/docs/{_tooltip_click_open.md → _tooltip_click_open_react.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.23.0.pre.rc.
|
4
|
+
version: 14.23.0.pre.rc.2
|
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-
|
12
|
+
date: 2025-07-03 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: playbook_ui
|
@@ -74,6 +74,8 @@ files:
|
|
74
74
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell.md
|
75
75
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell_rails.html.erb
|
76
76
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell_rails.md
|
77
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_sort.jsx
|
78
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_sort.md
|
77
79
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.jsx
|
78
80
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.md
|
79
81
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expand_by_depth.jsx
|
@@ -147,6 +149,8 @@ files:
|
|
147
149
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.jsx
|
148
150
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_rails.md
|
149
151
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_react.md
|
152
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header.jsx
|
153
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header.md
|
150
154
|
- app/pb_kits/playbook/pb_advanced_table/docs/_mock_data_inline_loading.js
|
151
155
|
- app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data.json
|
152
156
|
- app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data_infinite_scroll.json
|
@@ -226,14 +230,13 @@ files:
|
|
226
230
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.html.erb
|
227
231
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.jsx
|
228
232
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.md
|
229
|
-
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom.jsx
|
230
|
-
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom.md
|
231
233
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom_rails.html.erb
|
232
234
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom_rails.md
|
233
235
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_default.html.erb
|
234
236
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_default.jsx
|
235
237
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.html.erb
|
236
238
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.jsx
|
239
|
+
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.md
|
237
240
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_horizontal.html.erb
|
238
241
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_horizontal.jsx
|
239
242
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend.html.erb
|
@@ -245,8 +248,6 @@ files:
|
|
245
248
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_position.md
|
246
249
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.html.erb
|
247
250
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.jsx
|
248
|
-
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.jsx
|
249
|
-
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.md
|
250
251
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.html.erb
|
251
252
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.jsx
|
252
253
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.md
|
@@ -2281,8 +2282,10 @@ files:
|
|
2281
2282
|
- app/pb_kits/playbook/pb_toggle/docs/_toggle_props_swift.md
|
2282
2283
|
- app/pb_kits/playbook/pb_toggle/docs/example.yml
|
2283
2284
|
- app/pb_kits/playbook/pb_toggle/docs/index.js
|
2285
|
+
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open.html.erb
|
2284
2286
|
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open.jsx
|
2285
|
-
- app/pb_kits/playbook/pb_tooltip/docs/
|
2287
|
+
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open_rails.md
|
2288
|
+
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open_react.md
|
2286
2289
|
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default.html.erb
|
2287
2290
|
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default_react.jsx
|
2288
2291
|
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default_react.md
|
@@ -1,72 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import ReactDOMServer from 'react-dom/server'
|
3
|
-
import BarGraph from '../_bar_graph'
|
4
|
-
import Icon from '../../pb_icon/_icon'
|
5
|
-
|
6
|
-
const chartData = [
|
7
|
-
{
|
8
|
-
name: 'Role',
|
9
|
-
data: [0, 200, 300, 654, 656],
|
10
|
-
},
|
11
|
-
{
|
12
|
-
name: 'Company',
|
13
|
-
data: [150, 524, 320, 440, 500],
|
14
|
-
},
|
15
|
-
]
|
16
|
-
|
17
|
-
const renderIcon = (iconName, color) => {
|
18
|
-
return ReactDOMServer.renderToStaticMarkup(
|
19
|
-
<Icon
|
20
|
-
color={color}
|
21
|
-
icon={iconName}
|
22
|
-
/>)
|
23
|
-
};
|
24
|
-
|
25
|
-
const barGraphOptions = {
|
26
|
-
yAxis: {
|
27
|
-
tickInterval: 5,
|
28
|
-
},
|
29
|
-
xAxis: {
|
30
|
-
categories: ['1', '2', '3', '4', '5'],
|
31
|
-
labels: {
|
32
|
-
useHTML: true,
|
33
|
-
formatter: function () {
|
34
|
-
switch (this.value) {
|
35
|
-
case '1':
|
36
|
-
return `${renderIcon('frown', 'error')}`;
|
37
|
-
case '2':
|
38
|
-
return `${renderIcon('frown', 'warning')}`;
|
39
|
-
case '3':
|
40
|
-
return `${renderIcon('frown-open', 'neutral')}`;
|
41
|
-
case '4':
|
42
|
-
return `${renderIcon('smile', 'category_7')}`;
|
43
|
-
case '5':
|
44
|
-
return `${renderIcon('smile-beam', 'success')}`;
|
45
|
-
default:
|
46
|
-
return ''
|
47
|
-
}
|
48
|
-
},
|
49
|
-
style: {
|
50
|
-
fontSize: '1.4em',
|
51
|
-
},
|
52
|
-
y: 42,
|
53
|
-
},
|
54
|
-
},
|
55
|
-
legend: {
|
56
|
-
itemMarginTop: 62,
|
57
|
-
},
|
58
|
-
}
|
59
|
-
|
60
|
-
const BarGraphCustom = () => (
|
61
|
-
<div>
|
62
|
-
<BarGraph
|
63
|
-
chartData={chartData}
|
64
|
-
customOptions={barGraphOptions}
|
65
|
-
id="happiness-dashboard"
|
66
|
-
legend
|
67
|
-
title="Bar Graph with Custom Overrides"
|
68
|
-
/>
|
69
|
-
</div>
|
70
|
-
)
|
71
|
-
|
72
|
-
export default BarGraphCustom
|
@@ -1,6 +0,0 @@
|
|
1
|
-
The `customOptions` prop provides comprehensive access to additional [Highcharts options](https://api.highcharts.com/highcharts/) that are not explicitly defined as props.
|
2
|
-
It's important to note that certain options may require specific script imports to function properly.
|
3
|
-
|
4
|
-
Note: If you are having trouble getting any Highcharts options to work, please match the formatting of our [staticOptions](https://github.com/powerhome/playbook/blob/master/playbook/app/pb_kits/playbook/pb_bar_graph/_bar_graph.tsx#L85-L141). For example, `yAxis` will need to be wrapped with square brackets.
|
5
|
-
|
6
|
-
You may also need to override any of the [defaults](https://github.com/powerhome/playbook/blob/master/playbook/app/pb_kits/playbook/pb_bar_graph/_bar_graph.tsx#L45-L73) in order to get that options to work.
|
@@ -1,64 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import Highcharts from "highcharts";
|
3
|
-
import HighchartsReact from "highcharts-react-official";
|
4
|
-
|
5
|
-
import "../BarGraphStyles.scss";
|
6
|
-
// Your path might look more like this
|
7
|
-
//import "playbook-ui/dist/pb_bar_graph/BarGraphStyles.scss";
|
8
|
-
|
9
|
-
const columnChartData = [
|
10
|
-
{
|
11
|
-
name: "Installation",
|
12
|
-
data: [1475, 200, 3000, 654, 656],
|
13
|
-
},
|
14
|
-
{
|
15
|
-
name: "Manufacturing",
|
16
|
-
data: [4434, 524, 2320, 440, 500],
|
17
|
-
},
|
18
|
-
{
|
19
|
-
name: "Sales & Distribution",
|
20
|
-
data: [3387, 743, 1344, 434, 440],
|
21
|
-
},
|
22
|
-
{
|
23
|
-
name: "Project Development",
|
24
|
-
data: [3227, 878, 999, 780, 1000],
|
25
|
-
},
|
26
|
-
{
|
27
|
-
name: "Other",
|
28
|
-
data: [1111, 677, 3245, 500, 200],
|
29
|
-
},
|
30
|
-
];
|
31
|
-
|
32
|
-
const columnOptions = {
|
33
|
-
chart: {
|
34
|
-
type: "column",
|
35
|
-
},
|
36
|
-
series: columnChartData,
|
37
|
-
title: {
|
38
|
-
text: "Solar Employment Growth by Sector, 2010-2016",
|
39
|
-
},
|
40
|
-
subtitle: {
|
41
|
-
text: "Source: thesolarfoundation.com",
|
42
|
-
},
|
43
|
-
xAxis: {
|
44
|
-
categories: ["Jan", "Feb", "Mar", "Apr", "May"],
|
45
|
-
},
|
46
|
-
yAxis: {
|
47
|
-
min: 0,
|
48
|
-
title: {
|
49
|
-
text: "Number of Employees",
|
50
|
-
},
|
51
|
-
},
|
52
|
-
legend: { enabled: false },
|
53
|
-
credits: { enabled: false },
|
54
|
-
};
|
55
|
-
|
56
|
-
const BarGraphPbStyles = () => (
|
57
|
-
<div>
|
58
|
-
<HighchartsReact highcharts={Highcharts}
|
59
|
-
options={columnOptions}
|
60
|
-
/>
|
61
|
-
</div>
|
62
|
-
)
|
63
|
-
|
64
|
-
export default BarGraphPbStyles
|
@@ -1 +0,0 @@
|
|
1
|
-
You don't need to use the bar graph kit to apply the styles to your Highcharts bar graph. Just import the BarGraphStyles.scss to your component and the styles will apply automatically.
|
/data/app/pb_kits/playbook/pb_tooltip/docs/{_tooltip_click_open.md → _tooltip_click_open_react.md}
RENAMED
File without changes
|