playbook_ui 14.13.0.pre.alpha.play1884progresspill6064 → 14.13.0.pre.alpha.rails8compatible6228

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.
Files changed (107) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/_playbook.scss +0 -1
  3. data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss +3 -0
  4. data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx +6 -5
  5. data/app/pb_kits/playbook/pb_advanced_table/advanced_table.rb +8 -1
  6. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_custom_cell.jsx +75 -0
  7. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.html.erb +1 -1
  8. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_rails.md +3 -1
  9. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_react.md +1 -1
  10. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.html.erb +33 -0
  11. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_rails.md +3 -0
  12. data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +2 -0
  13. data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +2 -1
  14. data/app/pb_kits/playbook/pb_bar_graph/BarGraphStyles.scss +58 -0
  15. data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.jsx +64 -0
  16. data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.md +1 -0
  17. data/app/pb_kits/playbook/pb_bar_graph/docs/example.yml +1 -0
  18. data/app/pb_kits/playbook/pb_bar_graph/docs/index.js +1 -0
  19. data/app/pb_kits/playbook/pb_checkbox/_checkbox.tsx +17 -8
  20. data/app/pb_kits/playbook/pb_checkbox/checkbox.test.js +16 -0
  21. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.jsx +69 -0
  22. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.md +1 -0
  23. data/app/pb_kits/playbook/pb_checkbox/docs/example.yml +2 -1
  24. data/app/pb_kits/playbook/pb_checkbox/docs/index.js +1 -0
  25. data/app/pb_kits/playbook/pb_date_picker/_date_picker.tsx +3 -1
  26. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.html.erb +2 -2
  27. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.md +4 -1
  28. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.jsx +90 -0
  29. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.md +5 -0
  30. data/app/pb_kits/playbook/pb_draggable/docs/example.yml +2 -0
  31. data/app/pb_kits/playbook/pb_draggable/docs/index.js +2 -1
  32. data/app/pb_kits/playbook/pb_draggable/subcomponents/DraggableContainer.tsx +7 -4
  33. data/app/pb_kits/playbook/pb_draggable/subcomponents/DraggableItem.tsx +6 -3
  34. data/app/pb_kits/playbook/pb_multi_level_select/multi_level_select.html.erb +1 -6
  35. data/app/pb_kits/playbook/pb_nav/item.html.erb +7 -19
  36. data/app/pb_kits/playbook/pb_nav/nav.html.erb +3 -8
  37. data/app/pb_kits/playbook/pb_online_status/online_status.html.erb +1 -6
  38. data/app/pb_kits/playbook/pb_overlay/_overlay.tsx +4 -0
  39. data/app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional.jsx +37 -0
  40. data/app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional_react.md +1 -0
  41. data/app/pb_kits/playbook/pb_overlay/docs/example.yml +1 -0
  42. data/app/pb_kits/playbook/pb_overlay/docs/index.js +1 -0
  43. data/app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_token.tsx +48 -10
  44. data/app/pb_kits/playbook/pb_popover/popover.html.erb +1 -6
  45. data/app/pb_kits/playbook/pb_progress_pills/_progress_pills.scss +4 -0
  46. data/app/pb_kits/playbook/pb_progress_pills/_progress_pills.tsx +7 -5
  47. data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width.html.erb +1 -0
  48. data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width.jsx +18 -0
  49. data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width_rails.md +1 -0
  50. data/app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width_react.md +1 -0
  51. data/app/pb_kits/playbook/pb_progress_pills/docs/example.yml +2 -0
  52. data/app/pb_kits/playbook/pb_progress_pills/docs/index.js +1 -0
  53. data/app/pb_kits/playbook/pb_progress_pills/progress_pills.html.erb +2 -7
  54. data/app/pb_kits/playbook/pb_progress_pills/progress_pills.rb +6 -0
  55. data/app/pb_kits/playbook/pb_progress_pills/progress_pills.test.js +26 -1
  56. data/app/pb_kits/playbook/pb_progress_simple/progress_simple.html.erb +1 -5
  57. data/app/pb_kits/playbook/pb_progress_step/progress_step.html.erb +1 -5
  58. data/app/pb_kits/playbook/pb_progress_step/progress_step_item.html.erb +1 -5
  59. data/app/pb_kits/playbook/pb_radio/radio.html.erb +6 -11
  60. data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible.jsx +1 -1
  61. data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.html.erb +51 -0
  62. data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click_rails.md +2 -0
  63. data/app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.html.erb +96 -0
  64. data/app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.jsx +101 -0
  65. data/app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.md +1 -0
  66. data/app/pb_kits/playbook/pb_table/docs/example.yml +4 -1
  67. data/app/pb_kits/playbook/pb_table/docs/index.js +2 -1
  68. data/app/pb_kits/playbook/pb_table/index.ts +41 -9
  69. data/app/pb_kits/playbook/pb_table/styles/_collapsible.scss +4 -0
  70. data/app/pb_kits/playbook/pb_table/subcomponents/_table_body.tsx +29 -2
  71. data/app/pb_kits/playbook/pb_table/subcomponents/_table_row.tsx +31 -3
  72. data/app/pb_kits/playbook/pb_table/table_body.html.erb +13 -7
  73. data/app/pb_kits/playbook/pb_table/table_body.rb +2 -0
  74. data/app/pb_kits/playbook/pb_table/table_row.html.erb +14 -7
  75. data/app/pb_kits/playbook/pb_table/table_row.rb +14 -1
  76. data/app/pb_kits/playbook/pb_text_input/docs/_text_input_mask.html.erb +14 -0
  77. data/app/pb_kits/playbook/pb_text_input/index.js +9 -0
  78. data/app/pb_kits/playbook/pb_text_input/text_input.rb +5 -2
  79. data/dist/chunks/{_typeahead-btjo1UN5.js → _typeahead-PqkcDf1H.js} +4 -4
  80. data/dist/chunks/{_weekday_stacked-TIh9nTmZ.js → _weekday_stacked-C7J0S4f7.js} +3 -3
  81. data/dist/chunks/{lib-DjpLC8uO.js → lib-D3us1bGD.js} +2 -2
  82. data/dist/chunks/{pb_form_validation-S56UaHZl.js → pb_form_validation-BpihMSOQ.js} +1 -1
  83. data/dist/chunks/vendor.js +1 -1
  84. data/dist/menu.yml +0 -7
  85. data/dist/playbook-doc.js +1 -1
  86. data/dist/playbook-rails-react-bindings.js +1 -1
  87. data/dist/playbook-rails.js +1 -1
  88. data/dist/playbook.css +1 -1
  89. data/lib/playbook/version.rb +1 -1
  90. metadata +36 -25
  91. data/app/pb_kits/playbook/pb_avatar_action_button/_avatar_action_button.scss +0 -66
  92. data/app/pb_kits/playbook/pb_avatar_action_button/_avatar_action_button.tsx +0 -98
  93. data/app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.html.erb +0 -28
  94. data/app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.rb +0 -42
  95. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.html.erb +0 -19
  96. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.jsx +0 -26
  97. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_default.html.erb +0 -10
  98. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_default.jsx +0 -17
  99. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_on_click.jsx +0 -19
  100. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_onclick.html.erb +0 -16
  101. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.html.erb +0 -35
  102. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.jsx +0 -42
  103. data/app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_tooltip.html.erb +0 -13
  104. data/app/pb_kits/playbook/pb_avatar_action_button/docs/example.yml +0 -15
  105. data/app/pb_kits/playbook/pb_avatar_action_button/docs/index.js +0 -4
  106. data/app/pb_kits/playbook/pb_avatar_action_button/pb_avatar_action_button.test.js +0 -31
  107. /data/app/pb_kits/playbook/pb_table/docs/{_table_with_collapsible_with_custom_click.md → _table_with_collapsible_with_custom_click_react.md} +0 -0
@@ -2,5 +2,5 @@
2
2
 
3
3
  module Playbook
4
4
  PREVIOUS_VERSION = "14.13.0"
5
- VERSION = "14.13.0.pre.alpha.play1884progresspill6064"
5
+ VERSION = "14.13.0.pre.alpha.rails8compatible6228"
6
6
  end
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.13.0.pre.alpha.play1884progresspill6064
4
+ version: 14.13.0.pre.alpha.rails8compatible6228
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-02-11 00:00:00.000000000 Z
12
+ date: 2025-02-21 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -71,16 +71,22 @@ dependencies:
71
71
  name: view_component
72
72
  requirement: !ruby/object:Gem::Requirement
73
73
  requirements:
74
- - - '='
74
+ - - ">="
75
75
  - !ruby/object:Gem::Version
76
76
  version: 2.83.0
77
+ - - "<"
78
+ - !ruby/object:Gem::Version
79
+ version: '3.0'
77
80
  type: :runtime
78
81
  prerelease: false
79
82
  version_requirements: !ruby/object:Gem::Requirement
80
83
  requirements:
81
- - - '='
84
+ - - ">="
82
85
  - !ruby/object:Gem::Version
83
86
  version: 2.83.0
87
+ - - "<"
88
+ - !ruby/object:Gem::Version
89
+ version: '3.0'
84
90
  - !ruby/object:Gem::Dependency
85
91
  name: webpacker-react
86
92
  requirement: !ruby/object:Gem::Requirement
@@ -288,6 +294,7 @@ files:
288
294
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers.html.erb
289
295
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers.jsx
290
296
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers.md
297
+ - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_custom_cell.jsx
291
298
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_multiple.html.erb
292
299
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_multiple.jsx
293
300
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_multiple.md
@@ -333,7 +340,9 @@ files:
333
340
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.jsx
334
341
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_rails.md
335
342
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_react.md
343
+ - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.html.erb
336
344
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.jsx
345
+ - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_rails.md
337
346
  - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header_react.md
338
347
  - app/pb_kits/playbook/pb_advanced_table/docs/_mock_data_inline_loading.js
339
348
  - app/pb_kits/playbook/pb_advanced_table/docs/advanced_table_mock_data.json
@@ -384,22 +393,6 @@ files:
384
393
  - app/pb_kits/playbook/pb_avatar/docs/_footer.md
385
394
  - app/pb_kits/playbook/pb_avatar/docs/example.yml
386
395
  - app/pb_kits/playbook/pb_avatar/docs/index.js
387
- - app/pb_kits/playbook/pb_avatar_action_button/_avatar_action_button.scss
388
- - app/pb_kits/playbook/pb_avatar_action_button/_avatar_action_button.tsx
389
- - app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.html.erb
390
- - app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.rb
391
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.html.erb
392
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_actions.jsx
393
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_default.html.erb
394
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_default.jsx
395
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_on_click.jsx
396
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_onclick.html.erb
397
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.html.erb
398
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_placement.jsx
399
- - app/pb_kits/playbook/pb_avatar_action_button/docs/_avatar_action_button_tooltip.html.erb
400
- - app/pb_kits/playbook/pb_avatar_action_button/docs/example.yml
401
- - app/pb_kits/playbook/pb_avatar_action_button/docs/index.js
402
- - app/pb_kits/playbook/pb_avatar_action_button/pb_avatar_action_button.test.js
403
396
  - app/pb_kits/playbook/pb_background/_background.scss
404
397
  - app/pb_kits/playbook/pb_background/_background.tsx
405
398
  - app/pb_kits/playbook/pb_background/background.html.erb
@@ -450,6 +443,7 @@ files:
450
443
  - app/pb_kits/playbook/pb_badge/docs/_description.md
451
444
  - app/pb_kits/playbook/pb_badge/docs/example.yml
452
445
  - app/pb_kits/playbook/pb_badge/docs/index.js
446
+ - app/pb_kits/playbook/pb_bar_graph/BarGraphStyles.scss
453
447
  - app/pb_kits/playbook/pb_bar_graph/_bar_graph.scss
454
448
  - app/pb_kits/playbook/pb_bar_graph/_bar_graph.tsx
455
449
  - app/pb_kits/playbook/pb_bar_graph/barGraph.test.js
@@ -478,6 +472,8 @@ files:
478
472
  - app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_position.md
479
473
  - app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.html.erb
480
474
  - app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_negative_numbers.jsx
475
+ - app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.jsx
476
+ - app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_pb_styles.md
481
477
  - app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.html.erb
482
478
  - app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.jsx
483
479
  - app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_secondary_y_axis.md
@@ -682,6 +678,8 @@ files:
682
678
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate_swift.md
683
679
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_options.html.erb
684
680
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_props_swift.md
681
+ - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.jsx
682
+ - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.md
685
683
  - app/pb_kits/playbook/pb_checkbox/docs/_description.md
686
684
  - app/pb_kits/playbook/pb_checkbox/docs/example.yml
687
685
  - app/pb_kits/playbook/pb_checkbox/docs/index.js
@@ -1187,6 +1185,8 @@ files:
1187
1185
  - app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list_rails.md
1188
1186
  - app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.html.erb
1189
1187
  - app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table.md
1188
+ - app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.jsx
1189
+ - app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.md
1190
1190
  - app/pb_kits/playbook/pb_draggable/docs/example.yml
1191
1191
  - app/pb_kits/playbook/pb_draggable/docs/index.js
1192
1192
  - app/pb_kits/playbook/pb_draggable/draggable.html.erb
@@ -2122,6 +2122,8 @@ files:
2122
2122
  - app/pb_kits/playbook/pb_overlay/docs/_overlay_toggle.html.erb
2123
2123
  - app/pb_kits/playbook/pb_overlay/docs/_overlay_toggle.jsx
2124
2124
  - app/pb_kits/playbook/pb_overlay/docs/_overlay_toggle.md
2125
+ - app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional.jsx
2126
+ - app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional_react.md
2125
2127
  - app/pb_kits/playbook/pb_overlay/docs/example.yml
2126
2128
  - app/pb_kits/playbook/pb_overlay/docs/index.js
2127
2129
  - app/pb_kits/playbook/pb_overlay/overlay.html.erb
@@ -2277,6 +2279,10 @@ files:
2277
2279
  - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.html.erb
2278
2280
  - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.jsx
2279
2281
  - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_default.md
2282
+ - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width.html.erb
2283
+ - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width.jsx
2284
+ - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width_rails.md
2285
+ - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_full_width_react.md
2280
2286
  - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_status.html.erb
2281
2287
  - app/pb_kits/playbook/pb_progress_pills/docs/_progress_pills_status.jsx
2282
2288
  - app/pb_kits/playbook/pb_progress_pills/docs/example.yml
@@ -2752,8 +2758,10 @@ files:
2752
2758
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible.jsx
2753
2759
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_rails.md
2754
2760
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_react.md
2761
+ - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.html.erb
2755
2762
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.jsx
2756
- - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.md
2763
+ - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click_rails.md
2764
+ - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click_react.md
2757
2765
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content.jsx
2758
2766
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content.md
2759
2767
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content_rails.html.erb
@@ -2766,6 +2774,9 @@ files:
2766
2774
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table.md
2767
2775
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.html.erb
2768
2776
  - app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table_rails.md
2777
+ - app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.html.erb
2778
+ - app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.jsx
2779
+ - app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.md
2769
2780
  - app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.jsx
2770
2781
  - app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents.md
2771
2782
  - app/pb_kits/playbook/pb_table/docs/_table_with_subcomponents_as_divs.html.erb
@@ -3337,11 +3348,11 @@ files:
3337
3348
  - app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
3338
3349
  - app/pb_kits/playbook/utilities/text.ts
3339
3350
  - app/pb_kits/playbook/utilities/validEmojiChecker.ts
3340
- - dist/chunks/_typeahead-btjo1UN5.js
3341
- - dist/chunks/_weekday_stacked-TIh9nTmZ.js
3351
+ - dist/chunks/_typeahead-PqkcDf1H.js
3352
+ - dist/chunks/_weekday_stacked-C7J0S4f7.js
3342
3353
  - dist/chunks/lazysizes-B7xYodB-.js
3343
- - dist/chunks/lib-DjpLC8uO.js
3344
- - dist/chunks/pb_form_validation-S56UaHZl.js
3354
+ - dist/chunks/lib-D3us1bGD.js
3355
+ - dist/chunks/pb_form_validation-BpihMSOQ.js
3345
3356
  - dist/chunks/vendor.js
3346
3357
  - dist/menu.yml
3347
3358
  - dist/playbook-doc.js
@@ -1,66 +0,0 @@
1
- [class^=pb_avatar_action_button_kit] {
2
-
3
- $icon_size: 0px;
4
- $border_size: 0px;
5
-
6
- $action-colors: (
7
- "add": $primary,
8
- "remove": $error,
9
- );
10
-
11
- @each $key, $value in $action-colors {
12
- &[class*=_#{$key}] a {
13
- color: $value;
14
- }
15
- }
16
-
17
- @mixin icon-base {
18
- &.dark{
19
- background-color: $bg_dark
20
- }
21
- width: $icon_size;
22
- height: $icon_size;
23
- position: absolute;
24
- background-color: $white;
25
- border-radius: $icon_size;
26
- font-size: ($icon_size - $border_size * 2);
27
- display: flex;
28
- justify-content: center;
29
- align-items: center;
30
- z-index: 1;
31
- }
32
-
33
- @each $name, $size in $avatar-sizes {
34
-
35
- &[class*=_#{$name}] {
36
-
37
- $avatar_size: map-get($avatar-sizes, $name);
38
- $icon_size: $avatar_size / 2;
39
- $border_size: $icon_size / 10;
40
-
41
- position: relative;
42
- width: $avatar_size * 1.25;
43
- height: $avatar_size * 1.1;
44
- display: flex;
45
-
46
- [class^=pb_tooltip_kit] {
47
- justify-self: center;
48
- }
49
-
50
- &[class*=_bottom] .icon {
51
- @include icon-base;
52
- top: $icon_size * 1.27;
53
- }
54
- &[class*=_top] .icon {
55
- @include icon-base;
56
- bottom: $icon_size * 1.27;
57
- }
58
- &[class*=_right] .icon {
59
- left: $icon_size * 1.5;
60
- }
61
- &[class*=_left] [class^=pb_avatar_kit] {
62
- padding-left: $icon_size / 2;
63
- }
64
- }
65
- }
66
- }
@@ -1,98 +0,0 @@
1
- import React from 'react'
2
- import classnames from 'classnames'
3
-
4
- import {
5
- buildAriaProps,
6
- buildCss,
7
- buildDataProps,
8
- buildHtmlProps } from '../utilities/props'
9
- import { globalProps } from '../utilities/globalProps'
10
-
11
- import Avatar from '../pb_avatar/_avatar'
12
- import Icon from '../pb_icon/_icon'
13
-
14
- type AvatarActionButtonProps = {
15
- action?: "add" | "remove",
16
- aria?: {[key: string]: string},
17
- linkAriaLabel?: string,
18
- className?: string,
19
- dark?: boolean,
20
- data?: {[key: string]: string},
21
- htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
22
- id?: string,
23
- imageAlt?: string,
24
- imageUrl?: string,
25
- linkUrl?: string,
26
- name?: string,
27
- onClick?: React.MouseEventHandler<HTMLSpanElement>,
28
- placement?: string,
29
- size?: "md" | "lg" | "sm" | "xl" | "xs" | "xxs",
30
- }
31
-
32
- const AvatarActionButton = (props: AvatarActionButtonProps): React.ReactElement => {
33
- const {
34
- action = 'add',
35
- aria = {},
36
- linkAriaLabel,
37
- className,
38
- dark = false,
39
- data = {},
40
- htmlOptions = {},
41
- id,
42
- imageAlt = '',
43
- imageUrl,
44
- linkUrl,
45
- name,
46
- onClick,
47
- placement = 'bottom left',
48
- size = 'md',
49
- } = props
50
-
51
- const ariaProps = buildAriaProps(aria)
52
- const dataProps = buildDataProps(data)
53
- const htmlProps = buildHtmlProps(htmlOptions)
54
-
55
- const classes = classnames(buildCss(
56
- 'pb_avatar_action_button_kit',
57
- action,
58
- placement,
59
- size),
60
- globalProps(props),
61
- className)
62
-
63
- const icons = {
64
- add: 'plus-circle',
65
- remove: 'times-circle',
66
- }
67
-
68
- return (
69
- <div
70
- {...ariaProps}
71
- {...dataProps}
72
- {...htmlProps}
73
- className={classes}
74
- id={id}
75
- >
76
- <a
77
- aria-label={linkAriaLabel}
78
- href={linkUrl}
79
- onClick={onClick}
80
- >
81
- <Avatar
82
- imageAlt={imageAlt}
83
- imageUrl={imageUrl}
84
- name={name}
85
- size={size}
86
- />
87
- <div className={`icon ${dark ? 'dark' : ''}`}>
88
- <Icon
89
- dark={dark}
90
- icon={icons[action]}
91
- />
92
- </div>
93
- </a>
94
- </div>
95
- )
96
- }
97
-
98
- export default AvatarActionButton
@@ -1,28 +0,0 @@
1
- <%= pb_content_tag do %>
2
- <% if object.tooltip_text.present? %>
3
- <%= pb_rails("tooltip", props: {
4
- trigger_element_id: object.tooltip_id,
5
- tooltip_id: "tooltip-2",
6
- position: 'top'
7
- }) do %>
8
- <%= object.tooltip_text %>
9
- <% end %>
10
- <% end %>
11
-
12
- <%= link_to object.link_url, id: object.tooltip_id, 'aria-label': object.link_aria_label do %>
13
- <%= pb_rails("avatar", props: {
14
- dark: object.dark,
15
- name: object.name,
16
- size: object.size,
17
- image_alt: object.image_alt,
18
- image_url: object.image_url,
19
- class: "avatar_action"
20
- }) %>
21
- <div class="icon <%= object.dark ? 'dark' : '' %> ">
22
- <%= pb_rails("icon", props: {
23
- dark: object.dark,
24
- icon: object.action_icons
25
- }) %>
26
- </div>
27
- <% end %>
28
- <% end %>
@@ -1,42 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Playbook
4
- module PbAvatarActionButton
5
- class AvatarActionButton < Playbook::KitBase
6
- prop :action, type: Playbook::Props::String,
7
- default: "add"
8
- prop :link_aria_label, type: Playbook::Props::String
9
- prop :image_alt, type: Playbook::Props::String
10
- prop :image_url, type: Playbook::Props::String
11
- prop :link_url, type: Playbook::Props::String, default: "#"
12
- prop :tooltip_text, type: Playbook::Props::String
13
- prop :tooltip_id, type: Playbook::Props::String
14
- prop :name, type: Playbook::Props::String,
15
- default: ""
16
- prop :size, type: Playbook::Props::Enum,
17
- values: %w[xs sm md lg xl],
18
- default: "md"
19
- prop :placement, type: Playbook::Props::Enum,
20
- values: %w[bottom_left bottom_right top_left top_right],
21
- default: "bottom_left"
22
-
23
- def classname
24
- generate_classname("pb_avatar_action_button_kit", action, size, placement)
25
- end
26
-
27
- def action_icons
28
- icon_hash = {
29
- add: "plus-circle",
30
- remove: "times-circle",
31
- }
32
- # if an 'action' prop is passed that isn't
33
- # in the icon_hash an empty string is returned
34
- # instead of a null value, which would break the page
35
-
36
- # double pipe ruby syntax below is essentially a reduced if-else statement
37
- # if icon_hash[action.to_sym] returns a falsey value, return "" instead
38
- icon_hash[action.to_sym] ||= ""
39
- end
40
- end
41
- end
42
- end
@@ -1,19 +0,0 @@
1
- <div class="pb--doc-demo-row">
2
-
3
- <%= pb_rails("avatar_action_button", props: {
4
- link_aria_label: "Add Sophia Carden",
5
- name: "Sophia Carden",
6
- image_alt: "Add Sophia Carden",
7
- image_url: "https://randomuser.me/api/portraits/women/8.jpg",
8
- action: "add",
9
- }) %>
10
-
11
- <%= pb_rails("avatar_action_button", props: {
12
- link_aria_label: "Remove Sophia Carden",
13
- name: "Sophia Carden",
14
- image_alt: "Remove Sophia Carden",
15
- image_url: "https://randomuser.me/api/portraits/women/8.jpg",
16
- action: "remove",
17
- }) %>
18
-
19
- </div>
@@ -1,26 +0,0 @@
1
- import React from 'react'
2
-
3
- import AvatarActionButton from '../_avatar_action_button'
4
-
5
- const AvatarActionButtonActions = (props) => (
6
- <div className="pb--doc-demo-row">
7
- <AvatarActionButton
8
- action="add"
9
- imageAlt="Add Sophia Carden"
10
- imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
11
- linkAriaLabel="Add Sophia Carden"
12
- name="Sophia Carden"
13
- {...props}
14
- />
15
- <AvatarActionButton
16
- action="remove"
17
- imageAlt="Remove Sophia Carden"
18
- imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
19
- linkAriaLabel="Remove Sophia Carden"
20
- name="Sophia Carden"
21
- {...props}
22
- />
23
- </div>
24
- )
25
-
26
- export default AvatarActionButtonActions
@@ -1,10 +0,0 @@
1
- <div class="pb--doc-demo-row">
2
-
3
- <%= pb_rails("avatar_action_button", props: {
4
- link_aria_label: "Sophia Carden",
5
- name: "Sophia Carden",
6
- image_alt: "Sophia Carden",
7
- image_url: "https://randomuser.me/api/portraits/women/8.jpg"
8
- }) %>
9
-
10
- </div>
@@ -1,17 +0,0 @@
1
- import React from 'react'
2
-
3
- import AvatarActionButton from '../_avatar_action_button'
4
-
5
- const AvatarActionButtonDefault = (props) => (
6
- <div className="pb--doc-demo-row">
7
- <AvatarActionButton
8
- imageAlt="Sophia Carden"
9
- imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
10
- linkAriaLabel="Sophia Carden"
11
- name="Sophia Carden"
12
- {...props}
13
- />
14
- </div>
15
- )
16
-
17
- export default AvatarActionButtonDefault
@@ -1,19 +0,0 @@
1
- import React from 'react'
2
-
3
- import AvatarActionButton from '../_avatar_action_button'
4
-
5
- const AvatarActionButtonOnClick = (props) => (
6
- <div className="pb--doc-demo-row">
7
- <AvatarActionButton
8
- imageAlt="Sophia Carden"
9
- imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
10
- linkAriaLabel="Alert Sophia Carden"
11
- linkUrl="https://www.google.com"
12
- name="Sophia Carden"
13
- onClick={() => alert('clicked!')}
14
- {...props}
15
- />
16
- </div>
17
- )
18
-
19
- export default AvatarActionButtonOnClick
@@ -1,16 +0,0 @@
1
- <div class="pb--doc-demo-row">
2
-
3
- <%= pb_rails("avatar_action_button", props: {
4
- link_aria_label: "Alert Sophia Carden",
5
- name: "Sophia Carden",
6
- id: "clickable",
7
- link_url: "http://www.google.com",
8
- image_alt: "Sophia Carden",
9
- image_url: "https://randomuser.me/api/portraits/women/8.jpg",
10
- }) %>
11
-
12
- <%= javascript_tag do %>
13
- document.querySelector('#clickable').addEventListener('click', () => alert('clickable clicked!'))
14
- <% end %>
15
-
16
- </div>
@@ -1,35 +0,0 @@
1
- <div class="pb--doc-demo-row">
2
-
3
- <%= pb_rails("avatar_action_button", props: {
4
- link_aria_label: "Sophia Carden",
5
- name: "Sophia Carden",
6
- image_alt: "Sophia Carden",
7
- image_url: "https://randomuser.me/api/portraits/women/8.jpg",
8
- placement: "bottom_left"
9
- }) %>
10
-
11
- <%= pb_rails("avatar_action_button", props: {
12
- link_aria_label: "Sophia Carden",
13
- name: "Sophia Carden",
14
- image_alt: "Sophia Carden",
15
- image_url: "https://randomuser.me/api/portraits/women/8.jpg",
16
- placement: "bottom_right"
17
- }) %>
18
-
19
- <%= pb_rails("avatar_action_button", props: {
20
- link_aria_label: "Sophia Carden",
21
- name: "Sophia Carden",
22
- image_alt: "Sophia Carden",
23
- image_url: "https://randomuser.me/api/portraits/women/8.jpg",
24
- placement: "top_left"
25
- }) %>
26
-
27
- <%= pb_rails("avatar_action_button", props: {
28
- link_aria_label: "Sophia Carden",
29
- name: "Sophia Carden",
30
- image_alt: "Sophia Carden",
31
- image_url: "https://randomuser.me/api/portraits/women/8.jpg",
32
- placement: "top_right"
33
- }) %>
34
-
35
- </div>
@@ -1,42 +0,0 @@
1
- import React from 'react'
2
-
3
- import AvatarActionButton from '../_avatar_action_button'
4
-
5
- const AvatarActionButtonPlacement = (props) => (
6
- <div className="pb--doc-demo-row">
7
- <AvatarActionButton
8
- imageAlt="Sophia Carden"
9
- imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
10
- linkAriaLabel="Sophia Carden"
11
- name="Sophia Carden"
12
- placement="bottom_left"
13
- {...props}
14
- />
15
- <AvatarActionButton
16
- imageAlt="Sophia Carden"
17
- imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
18
- linkAriaLabel="Sophia Carden"
19
- name="Sophia Carden"
20
- placement="bottom_right"
21
- {...props}
22
- />
23
- <AvatarActionButton
24
- imageAlt="Sophia Carden"
25
- imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
26
- linkAriaLabel="Sophia Carden"
27
- name="Sophia Carden"
28
- placement="top_left"
29
- {...props}
30
- />
31
- <AvatarActionButton
32
- imageAlt="Sophia Carden"
33
- imageUrl="https://randomuser.me/api/portraits/women/8.jpg"
34
- linkAriaLabel="Sophia Carden"
35
- name="Sophia Carden"
36
- placement="top_right"
37
- {...props}
38
- />
39
- </div>
40
- )
41
-
42
- export default AvatarActionButtonPlacement
@@ -1,13 +0,0 @@
1
- <div class="pb--doc-demo-row">
2
-
3
- <%= pb_rails("avatar_action_button", props: {
4
- link_aria_label: "Sophia Carden",
5
- name: "Sophia Carden",
6
- link_url: "http://www.google.com",
7
- image_alt: "Sophia Carden",
8
- image_url: "https://randomuser.me/api/portraits/women/8.jpg",
9
- tooltip_text: "Tooltip Text",
10
- tooltip_id: "avatar_1",
11
- }) %>
12
-
13
- </div>
@@ -1,15 +0,0 @@
1
- examples:
2
-
3
- rails:
4
- - avatar_action_button_default: Default
5
- - avatar_action_button_placement: Placement
6
- - avatar_action_button_actions: Actions
7
- - avatar_action_button_onclick: On Click
8
- - avatar_action_button_tooltip: Tooltip
9
-
10
-
11
- react:
12
- - avatar_action_button_default: Default
13
- - avatar_action_button_placement: Placement
14
- - avatar_action_button_actions: Actions
15
- - avatar_action_button_on_click: On Click
@@ -1,4 +0,0 @@
1
- export { default as AvatarActionButtonDefault } from './_avatar_action_button_default.jsx'
2
- export { default as AvatarActionButtonPlacement } from './_avatar_action_button_placement.jsx'
3
- export { default as AvatarActionButtonActions } from './_avatar_action_button_actions.jsx'
4
- export { default as AvatarActionButtonOnClick } from './_avatar_action_button_on_click.jsx'