playbook_ui 14.22.0 → 14.23.0.pre.alpha.PLAY2148selectclassnamessinglespacesfix9144
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/Components/SubRowHeaderRow.tsx +32 -11
- data/app/pb_kits/playbook/pb_advanced_table/Components/TableHeaderCell.tsx +0 -1
- data/app/pb_kits/playbook/pb_advanced_table/Hooks/useTableState.ts +3 -3
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss +5 -0
- data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +6 -0
- data/app/pb_kits/playbook/pb_advanced_table/advanced_table.html.erb +1 -1
- data/app/pb_kits/playbook/pb_advanced_table/advanced_table.rb +2 -0
- 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_row_styling.html.erb +46 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_row_styling_rails.md +7 -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/_advanced_table_with_custom_header_multi_header.jsx +107 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_multi_header.md +1 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_rails.html.erb +51 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_rails.md +1 -0
- data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +14 -8
- data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +3 -0
- data/app/pb_kits/playbook/pb_advanced_table/table_body.rb +3 -1
- data/app/pb_kits/playbook/pb_advanced_table/table_header.html.erb +5 -1
- data/app/pb_kits/playbook/pb_advanced_table/table_header.rb +36 -0
- data/app/pb_kits/playbook/pb_advanced_table/table_row.html.erb +11 -2
- data/app/pb_kits/playbook/pb_advanced_table/table_row.rb +2 -0
- data/app/pb_kits/playbook/pb_badge/_badge.scss +5 -6
- data/app/pb_kits/playbook/pb_bar_graph/barGraphTheme.ts +106 -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_legend_position.md +1 -1
- 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_body/docs/_body_truncate.jsx +3 -3
- data/app/pb_kits/playbook/pb_body/docs/_body_truncate_react.md +4 -0
- data/app/pb_kits/playbook/pb_checkbox/checkbox.rb +12 -1
- data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate.html.erb +1 -1
- data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate_rails.md +2 -1
- data/app/pb_kits/playbook/pb_checkbox/index.js +3 -1
- data/app/pb_kits/playbook/pb_circle_chart/circleChartTheme.ts +36 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.jsx +71 -26
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.jsx +29 -16
- data/app/pb_kits/playbook/pb_circle_chart/docs/{_circle_chart_colors.md → _circle_chart_colors_rails.md} +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors_react.md +2 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_custom_tooltip.jsx +28 -16
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_custom_tooltip.md +4 -2
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_default.jsx +23 -15
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_inner_sizes.jsx +81 -51
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_legend_position.jsx +103 -75
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_legend_position.md +4 -7
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_live_data.jsx +19 -13
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.jsx +30 -17
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_labels.jsx +34 -20
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_legend_kit.jsx +29 -20
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_title.jsx +28 -20
- data/app/pb_kits/playbook/pb_circle_chart/docs/_description.md +1 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/example.yml +0 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_draggable/context/index.tsx +12 -4
- data/app/pb_kits/playbook/pb_draggable/context/types.ts +5 -2
- data/app/pb_kits/playbook/pb_gauge/docs/_description.md +1 -0
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.jsx +32 -15
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_colors_react.md +2 -0
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.jsx +35 -9
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex_react.md +1 -0
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_default.jsx +26 -14
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_disable_animation.jsx +32 -15
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_full_circle.jsx +45 -17
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_height.jsx +59 -22
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_live_data.jsx +40 -9
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_min_max.jsx +50 -18
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.jsx +31 -18
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_title.jsx +34 -17
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_units.jsx +64 -23
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_units_react.md +1 -0
- data/app/pb_kits/playbook/pb_gauge/docs/example.yml +0 -1
- data/app/pb_kits/playbook/pb_gauge/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_gauge/gaugeTheme.ts +7 -1
- data/app/pb_kits/playbook/pb_line_graph/docs/_description.md +1 -3
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.jsx +36 -17
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors_react.md +3 -0
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_default.jsx +31 -16
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_height.jsx +63 -31
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_height.md +3 -0
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend.jsx +35 -16
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_nonclickable.jsx +41 -16
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.jsx +107 -62
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.md +4 -7
- data/app/pb_kits/playbook/pb_line_graph/docs/example.yml +0 -1
- data/app/pb_kits/playbook/pb_line_graph/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_line_graph/lineGraphTheme.ts +16 -1
- data/app/pb_kits/playbook/pb_phone_number_input/_phone_number_input.tsx +30 -17
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_strict_mode.html.erb +10 -0
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_strict_mode.jsx +26 -0
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_strict_mode.md +3 -0
- data/app/pb_kits/playbook/pb_phone_number_input/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_phone_number_input/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_phone_number_input/phone_number_input.rb +3 -0
- data/app/pb_kits/playbook/pb_select/select.rb +4 -2
- data/app/pb_kits/playbook/pb_table/_table.tsx +4 -4
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_columns.jsx +8 -8
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_columns_react.md +1 -1
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns.jsx +12 -12
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_left_columns_react.md +3 -3
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns.jsx +12 -12
- data/app/pb_kits/playbook/pb_table/docs/_table_sticky_right_columns_react.md +3 -3
- data/app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.html.erb +1 -0
- data/app/pb_kits/playbook/pb_title/docs/_title_truncate.jsx +3 -3
- data/app/pb_kits/playbook/pb_title/docs/_title_truncate_react.md +4 -0
- 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/app/pb_kits/playbook/pb_tooltip/index.js +59 -36
- data/app/pb_kits/playbook/pb_tooltip/tooltip.rb +9 -2
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input.html.erb +18 -0
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input_rails.md +1 -0
- data/app/pb_kits/playbook/pb_typeahead/docs/example.yml +1 -0
- data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +3 -0
- data/dist/chunks/_line_graph-BfCo79KE.js +1 -0
- data/dist/chunks/_typeahead-Db4YQA5c.js +6 -0
- data/dist/chunks/_weekday_stacked-DfH_cGOX.js +61 -0
- data/dist/chunks/lib-DnQyMxO1.js +29 -0
- data/dist/chunks/{pb_form_validation-Dx1C9XCK.js → pb_form_validation-kl-4Jv4t.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/menu.yml +68 -8
- data/dist/playbook-doc.js +2 -2
- data/dist/playbook-rails-react-bindings.js +1 -1
- data/dist/playbook-rails.js +1 -1
- data/dist/playbook.css +1 -1
- data/lib/playbook/version.rb +2 -2
- metadata +45 -25
- 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_circle_chart/docs/_circle_chart_pb_styles.jsx +0 -38
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_pb_styles.md +0 -1
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_pb_styles.jsx +0 -30
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_pb_styles.md +0 -1
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_pb_styles.jsx +0 -52
- data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_pb_styles.md +0 -1
- data/dist/chunks/_typeahead-dOC1gq2X.js +0 -22
- data/dist/chunks/_weekday_stacked-Bh8iY5uA.js +0 -45
- data/dist/chunks/lib-DtCftrUN.js +0 -29
- /data/app/pb_kits/playbook/pb_advanced_table/docs/{_advanced_table_row_styling.md → _advanced_table_row_styling_react.md} +0 -0
- /data/app/pb_kits/playbook/pb_body/docs/{_body_truncate.md → _body_truncate_rails.md} +0 -0
- /data/app/pb_kits/playbook/pb_gauge/docs/{_gauge_colors.md → _gauge_colors_rails.md} +0 -0
- /data/app/pb_kits/playbook/pb_gauge/docs/{_gauge_complex.md → _gauge_complex_rails.md} +0 -0
- /data/app/pb_kits/playbook/pb_line_graph/docs/{_line_graph_colors.md → _line_graph_colors_rails.md} +0 -0
- /data/app/pb_kits/playbook/pb_title/docs/{_title_truncate.md → _title_truncate_rails.md} +0 -0
- /data/app/pb_kits/playbook/pb_tooltip/docs/{_tooltip_click_open.md → _tooltip_click_open_react.md} +0 -0
- /data/app/pb_kits/playbook/pb_typeahead/docs/{_typeahead_preserve_input.md → _typeahead_preserve_input_react.md} +0 -0
data/lib/playbook/version.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: playbook_ui
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 14.
|
4
|
+
version: 14.23.0.pre.alpha.PLAY2148selectclassnamessinglespacesfix9144
|
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-22 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: actionpack
|
@@ -328,6 +328,8 @@ files:
|
|
328
328
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell.md
|
329
329
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell_rails.html.erb
|
330
330
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell_rails.md
|
331
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_sort.jsx
|
332
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_sort.md
|
331
333
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.jsx
|
332
334
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.md
|
333
335
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expand_by_depth.jsx
|
@@ -357,8 +359,10 @@ files:
|
|
357
359
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_responsive.html.erb
|
358
360
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_responsive.jsx
|
359
361
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_responsive.md
|
362
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_row_styling.html.erb
|
360
363
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_row_styling.jsx
|
361
|
-
- app/pb_kits/playbook/pb_advanced_table/docs/
|
364
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_row_styling_rails.md
|
365
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_row_styling_react.md
|
362
366
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_scrollbar_none.html.erb
|
363
367
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_scrollbar_none.jsx
|
364
368
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows.jsx
|
@@ -401,6 +405,12 @@ files:
|
|
401
405
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.jsx
|
402
406
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_rails.md
|
403
407
|
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_react.md
|
408
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header.jsx
|
409
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header.md
|
410
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_multi_header.jsx
|
411
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_multi_header.md
|
412
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_rails.html.erb
|
413
|
+
- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_with_custom_header_rails.md
|
404
414
|
- app/pb_kits/playbook/pb_advanced_table/docs/_mock_data_inline_loading.js
|
405
415
|
- app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data.json
|
406
416
|
- app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data_infinite_scroll.json
|
@@ -514,19 +524,19 @@ files:
|
|
514
524
|
- app/pb_kits/playbook/pb_bar_graph/_bar_graph.tsx
|
515
525
|
- app/pb_kits/playbook/pb_bar_graph/barGraph.test.js
|
516
526
|
- app/pb_kits/playbook/pb_bar_graph/barGraphSettings.js
|
527
|
+
- app/pb_kits/playbook/pb_bar_graph/barGraphTheme.ts
|
517
528
|
- app/pb_kits/playbook/pb_bar_graph/bar_graph.html.erb
|
518
529
|
- app/pb_kits/playbook/pb_bar_graph/bar_graph.rb
|
519
530
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.html.erb
|
520
531
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.jsx
|
521
532
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_colors.md
|
522
|
-
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom.jsx
|
523
|
-
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom.md
|
524
533
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom_rails.html.erb
|
525
534
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_custom_rails.md
|
526
535
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_default.html.erb
|
527
536
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_default.jsx
|
528
537
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.html.erb
|
529
538
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.jsx
|
539
|
+
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_height.md
|
530
540
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_horizontal.html.erb
|
531
541
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_horizontal.jsx
|
532
542
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend.html.erb
|
@@ -538,8 +548,6 @@ files:
|
|
538
548
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_position.md
|
539
549
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.html.erb
|
540
550
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.jsx
|
541
|
-
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.jsx
|
542
|
-
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.md
|
543
551
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.html.erb
|
544
552
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.jsx
|
545
553
|
- app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.md
|
@@ -571,7 +579,8 @@ files:
|
|
571
579
|
- app/pb_kits/playbook/pb_body/docs/_body_styled.md
|
572
580
|
- app/pb_kits/playbook/pb_body/docs/_body_truncate.html.erb
|
573
581
|
- app/pb_kits/playbook/pb_body/docs/_body_truncate.jsx
|
574
|
-
- app/pb_kits/playbook/pb_body/docs/
|
582
|
+
- app/pb_kits/playbook/pb_body/docs/_body_truncate_rails.md
|
583
|
+
- app/pb_kits/playbook/pb_body/docs/_body_truncate_react.md
|
575
584
|
- app/pb_kits/playbook/pb_body/docs/_description.md
|
576
585
|
- app/pb_kits/playbook/pb_body/docs/_footer.md
|
577
586
|
- app/pb_kits/playbook/pb_body/docs/example.yml
|
@@ -765,7 +774,8 @@ files:
|
|
765
774
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.jsx
|
766
775
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.html.erb
|
767
776
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.jsx
|
768
|
-
- app/pb_kits/playbook/pb_circle_chart/docs/
|
777
|
+
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors_rails.md
|
778
|
+
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors_react.md
|
769
779
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_custom_tooltip.html.erb
|
770
780
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_custom_tooltip.jsx
|
771
781
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_custom_tooltip.md
|
@@ -777,8 +787,6 @@ files:
|
|
777
787
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_legend_position.jsx
|
778
788
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_legend_position.md
|
779
789
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_live_data.jsx
|
780
|
-
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_pb_styles.jsx
|
781
|
-
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_pb_styles.md
|
782
790
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.html.erb
|
783
791
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.jsx
|
784
792
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_labels.html.erb
|
@@ -787,6 +795,7 @@ files:
|
|
787
795
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_legend_kit.jsx
|
788
796
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_title.html.erb
|
789
797
|
- app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_with_title.jsx
|
798
|
+
- app/pb_kits/playbook/pb_circle_chart/docs/_description.md
|
790
799
|
- app/pb_kits/playbook/pb_circle_chart/docs/example.yml
|
791
800
|
- app/pb_kits/playbook/pb_circle_chart/docs/index.js
|
792
801
|
- app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.scss
|
@@ -1671,12 +1680,15 @@ files:
|
|
1671
1680
|
- app/pb_kits/playbook/pb_form_pill/form_pill.rb
|
1672
1681
|
- app/pb_kits/playbook/pb_gauge/_gauge.scss
|
1673
1682
|
- app/pb_kits/playbook/pb_gauge/_gauge.tsx
|
1683
|
+
- app/pb_kits/playbook/pb_gauge/docs/_description.md
|
1674
1684
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.html.erb
|
1675
1685
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.jsx
|
1676
|
-
- app/pb_kits/playbook/pb_gauge/docs/
|
1686
|
+
- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors_rails.md
|
1687
|
+
- app/pb_kits/playbook/pb_gauge/docs/_gauge_colors_react.md
|
1677
1688
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.html.erb
|
1678
1689
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.jsx
|
1679
|
-
- app/pb_kits/playbook/pb_gauge/docs/
|
1690
|
+
- app/pb_kits/playbook/pb_gauge/docs/_gauge_complex_rails.md
|
1691
|
+
- app/pb_kits/playbook/pb_gauge/docs/_gauge_complex_react.md
|
1680
1692
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_default.html.erb
|
1681
1693
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_default.jsx
|
1682
1694
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_disable_animation.html.erb
|
@@ -1689,8 +1701,6 @@ files:
|
|
1689
1701
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_min_max.html.erb
|
1690
1702
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_min_max.jsx
|
1691
1703
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_min_max.md
|
1692
|
-
- app/pb_kits/playbook/pb_gauge/docs/_gauge_pb_styles.jsx
|
1693
|
-
- app/pb_kits/playbook/pb_gauge/docs/_gauge_pb_styles.md
|
1694
1704
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.html.erb
|
1695
1705
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.jsx
|
1696
1706
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.md
|
@@ -1698,6 +1708,7 @@ files:
|
|
1698
1708
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_title.jsx
|
1699
1709
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_units.html.erb
|
1700
1710
|
- app/pb_kits/playbook/pb_gauge/docs/_gauge_units.jsx
|
1711
|
+
- app/pb_kits/playbook/pb_gauge/docs/_gauge_units_react.md
|
1701
1712
|
- app/pb_kits/playbook/pb_gauge/docs/example.yml
|
1702
1713
|
- app/pb_kits/playbook/pb_gauge/docs/index.js
|
1703
1714
|
- app/pb_kits/playbook/pb_gauge/gauge.html.erb
|
@@ -2014,11 +2025,13 @@ files:
|
|
2014
2025
|
- app/pb_kits/playbook/pb_line_graph/docs/_description.md
|
2015
2026
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.html.erb
|
2016
2027
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors.jsx
|
2017
|
-
- app/pb_kits/playbook/pb_line_graph/docs/
|
2028
|
+
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors_rails.md
|
2029
|
+
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_colors_react.md
|
2018
2030
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_default.html.erb
|
2019
2031
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_default.jsx
|
2020
2032
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_height.html.erb
|
2021
2033
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_height.jsx
|
2034
|
+
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_height.md
|
2022
2035
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend.html.erb
|
2023
2036
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend.jsx
|
2024
2037
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_nonclickable.html.erb
|
@@ -2026,8 +2039,6 @@ files:
|
|
2026
2039
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.html.erb
|
2027
2040
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.jsx
|
2028
2041
|
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.md
|
2029
|
-
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_pb_styles.jsx
|
2030
|
-
- app/pb_kits/playbook/pb_line_graph/docs/_line_graph_pb_styles.md
|
2031
2042
|
- app/pb_kits/playbook/pb_line_graph/docs/example.yml
|
2032
2043
|
- app/pb_kits/playbook/pb_line_graph/docs/index.js
|
2033
2044
|
- app/pb_kits/playbook/pb_line_graph/lineGraph.test.js
|
@@ -2463,6 +2474,9 @@ files:
|
|
2463
2474
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.html.erb
|
2464
2475
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.jsx
|
2465
2476
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.md
|
2477
|
+
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_strict_mode.html.erb
|
2478
|
+
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_strict_mode.jsx
|
2479
|
+
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_strict_mode.md
|
2466
2480
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.html.erb
|
2467
2481
|
- app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.jsx
|
2468
2482
|
- app/pb_kits/playbook/pb_phone_number_input/docs/example.yml
|
@@ -3280,7 +3294,8 @@ files:
|
|
3280
3294
|
- app/pb_kits/playbook/pb_title/docs/_title_responsive.md
|
3281
3295
|
- app/pb_kits/playbook/pb_title/docs/_title_truncate.html.erb
|
3282
3296
|
- app/pb_kits/playbook/pb_title/docs/_title_truncate.jsx
|
3283
|
-
- app/pb_kits/playbook/pb_title/docs/
|
3297
|
+
- app/pb_kits/playbook/pb_title/docs/_title_truncate_rails.md
|
3298
|
+
- app/pb_kits/playbook/pb_title/docs/_title_truncate_react.md
|
3284
3299
|
- app/pb_kits/playbook/pb_title/docs/example.yml
|
3285
3300
|
- app/pb_kits/playbook/pb_title/docs/index.js
|
3286
3301
|
- app/pb_kits/playbook/pb_title/title.html.erb
|
@@ -3337,8 +3352,10 @@ files:
|
|
3337
3352
|
- app/pb_kits/playbook/pb_toggle/toggle.test.js
|
3338
3353
|
- app/pb_kits/playbook/pb_tooltip/_tooltip.scss
|
3339
3354
|
- app/pb_kits/playbook/pb_tooltip/_tooltip.tsx
|
3355
|
+
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open.html.erb
|
3340
3356
|
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open.jsx
|
3341
|
-
- app/pb_kits/playbook/pb_tooltip/docs/
|
3357
|
+
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open_rails.md
|
3358
|
+
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_click_open_react.md
|
3342
3359
|
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default.html.erb
|
3343
3360
|
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default_react.jsx
|
3344
3361
|
- app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default_react.md
|
@@ -3404,8 +3421,10 @@ files:
|
|
3404
3421
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_margin_bottom.jsx
|
3405
3422
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_multi_kit.html.erb
|
3406
3423
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_multi_kit.jsx
|
3424
|
+
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input.html.erb
|
3407
3425
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input.jsx
|
3408
|
-
- app/pb_kits/playbook/pb_typeahead/docs/
|
3426
|
+
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input_rails.md
|
3427
|
+
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input_react.md
|
3409
3428
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.jsx
|
3410
3429
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.md
|
3411
3430
|
- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.html.erb
|
@@ -3612,11 +3631,12 @@ files:
|
|
3612
3631
|
- app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
|
3613
3632
|
- app/pb_kits/playbook/utilities/text.ts
|
3614
3633
|
- app/pb_kits/playbook/utilities/validEmojiChecker.ts
|
3615
|
-
- dist/chunks/
|
3616
|
-
- dist/chunks/
|
3634
|
+
- dist/chunks/_line_graph-BfCo79KE.js
|
3635
|
+
- dist/chunks/_typeahead-Db4YQA5c.js
|
3636
|
+
- dist/chunks/_weekday_stacked-DfH_cGOX.js
|
3617
3637
|
- dist/chunks/lazysizes-B7xYodB-.js
|
3618
|
-
- dist/chunks/lib-
|
3619
|
-
- dist/chunks/pb_form_validation-
|
3638
|
+
- dist/chunks/lib-DnQyMxO1.js
|
3639
|
+
- dist/chunks/pb_form_validation-kl-4Jv4t.js
|
3620
3640
|
- dist/chunks/vendor.js
|
3621
3641
|
- dist/menu.yml
|
3622
3642
|
- dist/playbook-doc.js
|
@@ -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.
|
@@ -1,38 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import circleChartTheme from '../circleChartTheme'
|
3
|
-
import Highcharts from "highcharts"
|
4
|
-
import HighchartsReact from "highcharts-react-official"
|
5
|
-
|
6
|
-
const data = [
|
7
|
-
{
|
8
|
-
name: 'Waiting for Calls',
|
9
|
-
y: 41,
|
10
|
-
},
|
11
|
-
{
|
12
|
-
name: 'On Call',
|
13
|
-
y: 49,
|
14
|
-
},
|
15
|
-
{
|
16
|
-
name: 'After Call',
|
17
|
-
y: 10,
|
18
|
-
},
|
19
|
-
]
|
20
|
-
|
21
|
-
const baseOptions = {
|
22
|
-
series: [{ data: data }],
|
23
|
-
}
|
24
|
-
|
25
|
-
const CircleChartPbStyles = () => {
|
26
|
-
const options = Highcharts.merge({}, circleChartTheme, baseOptions )
|
27
|
-
|
28
|
-
return (
|
29
|
-
<div>
|
30
|
-
<HighchartsReact
|
31
|
-
highcharts={Highcharts}
|
32
|
-
options={options}
|
33
|
-
/>
|
34
|
-
</div>
|
35
|
-
);
|
36
|
-
};
|
37
|
-
|
38
|
-
export default CircleChartPbStyles;
|
@@ -1 +0,0 @@
|
|
1
|
-
You don't need to use the Circle Chart Kit to apply Playbook styles to your Highcharts circle chart. Just import circleChartTheme.ts and merge it with your chart options—Playbook’s styling will apply automatically.
|
@@ -1,30 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import gaugeTheme from '../gaugeTheme'
|
3
|
-
import Highcharts from "highcharts"
|
4
|
-
import HighchartsReact from "highcharts-react-official"
|
5
|
-
import HighchartsMore from "highcharts/highcharts-more"
|
6
|
-
import SolidGauge from "highcharts/modules/solid-gauge"
|
7
|
-
|
8
|
-
HighchartsMore(Highcharts);
|
9
|
-
SolidGauge(Highcharts);
|
10
|
-
|
11
|
-
const data = [{ name: "Name", y: 45 }]
|
12
|
-
|
13
|
-
const baseOptions = {
|
14
|
-
series: [{ data: data }],
|
15
|
-
};
|
16
|
-
|
17
|
-
const GaugePbStyles = () => {
|
18
|
-
const options = Highcharts.merge({}, gaugeTheme, baseOptions);
|
19
|
-
|
20
|
-
return (
|
21
|
-
<div>
|
22
|
-
<HighchartsReact
|
23
|
-
highcharts={Highcharts}
|
24
|
-
options={options}
|
25
|
-
/>
|
26
|
-
</div>
|
27
|
-
);
|
28
|
-
};
|
29
|
-
|
30
|
-
export default GaugePbStyles;
|
@@ -1 +0,0 @@
|
|
1
|
-
You don't need to use the Gauge Kit to apply Playbook styles to your Highcharts gauge chart. Just import gaugeTheme.ts and merge it with your chart options—Playbook’s styling will apply automatically.
|
@@ -1,52 +0,0 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
import lineGraphTheme from '../lineGraphTheme'
|
3
|
-
import Highcharts from "highcharts"
|
4
|
-
import HighchartsReact from "highcharts-react-official"
|
5
|
-
|
6
|
-
const data = [{
|
7
|
-
name: 'Installation',
|
8
|
-
data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175],
|
9
|
-
}, {
|
10
|
-
name: 'Manufacturing',
|
11
|
-
data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434],
|
12
|
-
}, {
|
13
|
-
name: 'Sales & Distribution',
|
14
|
-
data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387],
|
15
|
-
}, {
|
16
|
-
name: 'Project Development',
|
17
|
-
data: [null, null, 7988, 12169, 15112, 22452, 34400, 34227],
|
18
|
-
}, {
|
19
|
-
name: 'Other',
|
20
|
-
data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111],
|
21
|
-
}]
|
22
|
-
|
23
|
-
const categories = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
|
24
|
-
|
25
|
-
const baseOptions = {
|
26
|
-
series: data,
|
27
|
-
title: { text: "Solar Employment Growth by Sector, 2010-2016" },
|
28
|
-
subtitle: { text: "Source: thesolarfoundation.com" },
|
29
|
-
xAxis: {
|
30
|
-
categories: categories,
|
31
|
-
},
|
32
|
-
yAxis: {
|
33
|
-
title: {
|
34
|
-
text: "Number of Employees",
|
35
|
-
},
|
36
|
-
},
|
37
|
-
}
|
38
|
-
|
39
|
-
const LineGraphPbStyles = () => {
|
40
|
-
const options = Highcharts.merge({}, lineGraphTheme, baseOptions)
|
41
|
-
|
42
|
-
return(
|
43
|
-
<div>
|
44
|
-
<HighchartsReact
|
45
|
-
highcharts={Highcharts}
|
46
|
-
options={options}
|
47
|
-
/>
|
48
|
-
</div>
|
49
|
-
)
|
50
|
-
}
|
51
|
-
|
52
|
-
export default LineGraphPbStyles
|
@@ -1 +0,0 @@
|
|
1
|
-
You don't need to use the Line Graph Kit to apply Playbook styles to your Highcharts line graph. Just import lineGraphTheme.ts and merge it with your graph options—Playbook’s styling will apply automatically.
|