playbook_ui_docs 14.15.0.pre.alpha.PBNTR902multilevelselecthiddeninputbug6580 → 14.15.0.pre.alpha.PBNTR8996733

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 (378) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_collapsible_trail.jsx +1 -1
  3. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers.jsx +1 -1
  4. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_custom_cell.jsx +3 -1
  5. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_headers_multiple.jsx +1 -1
  6. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_custom_cell.jsx +8 -1
  7. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_default.jsx +1 -1
  8. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_expanded_control.jsx +1 -1
  9. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_editing.jsx +102 -0
  10. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_editing.md +4 -0
  11. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading.jsx +1 -1
  12. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.jsx +2 -2
  13. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_no_subrows.jsx +1 -1
  14. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination.jsx +1 -1
  15. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pagination_with_props.jsx +1 -1
  16. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_responsive.jsx +1 -1
  17. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows.jsx +1 -1
  18. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions.jsx +3 -1
  19. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_header.jsx +1 -1
  20. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_no_subrows.jsx +1 -1
  21. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort.jsx +1 -1
  22. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort_control.jsx +1 -1
  23. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_subrow_headers.jsx +1 -1
  24. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_options.jsx +1 -1
  25. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props.jsx +1 -1
  26. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.jsx +1 -1
  27. data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +2 -1
  28. data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +2 -1
  29. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.jsx +1 -1
  30. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.jsx +1 -1
  31. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_default.jsx +1 -1
  32. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_monogram.jsx +1 -1
  33. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_no_image.jsx +1 -1
  34. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_status.jsx +1 -1
  35. data/app/pb_kits/playbook/pb_background/docs/_background_category.jsx +2 -2
  36. data/app/pb_kits/playbook/pb_background/docs/_background_gradient.jsx +1 -1
  37. data/app/pb_kits/playbook/pb_background/docs/_background_image.jsx +6 -2
  38. data/app/pb_kits/playbook/pb_background/docs/_background_light.jsx +1 -1
  39. data/app/pb_kits/playbook/pb_background/docs/_background_size.jsx +1 -1
  40. data/app/pb_kits/playbook/pb_background/docs/_background_status.jsx +2 -2
  41. data/app/pb_kits/playbook/pb_background/docs/_background_status_subtle.jsx +2 -2
  42. data/app/pb_kits/playbook/pb_background/docs/_background_white.jsx +1 -1
  43. data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend.jsx +1 -1
  44. data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_non_clickable.jsx +1 -1
  45. data/app/pb_kits/playbook/pb_bar_graph/docs/_bar_graph_legend_position.jsx +3 -1
  46. data/app/pb_kits/playbook/pb_body/docs/_body_articles.jsx +1 -1
  47. data/app/pb_kits/playbook/pb_body/docs/_body_block.jsx +1 -1
  48. data/app/pb_kits/playbook/pb_body/docs/_body_light.jsx +1 -1
  49. data/app/pb_kits/playbook/pb_body/docs/_body_styled.jsx +1 -1
  50. data/app/pb_kits/playbook/pb_bread_crumbs/docs/_bread_crumbs_default.jsx +2 -1
  51. data/app/pb_kits/playbook/pb_button/docs/_button_accessibility.jsx +1 -1
  52. data/app/pb_kits/playbook/pb_button/docs/_button_block_content.jsx +2 -1
  53. data/app/pb_kits/playbook/pb_button/docs/_button_default.jsx +1 -1
  54. data/app/pb_kits/playbook/pb_button/docs/_button_form.jsx +1 -1
  55. data/app/pb_kits/playbook/pb_button/docs/_button_full_width.jsx +1 -1
  56. data/app/pb_kits/playbook/pb_button/docs/_button_hover.jsx +1 -1
  57. data/app/pb_kits/playbook/pb_button/docs/_button_icon_options.jsx +1 -1
  58. data/app/pb_kits/playbook/pb_button/docs/_button_link.jsx +1 -1
  59. data/app/pb_kits/playbook/pb_button/docs/_button_loading.jsx +1 -1
  60. data/app/pb_kits/playbook/pb_button/docs/_button_reaction.jsx +1 -1
  61. data/app/pb_kits/playbook/pb_button/docs/_button_size.jsx +1 -1
  62. data/app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_default.jsx +3 -1
  63. data/app/pb_kits/playbook/pb_button_toolbar/docs/_button_toolbar_secondary.jsx +2 -1
  64. data/app/pb_kits/playbook/pb_caption/docs/_caption_block.jsx +1 -1
  65. data/app/pb_kits/playbook/pb_caption/docs/_caption_colors.jsx +1 -1
  66. data/app/pb_kits/playbook/pb_caption/docs/_caption_light.jsx +1 -1
  67. data/app/pb_kits/playbook/pb_card/docs/_card_background.jsx +1 -1
  68. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_error.jsx +1 -1
  69. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_indeterminate.jsx +2 -1
  70. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.jsx +4 -1
  71. data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_legend_position.jsx +1 -1
  72. data/app/pb_kits/playbook/pb_circle_icon_button/docs/_circle_icon_button_click.jsx +1 -1
  73. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_color.jsx +1 -1
  74. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main.jsx +7 -1
  75. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_with_icon.jsx +7 -1
  76. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_default.jsx +1 -1
  77. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_icons.jsx +1 -1
  78. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_no_icon.jsx +1 -1
  79. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_size.jsx +1 -1
  80. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_state.jsx +4 -1
  81. data/app/pb_kits/playbook/pb_contact/docs/_contact_default.jsx +1 -1
  82. data/app/pb_kits/playbook/pb_contact/docs/_contact_with_detail.jsx +1 -1
  83. data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_default.jsx +3 -1
  84. data/app/pb_kits/playbook/pb_copy_button/docs/_copy_button_from.jsx +5 -1
  85. data/app/pb_kits/playbook/pb_currency/docs/_currency_null_display.jsx +1 -1
  86. data/app/pb_kits/playbook/pb_currency/docs/_currency_unstyled.jsx +3 -1
  87. data/app/pb_kits/playbook/pb_date/docs/_date_alignment.jsx +2 -1
  88. data/app/pb_kits/playbook/pb_date/docs/_date_default.jsx +4 -1
  89. data/app/pb_kits/playbook/pb_date/docs/_date_unstyled.jsx +4 -1
  90. data/app/pb_kits/playbook/pb_date/docs/_date_variants.jsx +2 -1
  91. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_hooks.md +3 -1
  92. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_on_change.html.erb +39 -0
  93. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_on_change.jsx +3 -1
  94. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_on_close.html.erb +39 -0
  95. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_on_close.jsx +3 -1
  96. data/app/pb_kits/playbook/pb_date_picker/docs/example.yml +2 -0
  97. data/app/pb_kits/playbook/pb_date_range_stacked/docs/_date_range_stacked_default.jsx +1 -1
  98. data/app/pb_kits/playbook/pb_date_year_stacked/docs/_date_year_stacked_default.jsx +1 -1
  99. data/app/pb_kits/playbook/pb_detail/docs/_detail_bold.jsx +1 -1
  100. data/app/pb_kits/playbook/pb_detail/docs/_detail_colors.jsx +1 -1
  101. data/app/pb_kits/playbook/pb_detail/docs/_detail_default.jsx +1 -1
  102. data/app/pb_kits/playbook/pb_detail/docs/_detail_styled.jsx +1 -1
  103. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_compound_components.jsx +7 -8
  104. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_default.jsx +3 -1
  105. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_full_height.jsx +8 -9
  106. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_full_height_placement.jsx +8 -9
  107. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_loading.jsx +2 -1
  108. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_scrollable.jsx +2 -1
  109. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_separators.jsx +3 -1
  110. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_should_close_on_overlay.jsx +2 -1
  111. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_sizes.jsx +3 -1
  112. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_stacked_alert.jsx +3 -1
  113. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_status.jsx +4 -1
  114. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_default.jsx +5 -1
  115. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_multiple_containers.jsx +11 -12
  116. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_cards.jsx +9 -10
  117. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_list.jsx +4 -1
  118. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_selectable_list.jsx +3 -1
  119. data/app/pb_kits/playbook/pb_draggable/docs/_draggable_with_table_react.jsx +6 -1
  120. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_behavior.jsx +4 -1
  121. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_borders.jsx +4 -1
  122. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_breakpoints.jsx +2 -1
  123. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_default.jsx +4 -1
  124. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_menu.jsx +6 -1
  125. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_overlay.jsx +4 -1
  126. data/app/pb_kits/playbook/pb_drawer/docs/_drawer_sizes.jsx +4 -1
  127. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection.jsx +1 -1
  128. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_clear_selection.jsx +3 -1
  129. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.jsx +1 -1
  130. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default_value.jsx +1 -1
  131. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_error.jsx +1 -1
  132. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_separators_hidden.jsx +1 -1
  133. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.jsx +1 -1
  134. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subtle_variant.jsx +1 -1
  135. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete.jsx +5 -1
  136. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_autocomplete_and_custom_display.jsx +7 -1
  137. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx +7 -1
  138. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.jsx +7 -1
  139. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.jsx +1 -1
  140. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.jsx +7 -1
  141. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_external_control.jsx +5 -1
  142. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_hook.jsx +8 -1
  143. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.jsx +1 -1
  144. data/app/pb_kits/playbook/pb_empty_state/docs/_empty_state_alignment.jsx +38 -0
  145. data/app/pb_kits/playbook/pb_empty_state/docs/_empty_state_default.jsx +17 -0
  146. data/app/pb_kits/playbook/pb_empty_state/docs/_empty_state_orientation.jsx +21 -0
  147. data/app/pb_kits/playbook/pb_empty_state/docs/_empty_state_size.jsx +35 -0
  148. data/app/pb_kits/playbook/pb_empty_state/docs/default_image/computer_fly_no_branding.svg +21 -0
  149. data/app/pb_kits/playbook/pb_empty_state/docs/default_image/utils.tsx +118 -0
  150. data/app/pb_kits/playbook/pb_empty_state/docs/example.yml +8 -0
  151. data/app/pb_kits/playbook/pb_empty_state/docs/index.js +4 -0
  152. data/app/pb_kits/playbook/pb_file_upload/docs/_file_upload_accept.jsx +4 -5
  153. data/app/pb_kits/playbook/pb_file_upload/docs/_file_upload_custom_description.jsx +3 -1
  154. data/app/pb_kits/playbook/pb_file_upload/docs/_file_upload_custom_message.jsx +3 -5
  155. data/app/pb_kits/playbook/pb_file_upload/docs/_file_upload_default.jsx +3 -5
  156. data/app/pb_kits/playbook/pb_file_upload/docs/_file_upload_max_size.jsx +5 -6
  157. data/app/pb_kits/playbook/pb_filter/docs/_filter_default.jsx +6 -1
  158. data/app/pb_kits/playbook/pb_filter/docs/_filter_max_height.jsx +5 -1
  159. data/app/pb_kits/playbook/pb_filter/docs/_filter_max_width.jsx +5 -1
  160. data/app/pb_kits/playbook/pb_filter/docs/_filter_no_background.jsx +6 -1
  161. data/app/pb_kits/playbook/pb_filter/docs/_filter_no_sort.jsx +5 -1
  162. data/app/pb_kits/playbook/pb_filter/docs/_filter_only.jsx +5 -1
  163. data/app/pb_kits/playbook/pb_filter/docs/_filter_placement.jsx +6 -1
  164. data/app/pb_kits/playbook/pb_filter/docs/_filter_popover_props.jsx +5 -1
  165. data/app/pb_kits/playbook/pb_flex/docs/_flex_align.jsx +3 -1
  166. data/app/pb_kits/playbook/pb_flex/docs/_flex_default.jsx +3 -1
  167. data/app/pb_kits/playbook/pb_flex/docs/_flex_gap.jsx +2 -1
  168. data/app/pb_kits/playbook/pb_flex/docs/_flex_inline.jsx +3 -1
  169. data/app/pb_kits/playbook/pb_flex/docs/_flex_item_align_self.jsx +3 -1
  170. data/app/pb_kits/playbook/pb_flex/docs/_flex_item_example.jsx +3 -1
  171. data/app/pb_kits/playbook/pb_flex/docs/_flex_justify.jsx +3 -1
  172. data/app/pb_kits/playbook/pb_flex/docs/_flex_reverse.jsx +3 -1
  173. data/app/pb_kits/playbook/pb_flex/docs/_flex_spacing.jsx +3 -1
  174. data/app/pb_kits/playbook/pb_flex/docs/_flex_wrap.jsx +4 -1
  175. data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +1 -1
  176. data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb +1 -1
  177. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.jsx +3 -1
  178. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx +5 -1
  179. data/app/pb_kits/playbook/pb_gantt_chart/docs/_gantt_chart_default.jsx +1 -1
  180. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_colors.jsx +1 -1
  181. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_complex.jsx +9 -10
  182. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_default.jsx +1 -1
  183. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_disable_animation.jsx +1 -1
  184. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_full_circle.jsx +1 -1
  185. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_height.jsx +1 -1
  186. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_live_data.jsx +3 -1
  187. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_min_max.jsx +1 -1
  188. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_sizing.jsx +4 -1
  189. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_title.jsx +1 -1
  190. data/app/pb_kits/playbook/pb_gauge/docs/_gauge_units.jsx +1 -1
  191. data/app/pb_kits/playbook/pb_hashtag/docs/_hashtag_default.jsx +1 -1
  192. data/app/pb_kits/playbook/pb_hashtag/docs/_hashtag_link.jsx +1 -1
  193. data/app/pb_kits/playbook/pb_icon/docs/_icon_custom.jsx +1 -1
  194. data/app/pb_kits/playbook/pb_icon_button/docs/_icon_button_default.jsx +1 -1
  195. data/app/pb_kits/playbook/pb_icon_button/docs/_icon_button_sizes.jsx +3 -1
  196. data/app/pb_kits/playbook/pb_icon_circle/docs/_icon_circle_sizes.jsx +1 -1
  197. data/app/pb_kits/playbook/pb_icon_stat_value/docs/_icon_stat_value_color.jsx +1 -1
  198. data/app/pb_kits/playbook/pb_icon_stat_value/docs/_icon_stat_value_default.jsx +1 -1
  199. data/app/pb_kits/playbook/pb_icon_stat_value/docs/_icon_stat_value_sizes.jsx +1 -1
  200. data/app/pb_kits/playbook/pb_icon_stat_value/docs/_icon_stat_value_vertical.jsx +1 -1
  201. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_default.jsx +1 -1
  202. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details.jsx +1 -1
  203. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples.jsx +3 -1
  204. data/app/pb_kits/playbook/pb_legend/docs/_legend_colors.jsx +1 -1
  205. data/app/pb_kits/playbook/pb_legend/docs/_legend_custom_colors.jsx +1 -1
  206. data/app/pb_kits/playbook/pb_legend/docs/_legend_prefix.jsx +1 -1
  207. data/app/pb_kits/playbook/pb_lightbox/docs/_lightbox_compound_component.jsx +2 -1
  208. data/app/pb_kits/playbook/pb_lightbox/docs/_lightbox_current_photo.jsx +6 -1
  209. data/app/pb_kits/playbook/pb_lightbox/docs/_lightbox_custom_header.jsx +4 -1
  210. data/app/pb_kits/playbook/pb_lightbox/docs/_lightbox_default.jsx +2 -1
  211. data/app/pb_kits/playbook/pb_lightbox/docs/_lightbox_multiple.jsx +2 -1
  212. data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend.jsx +1 -1
  213. data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_nonclickable.jsx +1 -1
  214. data/app/pb_kits/playbook/pb_line_graph/docs/_line_graph_legend_position.jsx +2 -1
  215. data/app/pb_kits/playbook/pb_link/docs/_link_color.jsx +1 -1
  216. data/app/pb_kits/playbook/pb_link/docs/_link_disabled.jsx +1 -1
  217. data/app/pb_kits/playbook/pb_link/docs/_link_icon.jsx +1 -1
  218. data/app/pb_kits/playbook/pb_link/docs/_link_tag.jsx +1 -1
  219. data/app/pb_kits/playbook/pb_link/docs/_link_target.jsx +1 -1
  220. data/app/pb_kits/playbook/pb_link/docs/_link_underline.jsx +1 -1
  221. data/app/pb_kits/playbook/pb_map/docs/_map_default.jsx +2 -1
  222. data/app/pb_kits/playbook/pb_map/docs/_map_with_custom_button.jsx +5 -1
  223. data/app/pb_kits/playbook/pb_map/docs/_map_with_plugin.jsx +2 -1
  224. data/app/pb_kits/playbook/pb_message/docs/_message_timestamp.jsx +1 -1
  225. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled.html.erb +1 -1
  226. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options.html.erb +76 -0
  227. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options.jsx +94 -0
  228. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options.md +1 -0
  229. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_default.html.erb +75 -0
  230. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_default.jsx +93 -0
  231. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_default.md +3 -0
  232. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_parent.html.erb +75 -0
  233. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_parent.jsx +93 -0
  234. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_parent.md +3 -0
  235. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_parent_default.html.erb +74 -0
  236. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_parent_default.jsx +92 -0
  237. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_disabled_options_parent_default.md +3 -0
  238. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_hook.jsx +91 -0
  239. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_hook.md +1 -0
  240. data/app/pb_kits/playbook/pb_multi_level_select/docs/example.yml +11 -2
  241. data/app/pb_kits/playbook/pb_multi_level_select/docs/index.js +5 -0
  242. data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_default.jsx +1 -1
  243. data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_reverse.jsx +1 -1
  244. data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_size.jsx +2 -1
  245. data/app/pb_kits/playbook/pb_nav/docs/_collapsible_nav.jsx +2 -1
  246. data/app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_custom.jsx +4 -1
  247. data/app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_item_spacing.jsx +2 -1
  248. data/app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_no_icon.jsx +2 -1
  249. data/app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_with_all_options.jsx +2 -1
  250. data/app/pb_kits/playbook/pb_nav/docs/_nav_with_font_control.jsx +2 -1
  251. data/app/pb_kits/playbook/pb_overlay/docs/_overlay_default.jsx +4 -4
  252. data/app/pb_kits/playbook/pb_overlay/docs/_overlay_hide_scroll_bar.jsx +5 -6
  253. data/app/pb_kits/playbook/pb_overlay/docs/_overlay_multi_directional.jsx +4 -6
  254. data/app/pb_kits/playbook/pb_overlay/docs/_overlay_toggle.jsx +4 -1
  255. data/app/pb_kits/playbook/pb_overlay/docs/_overlay_vertical_dynamic_multi_directional.jsx +4 -6
  256. data/app/pb_kits/playbook/pb_pagination/docs/_pagination_page_change.jsx +2 -1
  257. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_breached.jsx +3 -1
  258. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_common.jsx +4 -1
  259. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_confirmation.jsx +2 -1
  260. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_meter_settings.jsx +6 -1
  261. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_strength_change.jsx +5 -1
  262. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_access_input_element.jsx +3 -1
  263. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_clear_field.jsx +3 -1
  264. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.html.erb +1 -1
  265. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_default.jsx +1 -1
  266. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_format.jsx +3 -1
  267. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_hidden_inputs.html.erb +5 -0
  268. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_hidden_inputs.md +1 -0
  269. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_initial_country.jsx +1 -1
  270. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_only_countries.jsx +1 -1
  271. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_preferred_countries.jsx +1 -1
  272. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.jsx +4 -1
  273. data/app/pb_kits/playbook/pb_phone_number_input/docs/example.yml +3 -1
  274. data/app/pb_kits/playbook/pb_popover/docs/_popover_actionable_content.jsx +6 -7
  275. data/app/pb_kits/playbook/pb_popover/docs/_popover_close.jsx +4 -5
  276. data/app/pb_kits/playbook/pb_popover/docs/_popover_default.jsx +5 -6
  277. data/app/pb_kits/playbook/pb_popover/docs/_popover_list.jsx +7 -8
  278. data/app/pb_kits/playbook/pb_popover/docs/_popover_scroll_height.jsx +5 -6
  279. data/app/pb_kits/playbook/pb_popover/docs/_popover_z_index.jsx +4 -5
  280. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_align.jsx +1 -1
  281. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_default.jsx +1 -1
  282. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_flex.jsx +3 -1
  283. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_muted.jsx +1 -1
  284. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_value.jsx +1 -1
  285. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_variants.jsx +1 -1
  286. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_width.jsx +1 -1
  287. data/app/pb_kits/playbook/pb_radio/docs/_radio_alignment.jsx +3 -1
  288. data/app/pb_kits/playbook/pb_radio/docs/_radio_error.jsx +1 -1
  289. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_default.jsx +1 -1
  290. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_preview.jsx +3 -1
  291. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_attributes.jsx +1 -1
  292. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_default.jsx +1 -1
  293. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_focus.jsx +1 -1
  294. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_inline.jsx +1 -1
  295. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_more_extensions.jsx +1 -1
  296. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_preview.jsx +3 -5
  297. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_simple.jsx +1 -1
  298. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_sticky.jsx +1 -1
  299. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_templates.jsx +2 -1
  300. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_toolbar_bottom.jsx +1 -1
  301. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_toolbar_disabled.jsx +1 -1
  302. data/app/pb_kits/playbook/pb_section_separator/docs/_section_separator_children.jsx +3 -1
  303. data/app/pb_kits/playbook/pb_section_separator/docs/_section_separator_color.jsx +4 -1
  304. data/app/pb_kits/playbook/pb_section_separator/docs/_section_separator_dashed.jsx +1 -1
  305. data/app/pb_kits/playbook/pb_section_separator/docs/_section_separator_line.jsx +1 -1
  306. data/app/pb_kits/playbook/pb_section_separator/docs/_section_separator_text.jsx +1 -1
  307. data/app/pb_kits/playbook/pb_select/docs/_select_error.jsx +2 -1
  308. data/app/pb_kits/playbook/pb_select/docs/_select_inline.jsx +2 -1
  309. data/app/pb_kits/playbook/pb_select/docs/_select_inline_compact.jsx +2 -1
  310. data/app/pb_kits/playbook/pb_select/docs/_select_inline_show_arrow.jsx +2 -1
  311. data/app/pb_kits/playbook/pb_selectable_card/docs/_selectable_card_error.jsx +4 -1
  312. data/app/pb_kits/playbook/pb_selectable_list/docs/_selectable_list_checkbox.jsx +1 -1
  313. data/app/pb_kits/playbook/pb_selectable_list/docs/_selectable_list_radio.jsx +1 -1
  314. data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_border_radius.jsx +2 -1
  315. data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_color.jsx +2 -1
  316. data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_default.jsx +1 -2
  317. data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_filter.jsx +8 -1
  318. data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_height_width.jsx +2 -1
  319. data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_layout.jsx +1 -2
  320. data/app/pb_kits/playbook/pb_skeleton_loading/docs/_skeleton_loading_user.jsx +5 -1
  321. data/app/pb_kits/playbook/pb_stat_change/docs/_stat_change_default.jsx +1 -1
  322. data/app/pb_kits/playbook/pb_stat_change/docs/_stat_change_unit.jsx +1 -1
  323. data/app/pb_kits/playbook/pb_stat_change/docs/_stat_change_unit_two.jsx +1 -1
  324. data/app/pb_kits/playbook/pb_table/docs/_table_with_clickable_rows.jsx +2 -1
  325. data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible.jsx +4 -1
  326. data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_click.jsx +4 -1
  327. data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_custom_content.jsx +7 -1
  328. data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_rows.jsx +4 -1
  329. data/app/pb_kits/playbook/pb_table/docs/_table_with_collapsible_with_nested_table.jsx +5 -1
  330. data/app/pb_kits/playbook/pb_table/docs/_table_with_selectable_rows.jsx +5 -1
  331. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_error.jsx +1 -1
  332. data/app/pb_kits/playbook/pb_time_range_inline/docs/_time_range_inline_default.jsx +1 -1
  333. data/app/pb_kits/playbook/pb_timestamp/docs/_timestamp_unstyled.jsx +3 -1
  334. data/app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx +1 -1
  335. data/app/pb_kits/playbook/pb_toggle/docs/_toggle_custom_radio.jsx +3 -1
  336. data/app/pb_kits/playbook/pb_toggle/docs/_toggle_default.jsx +1 -1
  337. data/app/pb_kits/playbook/pb_toggle/docs/_toggle_disabled.jsx +1 -1
  338. data/app/pb_kits/playbook/pb_toggle/docs/_toggle_name.jsx +3 -1
  339. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default_react.jsx +3 -1
  340. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_delay.jsx +4 -1
  341. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_icon.jsx +3 -1
  342. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_icon_rails.html.erb +22 -0
  343. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_interaction.jsx +4 -1
  344. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_margin.jsx +3 -1
  345. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_show_tooltip_react.jsx +5 -1
  346. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_sizing.html.erb +22 -0
  347. data/app/pb_kits/playbook/pb_tooltip/docs/example.yml +2 -0
  348. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_async_createable.jsx +1 -1
  349. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_createable.jsx +1 -1
  350. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_custom_menu_list.jsx +1 -3
  351. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.jsx +66 -0
  352. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.md +1 -0
  353. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.jsx +1 -1
  354. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_highlight.jsx +6 -8
  355. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills.jsx +1 -1
  356. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async.jsx +3 -5
  357. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async_custom_options.jsx +4 -6
  358. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async_users.jsx +4 -6
  359. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color.jsx +1 -1
  360. data/app/pb_kits/playbook/pb_typeahead/docs/example.yml +1 -0
  361. data/app/pb_kits/playbook/pb_typeahead/docs/index.js +1 -0
  362. data/app/pb_kits/playbook/pb_user/docs/_user_block_content_subtitle_react.jsx +6 -1
  363. data/app/pb_kits/playbook/pb_user/docs/_user_default.jsx +1 -1
  364. data/app/pb_kits/playbook/pb_user/docs/_user_light_weight.jsx +1 -1
  365. data/app/pb_kits/playbook/pb_user/docs/_user_size.jsx +1 -1
  366. data/app/pb_kits/playbook/pb_user/docs/_user_subtitle.jsx +1 -1
  367. data/app/pb_kits/playbook/pb_user/docs/_user_text_only.jsx +1 -1
  368. data/app/pb_kits/playbook/pb_user/docs/_user_vertical_size.jsx +1 -1
  369. data/app/pb_kits/playbook/pb_user/docs/_user_with_territory.jsx +1 -1
  370. data/app/pb_kits/playbook/pb_walkthrough/docs/_walkthrough_continuous.jsx +2 -1
  371. data/app/pb_kits/playbook/pb_walkthrough/docs/_walkthrough_default.jsx +2 -1
  372. data/app/pb_kits/playbook/pb_walkthrough/docs/_walkthrough_multi_beacon.jsx +2 -1
  373. data/app/pb_kits/playbook/pb_walkthrough/docs/_walkthrough_no_beacon.jsx +2 -1
  374. data/app/pb_kits/playbook/pb_walkthrough/docs/_walkthrough_no_overlay.jsx +2 -1
  375. data/app/pb_kits/playbook/pb_walkthrough/docs/_walkthrough_styled.jsx +2 -1
  376. data/dist/playbook-doc.js +1 -1
  377. metadata +34 -3
  378. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_icon.erb +0 -10
@@ -0,0 +1,74 @@
1
+ <% treeData = [{
2
+ label: "Power Home Remodeling",
3
+ value: "Power Home Remodeling",
4
+ id: "powerhome1",
5
+ expanded: true,
6
+ children: [
7
+ {
8
+ label: "People",
9
+ value: "People",
10
+ id: "people1",
11
+ expanded: true,
12
+ children: [
13
+ {
14
+ label: "Talent Acquisition",
15
+ value: "Talent Acquisition",
16
+ id: "talent1",
17
+ },
18
+ {
19
+ label: "Business Affairs",
20
+ value: "Business Affairs",
21
+ id: "business1",
22
+ expanded: true,
23
+ disabled: true,
24
+ children: [
25
+ {
26
+ label: "Initiatives",
27
+ value: "Initiatives",
28
+ id: "initiative1",
29
+ },
30
+ {
31
+ label: "Learning & Development",
32
+ value: "Learning & Development",
33
+ id: "development1",
34
+ },
35
+ ],
36
+ },
37
+ {
38
+ label: "People Experience",
39
+ value: "People Experience",
40
+ id: "experience1",
41
+ },
42
+ ],
43
+ },
44
+ {
45
+ label: "Contact Center",
46
+ value: "Contact Center",
47
+ id: "contact1",
48
+ children: [
49
+ {
50
+ label: "Appointment Management",
51
+ value: "Appointment Management",
52
+ id: "appointment1",
53
+ },
54
+ {
55
+ label: "Customer Service",
56
+ value: "Customer Service",
57
+ id: "customer1",
58
+ },
59
+ {
60
+ label: "Energy",
61
+ value: "Energy",
62
+ id: "energy1",
63
+ },
64
+ ],
65
+ },
66
+ ],
67
+ }] %>
68
+
69
+
70
+ <%= pb_rails("multi_level_select", props: {
71
+ id: "mls-disabled-options-parent-default-rails",
72
+ name: "disabled_options_parent_default",
73
+ tree_data: treeData
74
+ }) %>
@@ -0,0 +1,92 @@
1
+ import React from "react";
2
+ import MultiLevelSelect from "../_multi_level_select";
3
+
4
+ const treeData = [
5
+ {
6
+ label: "Power Home Remodeling",
7
+ value: "Power Home Remodeling",
8
+ id: "powerhome1",
9
+ expanded: true,
10
+ children: [
11
+ {
12
+ label: "People",
13
+ value: "People",
14
+ id: "people1",
15
+ expanded: true,
16
+ children: [
17
+ {
18
+ label: "Talent Acquisition",
19
+ value: "Talent Acquisition",
20
+ id: "talent1",
21
+ },
22
+ {
23
+ label: "Business Affairs",
24
+ value: "Business Affairs",
25
+ id: "business1",
26
+ expanded: true,
27
+ disabled: true,
28
+ children: [
29
+ {
30
+ label: "Initiatives",
31
+ value: "Initiatives",
32
+ id: "initiative1",
33
+ },
34
+ {
35
+ label: "Learning & Development",
36
+ value: "Learning & Development",
37
+ id: "development1",
38
+ },
39
+ ],
40
+ },
41
+ {
42
+ label: "People Experience",
43
+ value: "People Experience",
44
+ id: "experience1",
45
+ },
46
+ ],
47
+ },
48
+ {
49
+ label: "Contact Center",
50
+ value: "Contact Center",
51
+ id: "contact1",
52
+ children: [
53
+ {
54
+ label: "Appointment Management",
55
+ value: "Appointment Management",
56
+ id: "appointment1",
57
+ },
58
+ {
59
+ label: "Customer Service",
60
+ value: "Customer Service",
61
+ id: "customer1",
62
+ },
63
+ {
64
+ label: "Energy",
65
+ value: "Energy",
66
+ id: "energy1",
67
+ },
68
+ ],
69
+ },
70
+ ],
71
+ },
72
+ ];
73
+
74
+ const MultiLevelSelectDisabledOptionsParentDefault = (props) => {
75
+ return (
76
+ <div>
77
+ <MultiLevelSelect
78
+ id='multiselect-disabled-options-parent-default'
79
+ onSelect={(selectedNodes) =>
80
+ console.log(
81
+ "Selected Items",
82
+ selectedNodes
83
+ )
84
+ }
85
+ treeData={treeData}
86
+ {...props}
87
+ />
88
+ </div>
89
+ )
90
+ };
91
+
92
+ export default MultiLevelSelectDisabledOptionsParentDefault;
@@ -0,0 +1,3 @@
1
+ For the `default` variant, disabling the parent item will automatically disable it's children as well.
2
+
3
+ If you want to be able to disable a parent WITHOUT disabling it's children, use the `returnAllSelected`/`return_all_selected` variant.
@@ -0,0 +1,91 @@
1
+ import React from "react"
2
+ import MultiLevelSelect from "../_multi_level_select"
3
+ import { useForm } from "react-hook-form"
4
+
5
+ const treeData = [
6
+ {
7
+ label: "Power Home Remodeling",
8
+ value: "Power Home Remodeling",
9
+ id: "powerhome1",
10
+ expanded: true,
11
+ children: [
12
+ {
13
+ label: "People",
14
+ value: "People",
15
+ id: "people1",
16
+ expanded: true,
17
+ children: [
18
+ {
19
+ label: "Talent Acquisition",
20
+ value: "Talent Acquisition",
21
+ id: "talent1",
22
+ },
23
+ {
24
+ label: "Business Affairs",
25
+ value: "Business Affairs",
26
+ id: "business1",
27
+ children: [
28
+ {
29
+ label: "Initiatives",
30
+ value: "Initiatives",
31
+ id: "initiative1",
32
+ },
33
+ {
34
+ label: "Learning & Development",
35
+ value: "Learning & Development",
36
+ id: "development1",
37
+ },
38
+ ],
39
+ },
40
+ {
41
+ label: "People Experience",
42
+ value: "People Experience",
43
+ id: "experience1",
44
+ },
45
+ ],
46
+ },
47
+ {
48
+ label: "Contact Center",
49
+ value: "Contact Center",
50
+ id: "contact1",
51
+ children: [
52
+ {
53
+ label: "Appointment Management",
54
+ value: "Appointment Management",
55
+ id: "appointment1",
56
+ },
57
+ {
58
+ label: "Customer Service",
59
+ value: "Customer Service",
60
+ id: "customer1",
61
+ },
62
+ {
63
+ label: "Energy",
64
+ value: "Energy",
65
+ id: "energy1",
66
+ },
67
+ ],
68
+ },
69
+ ],
70
+ },
71
+ ]
72
+
73
+ const MultiLevelSelectReactHook = (props) => {
74
+ const { register, watch } = useForm()
75
+ const selectedItems = watch("departments")
76
+ selectedItems && console.log("Selected Items", selectedItems)
77
+
78
+ return (
79
+ <div>
80
+ <MultiLevelSelect
81
+ id="multiselect-default"
82
+ marginBottom="md"
83
+ treeData={treeData}
84
+ {...register("departments")}
85
+ {...props}
86
+ />
87
+ </div>
88
+ )
89
+ }
90
+
91
+ export default MultiLevelSelectReactHook
@@ -0,0 +1 @@
1
+ You can pass `react-hook-form` props to the MultiLevelSelect kit. Check your console to see the full data selected from this example.
@@ -8,10 +8,15 @@ examples:
8
8
  - multi_level_select_with_form: With Form
9
9
  - multi_level_select_color: With Pills (Custom Color)
10
10
  - multi_level_select_reset: Reset Selection
11
- - multi_level_select_disabled: Disabled
11
+ - multi_level_select_disabled: Disabled Input
12
+ - multi_level_select_disabled_options_default: Disabled Options (Default)
13
+ - multi_level_select_disabled_options: Disabled Options (Return All Selected)
14
+ - multi_level_select_disabled_options_parent_default: Disabled Parent Option (Default)
15
+ - multi_level_select_disabled_options_parent: Disabled Parent Option (Return All Selected)
12
16
 
13
17
  react:
14
18
  - multi_level_select_default: Default
19
+ - multi_level_select_react_hook: React Hook
15
20
  - multi_level_select_single: Single Select
16
21
  - multi_level_select_single_children_only: Single Select w/ Hidden Radios
17
22
  - multi_level_select_return_all_selected: Return All Selected
@@ -19,4 +24,8 @@ examples:
19
24
  - multi_level_select_color: With Pills (Custom Color)
20
25
  - multi_level_select_with_children: Checkboxes With Children
21
26
  - multi_level_select_with_children_with_radios: Single Select With Children
22
- - multi_level_select_disabled: Disabled
27
+ - multi_level_select_disabled: Disabled Input
28
+ - multi_level_select_disabled_options_default: Disabled Options (Default)
29
+ - multi_level_select_disabled_options: Disabled Options (Return All Selected)
30
+ - multi_level_select_disabled_options_parent_default: Disabled Parent Option (Default)
31
+ - multi_level_select_disabled_options_parent: Disabled Parent Option (Return All Selected)
@@ -7,3 +7,8 @@ export { default as MultiLevelSelectColor } from './_multi_level_select_color.js
7
7
  export { default as MultiLevelSelectWithChildren } from './_multi_level_select_with_children.jsx'
8
8
  export { default as MultiLevelSelectWithChildrenWithRadios } from './_multi_level_select_with_children_with_radios.jsx'
9
9
  export { default as MultiLevelSelectDisabled } from './_multi_level_select_disabled.jsx'
10
+ export { default as MultiLevelSelectReactHook } from './_multi_level_select_react_hook.jsx'
11
+ export { default as MultiLevelSelectDisabledOptions } from './_multi_level_select_disabled_options.jsx'
12
+ export { default as MultiLevelSelectDisabledOptionsParent } from './_multi_level_select_disabled_options_parent.jsx'
13
+ export { default as MultiLevelSelectDisabledOptionsParentDefault } from './_multi_level_select_disabled_options_parent_default.jsx'
14
+ export { default as MultiLevelSelectDisabledOptionsDefault } from './_multi_level_select_disabled_options_default.jsx'
@@ -1,5 +1,5 @@
1
1
  import React from 'react'
2
- import { MultipleUsers } from 'playbook-ui'
2
+ import MultipleUsers from '../../pb_multiple_users/_multiple_users'
3
3
 
4
4
  const MultipleUsersDefault = (props) => {
5
5
  return (
@@ -1,5 +1,5 @@
1
1
  import React from 'react'
2
- import { MultipleUsers } from 'playbook-ui'
2
+ import MultipleUsers from '../../pb_multiple_users/_multiple_users'
3
3
 
4
4
  const MultipleUsersReverse = (props) => {
5
5
  return (
@@ -1,5 +1,6 @@
1
1
  import React from 'react'
2
- import { Body, MultipleUsers } from 'playbook-ui'
2
+ import Body from '../../pb_body/_body'
3
+ import MultipleUsers from '../../pb_multiple_users/_multiple_users'
3
4
 
4
5
  const MultipleUsersSize = (props) => {
5
6
  return (
@@ -1,5 +1,6 @@
1
1
  import React from "react";
2
- import { Nav, NavItem } from 'playbook-ui'
2
+ import Nav from '../../pb_nav/_nav'
3
+ import NavItem from '../../pb_nav/_item'
3
4
 
4
5
  const CollapsibleNav = (props) => {
5
6
  return (
@@ -1,5 +1,8 @@
1
1
  import React from "react"
2
- import { Nav, NavItem, useCollapsible } from "playbook-ui"
2
+
3
+ import Nav from '../../pb_nav/_nav'
4
+ import NavItem from '../../pb_nav/_item'
5
+ import useCollapsible from '../../pb_collapsible/useCollapsible'
3
6
 
4
7
  const CollapsibleNavCustom = (props) => {
5
8
  const navItems = ["Overview", "Albums", "Similar Artists"]
@@ -1,5 +1,6 @@
1
1
  import React from "react";
2
- import { Nav, NavItem } from 'playbook-ui'
2
+ import Nav from '../../pb_nav/_nav'
3
+ import NavItem from '../../pb_nav/_item'
3
4
 
4
5
  const CollapsibleNavItemSpacing = (props) => {
5
6
  return (
@@ -1,5 +1,6 @@
1
1
  import React from "react";
2
- import { Nav, NavItem } from 'playbook-ui'
2
+ import Nav from '../../pb_nav/_nav'
3
+ import NavItem from '../../pb_nav/_item'
3
4
 
4
5
  const CollapsibleNavNoIcon = (props) => {
5
6
  return (
@@ -1,5 +1,6 @@
1
1
  import React from "react"
2
- import { Nav, NavItem } from "playbook-ui"
2
+ import Nav from '../../pb_nav/_nav'
3
+ import NavItem from '../../pb_nav/_item'
3
4
 
4
5
  const CollapsibleNavWithAllOptions = (props) => {
5
6
  const navItems = ["Overview", "Albums", "Similar Artists"]
@@ -1,5 +1,6 @@
1
1
  import React from "react";
2
- import { Nav, NavItem } from 'playbook-ui'
2
+ import Nav from '../../pb_nav/_nav'
3
+ import NavItem from '../../pb_nav/_item'
3
4
 
4
5
  const NavWithFontControl = (props) => {
5
6
  return (
@@ -1,8 +1,8 @@
1
1
  import React from 'react'
2
- import {
3
- Overlay,
4
- Table,
5
- } from 'playbook-ui'
2
+
3
+ import Overlay from '../../pb_overlay/_overlay'
4
+ import Table from '../../pb_table/_table'
5
+
6
6
 
7
7
  const TableExample = () => {
8
8
  return (
@@ -1,10 +1,9 @@
1
1
  import React from 'react'
2
- import {
3
- Overlay,
4
- Card,
5
- Flex,
6
- FlexItem,
7
- } from 'playbook-ui'
2
+
3
+ import Overlay from '../../pb_overlay/_overlay'
4
+ import Card from '../../pb_card/_card'
5
+ import Flex from '../../pb_flex/_flex'
6
+ import FlexItem from '../../pb_flex/_flex_item'
8
7
 
9
8
  const InlineCardsExample = () => {
10
9
  return (
@@ -1,10 +1,8 @@
1
1
  import React from 'react'
2
- import {
3
- Overlay,
4
- Card,
5
- Flex,
6
- FlexItem,
7
- } from 'playbook-ui'
2
+ import Overlay from '../../pb_overlay/_overlay'
3
+ import Card from '../../pb_card/_card'
4
+ import Flex from '../../pb_flex/_flex'
5
+ import FlexItem from '../../pb_flex/_flex_item'
8
6
 
9
7
  const InlineCardsExample = () => {
10
8
  return (
@@ -1,6 +1,9 @@
1
1
  /* eslint-disable react/no-multi-comp */
2
2
  import React, { useState } from "react";
3
- import { Overlay, Table, Button } from "playbook-ui";
3
+
4
+ import Overlay from '../../pb_overlay/_overlay'
5
+ import Button from '../../pb_button/_button'
6
+ import Table from '../../pb_table/_table'
4
7
 
5
8
  const TableExample = () => {
6
9
  return (
@@ -1,10 +1,8 @@
1
1
  import React, { forwardRef } from 'react'
2
- import {
3
- Overlay,
4
- Card,
5
- Flex,
6
- FlexItem,
7
- } from 'playbook-ui'
2
+ import Overlay from '../../pb_overlay/_overlay'
3
+ import Card from '../../pb_card/_card'
4
+ import Flex from '../../pb_flex/_flex'
5
+ import FlexItem from '../../pb_flex/_flex_item'
8
6
 
9
7
  const InlineCardsExample = forwardRef(function InlineCardsExample(ref) {
10
8
  return (
@@ -1,5 +1,6 @@
1
1
  import React, { useState } from "react";
2
- import { Table, Pagination } from 'playbook-ui'
2
+ import Table from '../../pb_table/_table'
3
+ import Pagination from '../../pb_pagination/_pagination'
3
4
 
4
5
 
5
6
  import { data } from "./data";
@@ -1,6 +1,8 @@
1
1
  import React, { useState, useEffect } from 'react'
2
2
 
3
- import { Caption, Passphrase, ProgressSimple } from 'playbook-ui'
3
+ import Passphrase from '../../pb_passphrase/_passphrase'
4
+ import Caption from '../../pb_caption/_caption'
5
+ import ProgressSimple from '../../pb_progress_simple/_progress_simple'
4
6
  import zxcvbn from 'zxcvbn'
5
7
 
6
8
  const PassphraseBreached = (props) => {
@@ -1,6 +1,9 @@
1
1
  import React, { useState, useEffect } from 'react'
2
2
 
3
- import {Body, Caption, Passphrase, ProgressSimple} from 'playbook-ui'
3
+ import Body from '../../pb_body/_body'
4
+ import Passphrase from '../../pb_passphrase/_passphrase'
5
+ import Caption from '../../pb_caption/_caption'
6
+ import ProgressSimple from '../../pb_progress_simple/_progress_simple'
4
7
  import zxcvbn from 'zxcvbn'
5
8
 
6
9
  const PassphraseCommon = (props) => {
@@ -1,6 +1,7 @@
1
1
  import React, { useState } from 'react'
2
2
 
3
- import {Body, Passphrase} from 'playbook-ui'
3
+ import Body from '../../pb_body/_body'
4
+ import Passphrase from '../../pb_passphrase/_passphrase'
4
5
 
5
6
  const PassphraseConfirmation = (props) => {
6
7
  const [input, setInput] = useState('')
@@ -1,6 +1,11 @@
1
1
  import React, { useState } from 'react'
2
2
 
3
- import { Body, Caption, Passphrase, ProgressSimple, TextInput } from 'playbook-ui'
3
+ import Body from '../../pb_body/_body'
4
+ import Passphrase from '../../pb_passphrase/_passphrase'
5
+ import ProgressSimple from '../../pb_progress_simple/_progress_simple'
6
+ import Caption from '../../pb_caption/_caption'
7
+ import TextInput from '../../pb_text_input/_text_input'
8
+
4
9
  import zxcvbn from 'zxcvbn'
5
10
 
6
11
 
@@ -1,7 +1,11 @@
1
1
  import React, { useState } from 'react'
2
2
  import { useEffect } from 'react'
3
3
 
4
- import { Caption, Passphrase, ProgressSimple, TextInput} from 'playbook-ui'
4
+ import Passphrase from '../../pb_passphrase/_passphrase'
5
+ import Caption from '../../pb_caption/_caption'
6
+ import ProgressSimple from '../../pb_progress_simple/_progress_simple'
7
+ import TextInput from '../../pb_text_input/_text_input'
8
+
5
9
  import zxcvbn from 'zxcvbn'
6
10
 
7
11
  const PassphraseStrengthChange = (props) => {
@@ -1,5 +1,7 @@
1
1
  import React, { useEffect, useRef } from 'react'
2
- import { Body, PhoneNumberInput } from 'playbook-ui'
2
+
3
+ import Body from '../../pb_body/_body'
4
+ import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
3
5
 
4
6
  const PhoneNumberInputAccessInputElement = (props) => {
5
7
  // 1. Create a ref - this accesses the kit's input element.
@@ -1,5 +1,7 @@
1
1
  import React, { useRef } from 'react'
2
- import { Button, PhoneNumberInput } from 'playbook-ui'
2
+
3
+ import Button from '../../pb_button/_button'
4
+ import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
3
5
 
4
6
  const PhoneNumberInputClearField = (props) => {
5
7
  // 1. Create a ref - this accesses the kit's input element.
@@ -1,3 +1,3 @@
1
1
  <%= pb_rails("phone_number_input", props: {
2
- id: "hello"
2
+ id: "hello",
3
3
  }) %>
@@ -1,5 +1,5 @@
1
1
  import React from 'react'
2
- import { PhoneNumberInput } from 'playbook-ui'
2
+ import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
3
3
 
4
4
  const PhoneNumberInputDefault = (props) => (
5
5
  <>
@@ -1,5 +1,7 @@
1
1
  import React, { useState } from "react";
2
- import { PhoneNumberInput, Body } from "playbook-ui";
2
+
3
+ import Body from '../../pb_body/_body'
4
+ import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
3
5
 
4
6
  const PhoneNumberInputFormat = (props) => {
5
7
  const [phoneNumber, setPhoneNumber] = useState("");
@@ -0,0 +1,5 @@
1
+ <%= pb_rails("phone_number_input", props: {
2
+ hidden_inputs: true,
3
+ id: "hidden_inputs",
4
+ name: "hidden_inputs",
5
+ }) %>
@@ -0,0 +1 @@
1
+ The `hidden_inputs` boolean prop generates two hidden input fields, {field_name}_full and {field_name}_country_code. The value passed when the form is submitted contains the full phone number including the country code. Because it requires the submission of a form to function, only use this prop on Rails phone number elements within html form tags `<form>/<form>` or [pb_forms](https://playbook.powerapp.cloud/kits/form). Read the [intl-tel-input](https://intl-tel-input.com/examples/hidden-input.html) docs for more information.
@@ -1,5 +1,5 @@
1
1
  import React from 'react'
2
- import { PhoneNumberInput } from 'playbook-ui'
2
+ import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
3
3
 
4
4
  const PhoneNumberInitialCountry = (props) => (
5
5
  <>
@@ -1,5 +1,5 @@
1
1
  import React from 'react'
2
- import { PhoneNumberInput } from 'playbook-ui'
2
+ import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
3
3
 
4
4
  const PhoneNumberInputOnlyCountries = (props) => (
5
5
  <>
@@ -1,5 +1,5 @@
1
1
  import React from 'react'
2
- import { PhoneNumberInput } from 'playbook-ui'
2
+ import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
3
3
 
4
4
  const PhoneNumberInputPreferredCountries = (props) => (
5
5
  <>
@@ -1,5 +1,8 @@
1
1
  import React, { useEffect, useState } from "react";
2
- import { Button, FixedConfirmationToast, PhoneNumberInput } from "playbook-ui";
2
+
3
+ import Button from '../../pb_button/_button'
4
+ import FixedConfirmationToast from '../../pb_fixed_confirmation_toast/_fixed_confirmation_toast'
5
+ import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
3
6
 
4
7
  const PhoneNumberInputValidation = (props) => {
5
8
  const [formErrors, setFormErrors] = useState("");
@@ -16,4 +16,6 @@ examples:
16
16
  - phone_number_input_initial_country: Initial Country
17
17
  - phone_number_input_only_countries: Limited Countries
18
18
  - phone_number_input_validation: Form Validation
19
- - phone_number_input_format: Format as You Type
19
+ - phone_number_input_format: Format as You Type
20
+ - phone_number_input_hidden_inputs: Hidden Inputs
21
+