playbook_ui 13.25.0.pre.alpha.PBNTR291Dropdownrailsv22812 → 13.25.0.pre.alpha.PLAY761globalpaddingpropsbuttons2713

Sign up to get free protection for your applications and to get access to all the features.
Files changed (210) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/index.js +0 -1
  3. data/app/pb_kits/playbook/pb_advanced_table/advanced_table.html.erb +14 -10
  4. data/app/pb_kits/playbook/pb_advanced_table/table_body.html.erb +9 -5
  5. data/app/pb_kits/playbook/pb_advanced_table/table_header.html.erb +6 -2
  6. data/app/pb_kits/playbook/pb_advanced_table/table_row.html.erb +6 -2
  7. data/app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.html.erb +6 -1
  8. data/app/pb_kits/playbook/pb_background/background.html.erb +11 -2
  9. data/app/pb_kits/playbook/pb_badge/badge.html.erb +6 -1
  10. data/app/pb_kits/playbook/pb_bar_graph/_bar_graph.tsx +1 -1
  11. data/app/pb_kits/playbook/pb_body/_body.tsx +1 -1
  12. data/app/pb_kits/playbook/pb_body/body.html.erb +6 -1
  13. data/app/pb_kits/playbook/pb_bread_crumbs/bread_crumb_item.html.erb +6 -1
  14. data/app/pb_kits/playbook/pb_bread_crumbs/bread_crumbs.html.erb +7 -2
  15. data/app/pb_kits/playbook/pb_button/button.html.erb +3 -2
  16. data/app/pb_kits/playbook/pb_button_toolbar/button_toolbar.html.erb +7 -2
  17. data/app/pb_kits/playbook/pb_caption/caption.html.erb +6 -1
  18. data/app/pb_kits/playbook/pb_card/card.html.erb +7 -1
  19. data/app/pb_kits/playbook/pb_card/card_body.html.erb +6 -1
  20. data/app/pb_kits/playbook/pb_card/card_header.html.erb +6 -1
  21. data/app/pb_kits/playbook/pb_checkbox/_checkbox.scss +0 -49
  22. data/app/pb_kits/playbook/pb_checkbox/_checkbox.tsx +0 -3
  23. data/app/pb_kits/playbook/pb_checkbox/checkbox.html.erb +6 -1
  24. data/app/pb_kits/playbook/pb_checkbox/checkbox.rb +1 -2
  25. data/app/pb_kits/playbook/pb_checkbox/checkbox.test.js +0 -14
  26. data/app/pb_kits/playbook/pb_checkbox/docs/example.yml +0 -2
  27. data/app/pb_kits/playbook/pb_checkbox/docs/index.js +0 -1
  28. data/app/pb_kits/playbook/pb_circle_icon_button/circle_icon_button.html.erb +6 -1
  29. data/app/pb_kits/playbook/pb_collapsible/collapsible.html.erb +6 -1
  30. data/app/pb_kits/playbook/pb_collapsible/collapsible_content.html.erb +6 -1
  31. data/app/pb_kits/playbook/pb_collapsible/collapsible_main.html.erb +7 -1
  32. data/app/pb_kits/playbook/pb_contact/contact.html.erb +6 -1
  33. data/app/pb_kits/playbook/pb_currency/currency.html.erb +6 -1
  34. data/app/pb_kits/playbook/pb_currency/docs/example.yml +0 -5
  35. data/app/pb_kits/playbook/pb_dashboard_value/dashboard_value.html.erb +6 -1
  36. data/app/pb_kits/playbook/pb_date/date.html.erb +6 -1
  37. data/app/pb_kits/playbook/pb_date_picker/date_picker.html.erb +6 -2
  38. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_on_change.md +1 -3
  39. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_on_close.md +1 -3
  40. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick_range_limit.md +1 -1
  41. data/app/pb_kits/playbook/pb_date_range_inline/date_range_inline.html.erb +5 -1
  42. data/app/pb_kits/playbook/pb_date_range_stacked/date_range_stacked.html.erb +5 -1
  43. data/app/pb_kits/playbook/pb_date_range_stacked/docs/example.yml +0 -4
  44. data/app/pb_kits/playbook/pb_date_stacked/date_stacked.html.erb +5 -1
  45. data/app/pb_kits/playbook/pb_date_time/date_time.html.erb +6 -1
  46. data/app/pb_kits/playbook/pb_date_time_stacked/date_time_stacked.html.erb +7 -1
  47. data/app/pb_kits/playbook/pb_date_year_stacked/date_year_stacked.html.erb +5 -1
  48. data/app/pb_kits/playbook/pb_detail/detail.html.erb +6 -1
  49. data/app/pb_kits/playbook/pb_dialog/_dialog.scss +2 -4
  50. data/app/pb_kits/playbook/pb_dialog/dialog.html.erb +6 -1
  51. data/app/pb_kits/playbook/pb_dialog/dialog_body.html.erb +7 -2
  52. data/app/pb_kits/playbook/pb_dialog/dialog_footer.html.erb +5 -1
  53. data/app/pb_kits/playbook/pb_dialog/dialog_header.html.erb +6 -2
  54. data/app/pb_kits/playbook/pb_dropdown/_dropdown.scss +35 -101
  55. data/app/pb_kits/playbook/pb_dropdown/_dropdown.tsx +26 -93
  56. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx +22 -4
  57. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx +4 -6
  58. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.jsx +9 -6
  59. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.jsx +5 -5
  60. data/app/pb_kits/playbook/pb_dropdown/docs/example.yml +2 -16
  61. data/app/pb_kits/playbook/pb_dropdown/docs/index.js +0 -7
  62. data/app/pb_kits/playbook/pb_dropdown/dropdown.test.jsx +10 -200
  63. data/app/pb_kits/playbook/pb_dropdown/hooks/useDropdown.tsx +2 -2
  64. data/app/pb_kits/playbook/pb_dropdown/hooks/useHandleOnKeydown.tsx +9 -14
  65. data/app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownContainer.tsx +8 -22
  66. data/app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownOption.tsx +29 -56
  67. data/app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownTrigger.tsx +68 -130
  68. data/app/pb_kits/playbook/pb_dropdown/utilities/subComponentHelper.tsx +7 -9
  69. data/app/pb_kits/playbook/pb_file_upload/file_upload.html.erb +6 -1
  70. data/app/pb_kits/playbook/pb_filter/filter.html.erb +5 -1
  71. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/fixed_confirmation_toast.html.erb +6 -1
  72. data/app/pb_kits/playbook/pb_flex/flex.html.erb +5 -1
  73. data/app/pb_kits/playbook/pb_flex/flex_item.html.erb +6 -2
  74. data/app/pb_kits/playbook/pb_form_group/form_group.html.erb +6 -1
  75. data/app/pb_kits/playbook/pb_form_pill/form_pill.html.erb +1 -1
  76. data/app/pb_kits/playbook/pb_hashtag/hashtag.html.erb +6 -1
  77. data/app/pb_kits/playbook/pb_highlight/highlight.html.erb +5 -1
  78. data/app/pb_kits/playbook/pb_home_address_street/home_address_street.html.erb +5 -1
  79. data/app/pb_kits/playbook/pb_icon_circle/icon_circle.html.erb +7 -2
  80. data/app/pb_kits/playbook/pb_icon_stat_value/icon_stat_value.html.erb +6 -1
  81. data/app/pb_kits/playbook/pb_icon_value/icon_value.html.erb +6 -1
  82. data/app/pb_kits/playbook/pb_label_pill/label_pill.html.erb +6 -1
  83. data/app/pb_kits/playbook/pb_label_value/label_value.html.erb +6 -1
  84. data/app/pb_kits/playbook/pb_layout/body.html.erb +5 -1
  85. data/app/pb_kits/playbook/pb_layout/footer.html.erb +5 -1
  86. data/app/pb_kits/playbook/pb_layout/header.html.erb +5 -1
  87. data/app/pb_kits/playbook/pb_layout/item.html.erb +5 -1
  88. data/app/pb_kits/playbook/pb_layout/layout.html.erb +5 -1
  89. data/app/pb_kits/playbook/pb_layout/sidebar.html.erb +5 -1
  90. data/app/pb_kits/playbook/pb_list/item.html.erb +8 -2
  91. data/app/pb_kits/playbook/pb_list/list.html.erb +8 -2
  92. data/app/pb_kits/playbook/pb_loading_inline/loading_inline.html.erb +6 -1
  93. data/app/pb_kits/playbook/pb_message/message.html.erb +6 -1
  94. data/app/pb_kits/playbook/pb_message/message_mention.html.erb +6 -1
  95. data/app/pb_kits/playbook/pb_multi_level_select/multi_level_select.html.erb +6 -1
  96. data/app/pb_kits/playbook/pb_multiple_users/multiple_users.html.erb +6 -1
  97. data/app/pb_kits/playbook/pb_multiple_users_stacked/multiple_users_stacked.html.erb +6 -1
  98. data/app/pb_kits/playbook/pb_nav/item.html.erb +14 -3
  99. data/app/pb_kits/playbook/pb_nav/nav.html.erb +6 -1
  100. data/app/pb_kits/playbook/pb_online_status/online_status.html.erb +6 -2
  101. data/app/pb_kits/playbook/pb_pagination/pagination.html.erb +6 -1
  102. data/app/pb_kits/playbook/pb_passphrase/passphrase.html.erb +1 -1
  103. data/app/pb_kits/playbook/pb_person/person.html.erb +12 -7
  104. data/app/pb_kits/playbook/pb_person_contact/person_contact.html.erb +6 -1
  105. data/app/pb_kits/playbook/pb_pill/pill.html.erb +6 -1
  106. data/app/pb_kits/playbook/pb_popover/popover.html.erb +6 -1
  107. data/app/pb_kits/playbook/pb_progress_pills/progress_pills.html.erb +6 -2
  108. data/app/pb_kits/playbook/pb_progress_simple/docs/example.yml +0 -2
  109. data/app/pb_kits/playbook/pb_progress_simple/docs/index.js +0 -1
  110. data/app/pb_kits/playbook/pb_progress_simple/progress_simple.html.erb +6 -3
  111. data/app/pb_kits/playbook/pb_progress_simple/progress_simple.rb +1 -1
  112. data/app/pb_kits/playbook/pb_progress_step/progress_step.html.erb +5 -1
  113. data/app/pb_kits/playbook/pb_progress_step/progress_step_item.html.erb +5 -1
  114. data/app/pb_kits/playbook/pb_radio/_radio.scss +0 -35
  115. data/app/pb_kits/playbook/pb_radio/_radio.tsx +0 -3
  116. data/app/pb_kits/playbook/pb_radio/docs/_radio_alignment.jsx +1 -4
  117. data/app/pb_kits/playbook/pb_radio/docs/_radio_default.jsx +1 -4
  118. data/app/pb_kits/playbook/pb_radio/docs/_radio_error.jsx +1 -2
  119. data/app/pb_kits/playbook/pb_radio/docs/example.yml +0 -2
  120. data/app/pb_kits/playbook/pb_radio/docs/index.js +0 -1
  121. data/app/pb_kits/playbook/pb_radio/radio.html.erb +8 -2
  122. data/app/pb_kits/playbook/pb_radio/radio.rb +0 -5
  123. data/app/pb_kits/playbook/pb_radio/radio.test.js +0 -17
  124. data/app/pb_kits/playbook/pb_section_separator/_section_separator.scss +2 -6
  125. data/app/pb_kits/playbook/pb_section_separator/_section_separator_mixin.scss +1 -11
  126. data/app/pb_kits/playbook/pb_section_separator/section_separator.html.erb +6 -1
  127. data/app/pb_kits/playbook/pb_select/select.html.erb +5 -1
  128. data/app/pb_kits/playbook/pb_selectable_card/selectable_card.html.erb +5 -1
  129. data/app/pb_kits/playbook/pb_selectable_card_icon/selectable_card_icon.html.erb +4 -1
  130. data/app/pb_kits/playbook/pb_selectable_icon/selectable_icon.html.erb +5 -1
  131. data/app/pb_kits/playbook/pb_selectable_list/selectable_list.html.erb +6 -1
  132. data/app/pb_kits/playbook/pb_selectable_list/selectable_list_item.html.erb +6 -1
  133. data/app/pb_kits/playbook/pb_source/source.html.erb +5 -1
  134. data/app/pb_kits/playbook/pb_star_rating/star_rating.html.erb +5 -1
  135. data/app/pb_kits/playbook/pb_stat_change/stat_change.html.erb +5 -1
  136. data/app/pb_kits/playbook/pb_stat_value/stat_value.html.erb +5 -1
  137. data/app/pb_kits/playbook/pb_table/table.html.erb +12 -2
  138. data/app/pb_kits/playbook/pb_table/table_body.html.erb +16 -6
  139. data/app/pb_kits/playbook/pb_table/table_cell.html.erb +16 -6
  140. data/app/pb_kits/playbook/pb_table/table_head.html.erb +16 -6
  141. data/app/pb_kits/playbook/pb_table/table_header.html.erb +13 -4
  142. data/app/pb_kits/playbook/pb_table/table_row.html.erb +16 -6
  143. data/app/pb_kits/playbook/pb_textarea/textarea.html.erb +5 -1
  144. data/app/pb_kits/playbook/pb_time/time.html.erb +5 -1
  145. data/app/pb_kits/playbook/pb_time_range_inline/time_range_inline.html.erb +5 -1
  146. data/app/pb_kits/playbook/pb_time_stacked/time_stacked.html.erb +5 -1
  147. data/app/pb_kits/playbook/pb_timeline/item.html.erb +7 -3
  148. data/app/pb_kits/playbook/pb_timeline/timeline.html.erb +5 -1
  149. data/app/pb_kits/playbook/pb_timestamp/timestamp.html.erb +6 -1
  150. data/app/pb_kits/playbook/pb_title/title.html.erb +6 -1
  151. data/app/pb_kits/playbook/pb_title_count/title_count.html.erb +6 -1
  152. data/app/pb_kits/playbook/pb_title_detail/title_detail.html.erb +5 -1
  153. data/app/pb_kits/playbook/pb_toggle/toggle.html.erb +6 -1
  154. data/app/pb_kits/playbook/pb_tooltip/tooltip.html.erb +5 -1
  155. data/app/pb_kits/playbook/pb_user/user.html.erb +6 -1
  156. data/app/pb_kits/playbook/pb_user_badge/user_badge.html.erb +6 -1
  157. data/app/pb_kits/playbook/pb_weekday_stacked/weekday_stacked.html.erb +6 -1
  158. data/app/pb_kits/playbook/playbook-rails.js +0 -3
  159. data/dist/playbook-rails.js +5 -5
  160. data/lib/playbook/kit_base.rb +1 -1
  161. data/lib/playbook/version.rb +1 -1
  162. metadata +2 -50
  163. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_disabled.html.erb +0 -23
  164. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_disabled.jsx +0 -29
  165. data/app/pb_kits/playbook/pb_currency/docs/_currency_alignment_swift.md +0 -43
  166. data/app/pb_kits/playbook/pb_currency/docs/_currency_props_swift.md +0 -12
  167. data/app/pb_kits/playbook/pb_currency/docs/_currency_size_swift.md +0 -31
  168. data/app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_default_swift.md +0 -14
  169. data/app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_props_swift.md +0 -9
  170. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.html.erb +0 -10
  171. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.md +0 -1
  172. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.html.erb +0 -17
  173. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.jsx +0 -42
  174. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.md +0 -7
  175. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.jsx +0 -84
  176. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.md +0 -1
  177. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.jsx +0 -101
  178. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.md +0 -1
  179. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.html.erb +0 -60
  180. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.md +0 -5
  181. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.html.erb +0 -45
  182. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.md +0 -1
  183. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.html.erb +0 -17
  184. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.jsx +0 -48
  185. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.md +0 -1
  186. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.html.erb +0 -47
  187. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.md +0 -1
  188. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_external_control.jsx +0 -59
  189. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_hook.jsx +0 -72
  190. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.html.erb +0 -10
  191. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.jsx +0 -39
  192. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.md +0 -1
  193. data/app/pb_kits/playbook/pb_dropdown/dropdown.html.erb +0 -21
  194. data/app/pb_kits/playbook/pb_dropdown/dropdown.rb +0 -20
  195. data/app/pb_kits/playbook/pb_dropdown/dropdown_container.html.erb +0 -15
  196. data/app/pb_kits/playbook/pb_dropdown/dropdown_container.rb +0 -19
  197. data/app/pb_kits/playbook/pb_dropdown/dropdown_option.html.erb +0 -22
  198. data/app/pb_kits/playbook/pb_dropdown/dropdown_option.rb +0 -22
  199. data/app/pb_kits/playbook/pb_dropdown/dropdown_trigger.html.erb +0 -38
  200. data/app/pb_kits/playbook/pb_dropdown/dropdown_trigger.rb +0 -30
  201. data/app/pb_kits/playbook/pb_dropdown/index.js +0 -154
  202. data/app/pb_kits/playbook/pb_dropdown/keyboard_accessibility.js +0 -77
  203. data/app/pb_kits/playbook/pb_dropdown/scss_partials/_dropdown_animation.scss +0 -18
  204. data/app/pb_kits/playbook/pb_dropdown/utilities/clickOutsideHelper.tsx +0 -41
  205. data/app/pb_kits/playbook/pb_dropdown/utilities/index.ts +0 -2
  206. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_flex.html.erb +0 -3
  207. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_flex.jsx +0 -16
  208. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_flex.md +0 -1
  209. data/app/pb_kits/playbook/pb_radio/docs/_radio_disabled.html.erb +0 -26
  210. data/app/pb_kits/playbook/pb_radio/docs/_radio_disabled.jsx +0 -31
data/lib/playbook/kit_base.rb CHANGED
@@ -81,7 +81,7 @@ module Playbook
81
81
  end
82
82
 
83
83
  # rubocop:disable Style/OptionalBooleanParameter
84
- def pb_content_tag(name = :div, content_or_options_with_block = {}, options = {}, escape = true, &block)
84
+ def pb_content_tag(name, content_or_options_with_block = nil, options = {}, escape = true, &block)
85
85
  combined_options = options
86
86
  .merge(combined_html_options)
87
87
  .merge(default_options.merge(content_or_options_with_block))
data/lib/playbook/version.rb CHANGED
@@ -2,5 +2,5 @@
2
2
 
3
3
  module Playbook
4
4
  PREVIOUS_VERSION = "13.25.0"
5
- VERSION = "13.25.0.pre.alpha.PBNTR291Dropdownrailsv22812"
5
+ VERSION = "13.25.0.pre.alpha.PLAY761globalpaddingpropsbuttons2713"
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: 13.25.0.pre.alpha.PBNTR291Dropdownrailsv22812
4
+ version: 13.25.0.pre.alpha.PLAY761globalpaddingpropsbuttons2713
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: 2024-05-03 00:00:00.000000000 Z
12
+ date: 2024-04-23 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -602,8 +602,6 @@ files:
602
602
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_default.html.erb
603
603
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_default.jsx
604
604
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_default_swift.md
605
- - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_disabled.html.erb
606
- - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_disabled.jsx
607
605
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_error.html.erb
608
606
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_error.jsx
609
607
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_error_swift.md
@@ -722,15 +720,12 @@ files:
722
720
  - app/pb_kits/playbook/pb_currency/docs/_currency_abbreviated.jsx
723
721
  - app/pb_kits/playbook/pb_currency/docs/_currency_alignment.html.erb
724
722
  - app/pb_kits/playbook/pb_currency/docs/_currency_alignment.jsx
725
- - app/pb_kits/playbook/pb_currency/docs/_currency_alignment_swift.md
726
723
  - app/pb_kits/playbook/pb_currency/docs/_currency_matching_decimals.html.erb
727
724
  - app/pb_kits/playbook/pb_currency/docs/_currency_matching_decimals.jsx
728
725
  - app/pb_kits/playbook/pb_currency/docs/_currency_no_symbol.html.erb
729
726
  - app/pb_kits/playbook/pb_currency/docs/_currency_no_symbol.jsx
730
- - app/pb_kits/playbook/pb_currency/docs/_currency_props_swift.md
731
727
  - app/pb_kits/playbook/pb_currency/docs/_currency_size.html.erb
732
728
  - app/pb_kits/playbook/pb_currency/docs/_currency_size.jsx
733
- - app/pb_kits/playbook/pb_currency/docs/_currency_size_swift.md
734
729
  - app/pb_kits/playbook/pb_currency/docs/_currency_unstyled.html.erb
735
730
  - app/pb_kits/playbook/pb_currency/docs/_currency_unstyled.jsx
736
731
  - app/pb_kits/playbook/pb_currency/docs/_currency_unstyled.md
@@ -890,8 +885,6 @@ files:
890
885
  - app/pb_kits/playbook/pb_date_range_stacked/date_range_stacked.test.js
891
886
  - app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_default.html.erb
892
887
  - app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_default.jsx
893
- - app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_default_swift.md
894
- - app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_props_swift.md
895
888
  - app/pb_kits/playbook/pb_date_range_stacked/docs/example.yml
896
889
  - app/pb_kits/playbook/pb_date_range_stacked/docs/index.js
897
890
  - app/pb_kits/playbook/pb_date_stacked/_date_stacked.scss
@@ -1037,54 +1030,18 @@ files:
1037
1030
  - app/pb_kits/playbook/pb_dropdown/_dropdown.scss
1038
1031
  - app/pb_kits/playbook/pb_dropdown/_dropdown.tsx
1039
1032
  - app/pb_kits/playbook/pb_dropdown/context/index.tsx
1040
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.html.erb
1041
1033
  - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx
1042
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.md
1043
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.html.erb
1044
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.jsx
1045
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.md
1046
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.jsx
1047
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.md
1048
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.jsx
1049
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.md
1050
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.html.erb
1051
1034
  - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx
1052
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.md
1053
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.html.erb
1054
1035
  - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.jsx
1055
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.md
1056
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.html.erb
1057
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.jsx
1058
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.md
1059
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.html.erb
1060
1036
  - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.jsx
1061
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.md
1062
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_external_control.jsx
1063
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_hook.jsx
1064
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.html.erb
1065
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.jsx
1066
- - app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.md
1067
1037
  - app/pb_kits/playbook/pb_dropdown/docs/example.yml
1068
1038
  - app/pb_kits/playbook/pb_dropdown/docs/index.js
1069
- - app/pb_kits/playbook/pb_dropdown/dropdown.html.erb
1070
- - app/pb_kits/playbook/pb_dropdown/dropdown.rb
1071
1039
  - app/pb_kits/playbook/pb_dropdown/dropdown.test.jsx
1072
- - app/pb_kits/playbook/pb_dropdown/dropdown_container.html.erb
1073
- - app/pb_kits/playbook/pb_dropdown/dropdown_container.rb
1074
- - app/pb_kits/playbook/pb_dropdown/dropdown_option.html.erb
1075
- - app/pb_kits/playbook/pb_dropdown/dropdown_option.rb
1076
- - app/pb_kits/playbook/pb_dropdown/dropdown_trigger.html.erb
1077
- - app/pb_kits/playbook/pb_dropdown/dropdown_trigger.rb
1078
1040
  - app/pb_kits/playbook/pb_dropdown/hooks/useDropdown.tsx
1079
1041
  - app/pb_kits/playbook/pb_dropdown/hooks/useHandleOnKeydown.tsx
1080
- - app/pb_kits/playbook/pb_dropdown/index.js
1081
- - app/pb_kits/playbook/pb_dropdown/keyboard_accessibility.js
1082
- - app/pb_kits/playbook/pb_dropdown/scss_partials/_dropdown_animation.scss
1083
1042
  - app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownContainer.tsx
1084
1043
  - app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownOption.tsx
1085
1044
  - app/pb_kits/playbook/pb_dropdown/subcomponents/DropdownTrigger.tsx
1086
- - app/pb_kits/playbook/pb_dropdown/utilities/clickOutsideHelper.tsx
1087
- - app/pb_kits/playbook/pb_dropdown/utilities/index.ts
1088
1045
  - app/pb_kits/playbook/pb_dropdown/utilities/subComponentHelper.tsx
1089
1046
  - app/pb_kits/playbook/pb_enhanced_element/element_observer.ts
1090
1047
  - app/pb_kits/playbook/pb_enhanced_element/index.ts
@@ -1958,9 +1915,6 @@ files:
1958
1915
  - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_align.jsx
1959
1916
  - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_default.html.erb
1960
1917
  - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_default.jsx
1961
- - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_flex.html.erb
1962
- - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_flex.jsx
1963
- - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_flex.md
1964
1918
  - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_muted.html.erb
1965
1919
  - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_muted.jsx
1966
1920
  - app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_value.html.erb
@@ -2008,8 +1962,6 @@ files:
2008
1962
  - app/pb_kits/playbook/pb_radio/docs/_radio_default.html.erb
2009
1963
  - app/pb_kits/playbook/pb_radio/docs/_radio_default.jsx
2010
1964
  - app/pb_kits/playbook/pb_radio/docs/_radio_default_swift.md
2011
- - app/pb_kits/playbook/pb_radio/docs/_radio_disabled.html.erb
2012
- - app/pb_kits/playbook/pb_radio/docs/_radio_disabled.jsx
2013
1965
  - app/pb_kits/playbook/pb_radio/docs/_radio_error.html.erb
2014
1966
  - app/pb_kits/playbook/pb_radio/docs/_radio_error.jsx
2015
1967
  - app/pb_kits/playbook/pb_radio/docs/_radio_error.md
data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_disabled.html.erb DELETED
@@ -1,23 +0,0 @@
1
- <%= pb_rails("flex", props: {orientation: "column"}) do %>
2
- <%= pb_rails("flex/flex_item") do %>
3
- <%= pb_rails("checkbox" , props: {
4
- input_options: { tabindex: 0 },
5
- margin_bottom: "xs",
6
- text: "Disabled unchecked",
7
- value: "checkbox-value",
8
- disabled: true,
9
- name: "checkbox-name"
10
- }) %>
11
- <% end %>
12
- <%= pb_rails("flex/flex_item") do %>
13
- <%= pb_rails("checkbox" , props: {
14
- input_options: { tabindex: 0 },
15
- text: "Disabled checked",
16
- value: "checkbox-value",
17
- disabled: true,
18
- checked: true,
19
- name: "checkbox-name"
20
- }) %>
21
- <% end %>
22
- <% end %>
23
-
data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_disabled.jsx DELETED
@@ -1,29 +0,0 @@
1
- import React from 'react'
2
-
3
- import Checkbox from '../_checkbox'
4
-
5
- const CheckboxDisabled = (props) => {
6
- return (
7
- <div style={{ display: "flex", flexDirection: "column" }}>
8
- <Checkbox
9
- disabled
10
- marginBottom="xs"
11
- name="default name"
12
- tabIndex={0}
13
- text="Disabled unchecked"
14
- value="default value"
15
- {...props}
16
- />
17
- <Checkbox
18
- checked
19
- disabled
20
- name="checkbox-name"
21
- text="Disabled checked"
22
- value="check-box value"
23
- {...props}
24
- />
25
- </div>
26
- )
27
- }
28
-
29
- export default CheckboxDisabled
data/app/pb_kits/playbook/pb_currency/docs/_currency_alignment_swift.md DELETED
@@ -1,43 +0,0 @@
1
- [!Currency-Alignment](https://github.com/powerhome/playbook-swift/assets/112719604/d74a9c5a-c606-4cd0-bf70-20e9297ec246)
2
-
3
- ```swift
4
- VStack(alignment: .leading, spacing: Spacing.small) {
5
- HStack {
6
- PBCurrency(
7
- amount: "2,000",
8
- decimalAmount: ".50",
9
- label: "left",
10
- size: .title4,
11
- symbol: "en_US",
12
- isEmphasized: true,
13
- alignment: .leading
14
- )
15
- }
16
- .frame(maxWidth: .infinity, alignment: .leading)
17
- HStack {
18
- PBCurrency(
19
- amount: "342",
20
- decimalAmount: ".00",
21
- label: "center",
22
- size: .title4,
23
- symbol: "en_EU",
24
- isEmphasized: true,
25
- alignment: .center
26
- )
27
- }
28
- .frame(maxWidth: .infinity, alignment: .center)
29
- HStack {
30
- PBCurrency(
31
- amount: "45",
32
- label: "right",
33
- size: .title4,
34
- symbol: "en_US",
35
- unit: "/mo",
36
- isEmphasized: true,
37
- hasUnit: true,
38
- alignment: .trailing
39
- )
40
- }
41
- .frame(maxWidth: .infinity, alignment: .trailing)
42
- }
43
- ```
data/app/pb_kits/playbook/pb_currency/docs/_currency_props_swift.md DELETED
@@ -1,12 +0,0 @@
1
- ### Props
2
- | Name | Type | Description | Default | Values |
3
- | --- | ----------- | --------- | --------- | --------- |
4
- | **amount** | `String` | Allows user to enter a currency amount | | |
5
- | **decimalAmount** | `String` | Allows user to enter a decimal amount | | |
6
- | **label** | `String` | Allows user to a descriptive label value | | |
7
- | **size** | `PBFont` | Allows user to choose the size of the amount that is being displayed | `.title4` | `title4` `title3` `title4` |
8
- | **symbol** | `String` | A string value used to produce the desired currency symbol | | |
9
- | **unit** | `String` | Allows user to add a unit of measure instead of a decimal amount | | |
10
- | **alignment** | `Alignment` | Sets alignment of content | `.leading` | `leading` `center` `trailing` |
11
- | **isEmphasized** | `Bool` | Determines whether or not the currency that is being displayed is emphasized | `false` | `true` `false` |
12
- | **hasUnit** | `Bool` | Determines whether or not the currency has a decimal value or a unit of measure | `false` | `true` `false` |
data/app/pb_kits/playbook/pb_currency/docs/_currency_size_swift.md DELETED
@@ -1,31 +0,0 @@
1
- ![Currency-Default](https://github.com/powerhome/playbook-swift/assets/54749071/bf3810f9-6dd2-4bdd-b32a-14109f3a0b9a)
2
-
3
- ```swift
4
- VStack(alignment: .leading, spacing: Spacing.small) {
5
- PBCurrency(
6
- amount: "2,000",
7
- decimalAmount: ".50",
8
- label: "small",
9
- size: .title4,
10
- symbol: "en_US",
11
- isEmphasized: true
12
- )
13
- PBCurrency(
14
- amount: "342",
15
- decimalAmount: ".00",
16
- label: "medium",
17
- size: .title3,
18
- symbol: "en_EU",
19
- isEmphasized: true
20
- )
21
- PBCurrency(
22
- amount: "45",
23
- label: "large",
24
- size: .title1,
25
- symbol: "en_US",
26
- unit: "/mo",
27
- isEmphasized: true,
28
- hasUnit: true
29
- )
30
- }
31
- ```
data/app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_default_swift.md DELETED
@@ -1,14 +0,0 @@
1
- ![Date-Range-Stacked-Default](https://github.com/powerhome/playbook-swift/assets/54749071/ccb85e5d-0f6d-4ced-8154-aa9dfa72a131)
2
-
3
- ```swift
4
- VStack(alignment: .leading, spacing: Spacing.small) {
5
- PBDateRangeStacked(
6
- startDate: Date().makeDate(year: 2019, month: 6, day: 18),
7
- endDate: Date().makeDate(year: 2020, month: 3, day: 20),
8
- startAlignment: .trailing,
9
- endAlignment: .leading,
10
- startVariant: .short(showIcon: false),
11
- endVariant: .short(showIcon: false)
12
- )
13
- }
14
- ```
data/app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_props_swift.md DELETED
@@ -1,9 +0,0 @@
1
- ### Props
2
- | Name | Type | Description | Default | Values |
3
- | --- | ----------- | --------- | --------- | --------- |
4
- | **startDate** | `Date()` | Takes a string value to set the starting date range value | `Date()` | |
5
- | **endDate** | `Date()` | Takes a string value to set the ending date range value | `Date()` | |
6
- | **startAlignment** | `Alignment` | Changes the alignment of the starting date | `.leading` | `.leading` `.trailing` |
7
- | **endAlignment** | `Alignment` | Changes the alignment of the ending date | `.leading` | `.leading` `.trailing` |
8
- | **startVariant** | `PBDate.Variant` | Changes the style of the starting date | `.short(showIcon: false)` | `.short(showIcon: false)` `.dayDate` `.standard` `.withIcon(isStandard: true)` `withIcon(isStandard: false)` |
9
- | **endVariant** | `PBDate.Variant` | Changes the style of the ending date | `.short(showIcon: false)` | `.short(showIcon: false)` `.dayDate` `.standard` `.withIcon(isStandard: true)` `withIcon(isStandard: false)` |
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.html.erb DELETED
@@ -1,10 +0,0 @@
1
- <%
2
- options = [
3
- { label: 'United States', value: 'United States', id: 'us' },
4
- { label: 'Canada', value: 'Canada', id: 'ca' },
5
- { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
6
- ]
7
-
8
- %>
9
-
10
- <%= pb_rails("dropdown", props: {options: options}) %>
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.md DELETED
@@ -1 +0,0 @@
1
- The Dropdown kit accepts an `options` array and renders each object from that array as a selectable option within a dropdown container. `options` is a required prop and must be an array of objects. Each object can contain as many key/value pairs as needed but MUST contain 'label' and 'value' as the only required items within each object.
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.html.erb DELETED
@@ -1,17 +0,0 @@
1
- <%
2
- options = [
3
- { label: 'United States', value: 'United States', id: 'us' },
4
- { label: 'Canada', value: 'Canada', id: 'ca' },
5
- { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
6
- ]
7
-
8
- %>
9
-
10
- <%= pb_rails("dropdown", props: {options: options}) do %>
11
- <%= pb_rails("dropdown/dropdown_trigger") %>
12
- <%= pb_rails("dropdown/dropdown_container") do %>
13
- <% options.each do |option| %>
14
- <%= pb_rails("dropdown/dropdown_option", props: {option: option}) %>
15
- <% end %>
16
- <% end %>
17
- <% end %>
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.jsx DELETED
@@ -1,42 +0,0 @@
1
- import React from 'react'
2
- import { Dropdown } from '../..'
3
-
4
- const DropdownSubcomponentStructure = (props) => {
5
-
6
-
7
- const options = [
8
- {
9
- label: "United States",
10
- value: "United States",
11
- },
12
- {
13
- label: "Canada",
14
- value: "Canada",
15
- },
16
- {
17
- label: "Pakistan",
18
- value: "Pakistan",
19
- }
20
- ];
21
-
22
-
23
- return (
24
- <div>
25
- <Dropdown
26
- options={options}
27
- {...props}
28
- >
29
- <Dropdown.Trigger/>
30
- <Dropdown.Container>
31
- {options.map((option) => (
32
- <Dropdown.Option key={option.id}
33
- option={option}
34
- />
35
- ))}
36
- </Dropdown.Container>
37
- </Dropdown>
38
- </div>
39
- )
40
- }
41
-
42
- export default DropdownSubcomponentStructure
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.md DELETED
@@ -1,7 +0,0 @@
1
- The dropdown comes with the following subcomponents that can be used to achieve various levels of customization:
2
-
3
- `Dropdown. Trigger` / `dropdown/dropdown_trigger`
4
- `Dropdown.Container`/ `dropdown/dropdown_container`
5
- `Dropdown.Option` / `dropdown/dropdown_option`
6
-
7
- See the code snippet below for a visual on how to use the kit with subcomponents. Each subcomponent allows for GlobalProps in addition to any subcomponent specfic props.
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.jsx DELETED
@@ -1,84 +0,0 @@
1
- import React from 'react'
2
- import { Dropdown, User, Badge, FlexItem } from '../..'
3
-
4
- const DropdownWithAutocomplete = (props) => {
5
-
6
- const options = [
7
- {
8
- label: "Jasper Furniss",
9
- value: "Jasper Furniss",
10
- territory: "PHL",
11
- title: "Senior UX Engineer",
12
- id: "jasper-furniss",
13
- status: "Offline"
14
- },
15
- {
16
- label: "Ramon Ruiz",
17
- value: "Ramon Ruiz",
18
- territory: "PHL",
19
- title: "Senior UX Designer",
20
- id: "ramon-ruiz",
21
- status: "Away"
22
- },
23
- {
24
- label: "Jason Cypret",
25
- value: "Jason Cypret",
26
- territory: "PHL",
27
- title: "VP of User Experience",
28
- id: "jason-cypret",
29
- status: "Online"
30
- },
31
- {
32
- label: "Courtney Long",
33
- value: "Courtney Long",
34
- territory: "PHL",
35
- title: "UX Design Mentor",
36
- id: "courtney-long",
37
- status: "Online"
38
- }
39
- ];
40
-
41
-
42
- return (
43
- <div>
44
- <Dropdown autocomplete
45
- options={options}
46
- {...props}
47
- >
48
- {options.map((option) => (
49
- <Dropdown.Option key={option.id}
50
- option={option}
51
- >
52
- <>
53
- <FlexItem>
54
- <User
55
- align="left"
56
- avatar
57
- name={option.label}
58
- orientation="horizontal"
59
- territory={option.territory}
60
- title={option.title}
61
- />
62
- </FlexItem>
63
- <FlexItem>
64
- <Badge
65
- rounded
66
- text={option.status}
67
- variant={`${
68
- option.status === "Offline"
69
- ? "neutral"
70
- : option.status === "Online"
71
- ? "success"
72
- : "warning"
73
- }`}
74
- />
75
- </FlexItem>
76
- </>
77
- </Dropdown.Option>
78
- ))}
79
- </Dropdown>
80
- </div>
81
- )
82
- }
83
-
84
- export default DropdownWithAutocomplete
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.md DELETED
@@ -1 +0,0 @@
1
- The `autocomplete` prop can be used to add autocomplete or typeahead functionality to the Dropdown's default Trigger. This prop is set to 'false' by default.
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.jsx DELETED
@@ -1,101 +0,0 @@
1
- import React, { useState } from 'react'
2
- import { Dropdown, User, Badge, FlexItem, Avatar } from '../..'
3
-
4
- const DropdownWithAutocompleteAndCustomDisplay = (props) => {
5
- const [selectedOption, setSelectedOption] = useState();
6
-
7
- const options = [
8
- {
9
- label: "Jasper Furniss",
10
- value: "Jasper Furniss",
11
- territory: "PHL",
12
- title: "Senior UX Engineer",
13
- id: "jasper-furniss",
14
- status: "Offline"
15
- },
16
- {
17
- label: "Ramon Ruiz",
18
- value: "Ramon Ruiz",
19
- territory: "PHL",
20
- title: "Senior UX Designer",
21
- id: "ramon-ruiz",
22
- status: "Away"
23
- },
24
- {
25
- label: "Jason Cypret",
26
- value: "Jason Cypret",
27
- territory: "PHL",
28
- title: "VP of User Experience",
29
- id: "jason-cypret",
30
- status: "Online"
31
- },
32
- {
33
- label: "Courtney Long",
34
- value: "Courtney Long",
35
- territory: "PHL",
36
- title: "UX Design Mentor",
37
- id: "courtney-long",
38
- status: "Online"
39
- }
40
- ];
41
-
42
- const CustomDisplay = () => {
43
- return (
44
- <>
45
- {
46
- selectedOption && (
47
- <Avatar
48
- name={selectedOption.label}
49
- size="xs"
50
- />
51
- )
52
- }
53
- </>
54
- )
55
- };
56
-
57
- return (
58
- <div>
59
- <Dropdown autocomplete
60
- onSelect={(selectedItem) => setSelectedOption(selectedItem)}
61
- options={options}
62
- {...props}
63
- >
64
- <Dropdown.Trigger customDisplay={<CustomDisplay/>} />
65
- {options.map((option) => (
66
- <Dropdown.Option key={option.id}
67
- option={option}
68
- >
69
- <>
70
- <FlexItem>
71
- <User
72
- align="left"
73
- avatar
74
- name={option.label}
75
- orientation="horizontal"
76
- territory={option.territory}
77
- title={option.title}
78
- />
79
- </FlexItem>
80
- <FlexItem>
81
- <Badge
82
- rounded
83
- text={option.status}
84
- variant={`${
85
- option.status === "Offline"
86
- ? "neutral"
87
- : option.status === "Online"
88
- ? "success"
89
- : "warning"
90
- }`}
91
- />
92
- </FlexItem>
93
- </>
94
- </Dropdown.Option>
95
- ))}
96
- </Dropdown>
97
- </div>
98
- )
99
- }
100
-
101
- export default DropdownWithAutocompleteAndCustomDisplay
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.md DELETED
@@ -1 +0,0 @@
1
- `autocomplete` prop can also be used in conjunction with the `customDisplay` prop.
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.html.erb DELETED
@@ -1,60 +0,0 @@
1
- <%
2
- options = [
3
- {
4
- label: "Jasper Furniss",
5
- value: "Jasper Furniss",
6
- territory: "PHL",
7
- title: "Senior UX Engineer",
8
- id: "jasper-furniss",
9
- status: "Offline"
10
- },
11
- {
12
- label: "Ramon Ruiz",
13
- value: "Ramon Ruiz",
14
- territory: "PHL",
15
- title: "Senior UX Designer",
16
- id: "ramon-ruiz",
17
- status: "Away"
18
- },
19
- {
20
- label: "Jason Cypret",
21
- value: "Jason Cypret",
22
- territory: "PHL",
23
- title: "VP of User Experience",
24
- id: "jason-cypret",
25
- status: "Online"
26
- },
27
- {
28
- label: "Courtney Long",
29
- value: "Courtney Long",
30
- territory: "PHL",
31
- title: "UX Design Mentor",
32
- id: "courtney-long",
33
- status: "Online"
34
- }
35
- ]
36
-
37
- %>
38
-
39
- <%
40
- custom_display = capture do
41
- pb_rails("avatar", props: { name: "Courtney Long", size: "xs" })
42
- end
43
- %>
44
-
45
-
46
- <%= pb_rails("dropdown", props: {options: options}) do %>
47
- <%= pb_rails("dropdown/dropdown_trigger", props: {placeholder: "Select a User", custom_display: custom_display}) %>
48
- <%= pb_rails("dropdown/dropdown_container") do %>
49
- <% options.each do |option| %>
50
- <%= pb_rails("dropdown/dropdown_option", props: {option: option}) do %>
51
- <%= pb_rails("flex/flex_item") do %>
52
- <%= pb_rails("user", props: {name: option[:label], align:"left", avatar: true, orientation:"horizontal", territory:option[:territory], title: option[:title]}) %>
53
- <% end %>
54
- <%= pb_rails("flex/flex_item") do %>
55
- <%= pb_rails("badge", props: {rounded: true, dark: true, text: option[:status], variant: option[:status] == "Offline" ? "neutral" : option[:status] == "Online" ? "success" : "warning" }) %>
56
- <% end %>
57
- <% end %>
58
- <% end %>
59
- <% end %>
60
- <% end %>
data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.md DELETED
@@ -1,5 +0,0 @@
1
- The `customDisplay` prop can be used to customize the display of the selected item by allowing devs to pass in a component that will be rendered to the left of the default text-based display. In this example the Avatar kit is being used.
2
-
3
- The `placeholder` prop can also be used to customize the placeholder text for the default Trigger.
4
-
5
- The `onSelect` prop is a function that gives the dev one argument: the selected option. In this example we are using the `onSelect` to set a state with the selected option and using it to customize the `customDisplay`.