@elastic/eui 90.0.0 → 91.1.0

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 (552) hide show
  1. package/dist/eui_charts_theme.js +1 -15
  2. package/dist/eui_charts_theme.js.map +1 -1
  3. package/dist/eui_theme_dark.css +302 -203
  4. package/dist/eui_theme_dark.min.css +1 -1
  5. package/dist/eui_theme_light.css +302 -203
  6. package/dist/eui_theme_light.min.css +1 -1
  7. package/es/components/accordion/accordion.a11y.js +1 -3
  8. package/es/components/accordion/accordion.js +13 -2
  9. package/es/components/accordion/accordion_children/accordion_children.js +4 -3
  10. package/es/components/basic_table/action_types.js +5 -0
  11. package/es/components/basic_table/basic_table.a11y.js +1 -2
  12. package/es/components/basic_table/basic_table.js +8 -8
  13. package/es/components/basic_table/collapsed_item_actions.js +120 -249
  14. package/es/components/basic_table/custom_item_action.js +9 -95
  15. package/es/components/basic_table/default_item_action.js +23 -14
  16. package/es/components/basic_table/in_memory_table.a11y.js +13 -11
  17. package/es/components/basic_table/in_memory_table.js +8 -8
  18. package/es/components/breadcrumbs/breadcrumb.js +16 -12
  19. package/es/components/breadcrumbs/breadcrumb.styles.js +5 -0
  20. package/es/components/breadcrumbs/breadcrumbs.js +5 -5
  21. package/es/components/button/button_display/_button_display.js +6 -4
  22. package/es/components/button/button_display/_button_display_content.js +8 -4
  23. package/es/components/button/button_empty/button_empty.js +9 -7
  24. package/es/components/button/button_group/button_group.js +13 -13
  25. package/es/components/button/button_group/button_group_button.js +13 -54
  26. package/es/components/button/button_group/button_group_button.styles.js +2 -12
  27. package/es/components/card/card.a11y.js +5 -18
  28. package/es/components/collapsible_nav/collapsible_nav_group/collapsible_nav_group.js +8 -0
  29. package/es/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +2 -2
  30. package/es/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
  31. package/es/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +12 -9
  32. package/es/components/collapsible_nav_beta/collapsible_nav_group/collapsible_nav_group.js +9 -104
  33. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +20 -58
  34. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +89 -37
  35. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +67 -81
  36. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +1 -19
  37. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +7 -102
  38. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
  39. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +11 -90
  40. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +150 -130
  41. package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_link.js +0 -10
  42. package/es/components/combo_box/combo_box.js +8 -6
  43. package/es/components/combo_box/combo_box_input/combo_box_input.js +107 -65
  44. package/es/components/combo_box/combo_box_input/combo_box_pill.js +8 -18
  45. package/es/components/combo_box/combo_box_options_list/combo_box_options_list.js +6 -6
  46. package/es/components/combo_box/utils.js +23 -0
  47. package/es/components/context_menu/context_menu_item.js +16 -8
  48. package/es/components/context_menu/context_menu_item.styles.js +1 -1
  49. package/es/components/control_bar/control_bar.js +5 -5
  50. package/es/components/datagrid/body/data_grid_body.js +16 -6
  51. package/es/components/datagrid/body/data_grid_body_custom.js +16 -6
  52. package/es/components/datagrid/body/data_grid_body_virtualized.js +16 -6
  53. package/es/components/datagrid/body/data_grid_cell.js +67 -44
  54. package/es/components/datagrid/body/data_grid_cell_actions.js +12 -12
  55. package/es/components/datagrid/body/data_grid_cell_popover.js +43 -10
  56. package/es/components/datagrid/body/header/data_grid_header_cell.js +66 -35
  57. package/es/components/datagrid/body/header/data_grid_header_row.js +16 -6
  58. package/es/components/datagrid/controls/column_selector.js +24 -45
  59. package/es/components/datagrid/controls/column_sorting.js +23 -37
  60. package/es/components/datagrid/controls/data_grid_toolbar_control.js +154 -0
  61. package/es/components/datagrid/controls/display_selector.js +21 -17
  62. package/es/components/datagrid/controls/fullscreen_selector.js +2 -6
  63. package/es/components/datagrid/controls/index.js +2 -1
  64. package/es/components/datagrid/data_grid.js +3 -864
  65. package/es/components/datagrid/index.js +1 -1
  66. package/es/components/datagrid/utils/in_memory.js +16 -6
  67. package/es/components/datagrid/utils/row_heights.js +1 -1
  68. package/es/components/date_picker/auto_refresh/auto_refresh.js +6 -4
  69. package/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +92 -26
  70. package/es/components/date_picker/super_date_picker/date_popover/date_popover_button.js +1 -1
  71. package/es/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.js +1 -2
  72. package/es/components/date_picker/super_date_picker/super_date_picker.js +19 -0
  73. package/es/components/date_picker/super_date_picker/super_update_button.js +1 -1
  74. package/es/components/error_boundary/error_boundary.a11y.js +1 -1
  75. package/es/components/expression/expression.a11y.js +2 -4
  76. package/es/components/facet/facet_button.js +6 -4
  77. package/es/components/filter_group/filter_button.js +2 -2
  78. package/es/components/filter_group/filter_group.styles.js +1 -1
  79. package/es/components/focus_trap/focus_trap.a11y.js +3 -3
  80. package/es/components/form/range/range.a11y.js +5 -10
  81. package/es/components/form/super_select/super_select.js +3 -2
  82. package/es/components/form/super_select/super_select_control.js +13 -20
  83. package/es/components/header/header.a11y.js +1 -1
  84. package/es/components/header/header_breadcrumbs/header_breadcrumbs.js +5 -5
  85. package/es/components/header/header_links/header_link.js +7 -5
  86. package/es/components/header/header_links/header_links.js +5 -5
  87. package/es/components/header/header_section/header_section_item_button.js +7 -5
  88. package/es/components/i18n/i18n.js +1 -0
  89. package/es/components/image/image.a11y.js +1 -2
  90. package/es/components/key_pad_menu/key_pad_menu.a11y.js +5 -5
  91. package/es/components/link/external_link_icon.js +51 -0
  92. package/es/components/link/link.js +6 -20
  93. package/es/components/link/link.styles.js +2 -5
  94. package/es/components/list_group/list_group.js +6 -1
  95. package/es/components/list_group/list_group_item.js +14 -4
  96. package/es/components/list_group/list_group_item.styles.js +2 -1
  97. package/es/components/list_group/pinnable_list_group/pinnable_list_group.js +12 -2
  98. package/es/components/notification/notification_event.a11y.js +1 -2
  99. package/es/components/notification/notification_event.js +7 -5
  100. package/es/components/page/page_header/page_header_content.js +5 -5
  101. package/es/components/pagination/pagination_button.js +7 -5
  102. package/es/components/popover/input_popover.js +1 -1
  103. package/es/components/popover/popover.js +19 -28
  104. package/es/components/popover/popover_arrow/_popover_arrow.styles.js +2 -4
  105. package/es/components/popover/popover_panel/_popover_panel.js +2 -6
  106. package/es/components/popover/popover_panel/_popover_panel.styles.js +6 -1
  107. package/es/components/resizable_container/resizable_container.a11y.js +4 -8
  108. package/es/components/search_bar/search_bar.a11y.js +3 -6
  109. package/es/components/selectable/selectable.js +16 -1
  110. package/es/components/selectable/selectable_list/selectable_list.js +227 -78
  111. package/es/components/selectable/selectable_templates/selectable_template_sitewide.js +29 -12
  112. package/es/components/text/text.styles.js +2 -2
  113. package/es/components/text_truncate/text_truncate.js +33 -10
  114. package/es/components/toast/global_toast_list.js +11 -1
  115. package/es/components/tour/tour_step.js +5 -5
  116. package/es/global_styling/mixins/_states.js +4 -1
  117. package/es/services/color/eui_palettes.js +0 -6
  118. package/es/services/color/index.js +1 -1
  119. package/es/services/hooks/useCombinedRefs.js +16 -9
  120. package/es/services/index.js +1 -2
  121. package/es/test/rtl/component_helpers.d.ts +2 -0
  122. package/es/test/rtl/component_helpers.js +40 -1
  123. package/eui.d.ts +562 -218
  124. package/i18ntokens.json +329 -347
  125. package/lib/components/accordion/accordion.a11y.js +1 -3
  126. package/lib/components/accordion/accordion.js +13 -2
  127. package/lib/components/accordion/accordion_children/accordion_children.js +4 -3
  128. package/lib/components/basic_table/action_types.js +8 -2
  129. package/lib/components/basic_table/basic_table.a11y.js +1 -2
  130. package/lib/components/basic_table/basic_table.js +8 -8
  131. package/lib/components/basic_table/collapsed_item_actions.js +128 -257
  132. package/lib/components/basic_table/custom_item_action.js +18 -104
  133. package/lib/components/basic_table/default_item_action.js +23 -14
  134. package/lib/components/basic_table/in_memory_table.a11y.js +13 -11
  135. package/lib/components/basic_table/in_memory_table.js +8 -8
  136. package/lib/components/breadcrumbs/breadcrumb.js +16 -12
  137. package/lib/components/breadcrumbs/breadcrumb.styles.js +5 -0
  138. package/lib/components/button/button_display/_button_display.js +6 -4
  139. package/lib/components/button/button_display/_button_display_content.js +8 -4
  140. package/lib/components/button/button_empty/button_empty.js +9 -7
  141. package/lib/components/button/button_group/button_group.js +12 -12
  142. package/lib/components/button/button_group/button_group_button.js +13 -54
  143. package/lib/components/button/button_group/button_group_button.styles.js +2 -12
  144. package/lib/components/card/card.a11y.js +5 -18
  145. package/lib/components/collapsible_nav/collapsible_nav_group/collapsible_nav_group.js +8 -0
  146. package/lib/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +1 -1
  147. package/lib/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
  148. package/lib/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +12 -9
  149. package/lib/components/collapsible_nav_beta/collapsible_nav_group/collapsible_nav_group.js +8 -103
  150. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +20 -58
  151. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +89 -37
  152. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +66 -80
  153. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +11 -28
  154. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +7 -104
  155. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
  156. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +10 -89
  157. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +150 -130
  158. package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_link.js +0 -10
  159. package/lib/components/combo_box/combo_box.js +8 -6
  160. package/lib/components/combo_box/combo_box_input/combo_box_input.js +107 -65
  161. package/lib/components/combo_box/combo_box_input/combo_box_pill.js +8 -18
  162. package/lib/components/combo_box/combo_box_options_list/combo_box_options_list.js +6 -6
  163. package/lib/components/combo_box/utils.js +31 -0
  164. package/lib/components/context_menu/context_menu_item.js +16 -8
  165. package/lib/components/context_menu/context_menu_item.styles.js +1 -1
  166. package/lib/components/datagrid/body/data_grid_body.js +16 -6
  167. package/lib/components/datagrid/body/data_grid_body_custom.js +16 -6
  168. package/lib/components/datagrid/body/data_grid_body_virtualized.js +16 -6
  169. package/lib/components/datagrid/body/data_grid_cell.js +67 -44
  170. package/lib/components/datagrid/body/data_grid_cell_actions.js +12 -13
  171. package/lib/components/datagrid/body/data_grid_cell_popover.js +43 -10
  172. package/lib/components/datagrid/body/header/data_grid_header_cell.js +66 -35
  173. package/lib/components/datagrid/body/header/data_grid_header_row.js +16 -6
  174. package/lib/components/datagrid/controls/column_selector.js +24 -45
  175. package/lib/components/datagrid/controls/column_sorting.js +22 -37
  176. package/lib/components/datagrid/controls/data_grid_toolbar_control.js +159 -0
  177. package/lib/components/datagrid/controls/display_selector.js +21 -17
  178. package/lib/components/datagrid/controls/fullscreen_selector.js +2 -7
  179. package/lib/components/datagrid/controls/index.js +8 -1
  180. package/lib/components/datagrid/data_grid.js +2 -863
  181. package/lib/components/datagrid/index.js +8 -1
  182. package/lib/components/datagrid/utils/in_memory.js +16 -6
  183. package/lib/components/datagrid/utils/row_heights.js +1 -1
  184. package/lib/components/date_picker/auto_refresh/auto_refresh.js +6 -4
  185. package/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +91 -26
  186. package/lib/components/date_picker/super_date_picker/date_popover/date_popover_button.js +1 -1
  187. package/lib/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.js +1 -2
  188. package/lib/components/date_picker/super_date_picker/super_date_picker.js +19 -0
  189. package/lib/components/date_picker/super_date_picker/super_update_button.js +1 -1
  190. package/lib/components/error_boundary/error_boundary.a11y.js +1 -1
  191. package/lib/components/expression/expression.a11y.js +2 -4
  192. package/lib/components/facet/facet_button.js +6 -4
  193. package/lib/components/filter_group/filter_button.js +2 -2
  194. package/lib/components/filter_group/filter_group.styles.js +1 -1
  195. package/lib/components/focus_trap/focus_trap.a11y.js +3 -3
  196. package/lib/components/form/range/range.a11y.js +5 -10
  197. package/lib/components/form/super_select/super_select.js +3 -2
  198. package/lib/components/form/super_select/super_select_control.js +12 -19
  199. package/lib/components/header/header.a11y.js +1 -1
  200. package/lib/components/header/header_links/header_link.js +7 -5
  201. package/lib/components/header/header_section/header_section_item_button.js +7 -5
  202. package/lib/components/i18n/i18n.js +1 -0
  203. package/lib/components/image/image.a11y.js +1 -2
  204. package/lib/components/key_pad_menu/key_pad_menu.a11y.js +5 -5
  205. package/lib/components/link/external_link_icon.js +57 -0
  206. package/lib/components/link/link.js +6 -20
  207. package/lib/components/link/link.styles.js +1 -4
  208. package/lib/components/list_group/list_group.js +6 -1
  209. package/lib/components/list_group/list_group_item.js +14 -4
  210. package/lib/components/list_group/list_group_item.styles.js +2 -1
  211. package/lib/components/list_group/pinnable_list_group/pinnable_list_group.js +12 -2
  212. package/lib/components/notification/notification_event.a11y.js +1 -2
  213. package/lib/components/notification/notification_event.js +7 -5
  214. package/lib/components/popover/input_popover.js +1 -1
  215. package/lib/components/popover/popover.js +33 -36
  216. package/lib/components/popover/popover_arrow/_popover_arrow.styles.js +1 -3
  217. package/lib/components/popover/popover_panel/_popover_panel.js +2 -1
  218. package/lib/components/popover/popover_panel/_popover_panel.styles.js +6 -1
  219. package/lib/components/resizable_container/resizable_container.a11y.js +4 -8
  220. package/lib/components/search_bar/search_bar.a11y.js +3 -6
  221. package/lib/components/selectable/selectable.js +16 -1
  222. package/lib/components/selectable/selectable_list/selectable_list.js +227 -78
  223. package/lib/components/selectable/selectable_templates/selectable_template_sitewide.js +28 -11
  224. package/lib/components/text/text.styles.js +2 -2
  225. package/lib/components/text_truncate/text_truncate.js +32 -9
  226. package/lib/components/toast/global_toast_list.js +11 -1
  227. package/lib/global_styling/mixins/_states.js +4 -1
  228. package/lib/services/color/eui_palettes.js +1 -8
  229. package/lib/services/color/index.js +0 -7
  230. package/lib/services/hooks/useCombinedRefs.js +19 -10
  231. package/lib/services/index.js +0 -15
  232. package/lib/test/rtl/component_helpers.d.ts +2 -0
  233. package/lib/test/rtl/component_helpers.js +41 -3
  234. package/optimize/es/components/accordion/accordion.a11y.js +1 -3
  235. package/optimize/es/components/accordion/accordion.js +5 -2
  236. package/optimize/es/components/accordion/accordion_children/accordion_children.js +4 -3
  237. package/optimize/es/components/basic_table/action_types.js +5 -0
  238. package/optimize/es/components/basic_table/basic_table.a11y.js +1 -2
  239. package/optimize/es/components/basic_table/collapsed_item_actions.js +116 -169
  240. package/optimize/es/components/basic_table/custom_item_action.js +10 -83
  241. package/optimize/es/components/basic_table/default_item_action.js +23 -14
  242. package/optimize/es/components/basic_table/in_memory_table.a11y.js +13 -11
  243. package/optimize/es/components/breadcrumbs/breadcrumb.js +11 -7
  244. package/optimize/es/components/breadcrumbs/breadcrumb.styles.js +5 -0
  245. package/optimize/es/components/button/button_display/_button_display_content.js +3 -1
  246. package/optimize/es/components/button/button_empty/button_empty.js +2 -2
  247. package/optimize/es/components/button/button_group/button_group.js +7 -8
  248. package/optimize/es/components/button/button_group/button_group_button.js +6 -38
  249. package/optimize/es/components/button/button_group/button_group_button.styles.js +2 -12
  250. package/optimize/es/components/card/card.a11y.js +5 -18
  251. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +2 -2
  252. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
  253. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +12 -9
  254. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_group/collapsible_nav_group.js +8 -3
  255. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +1 -3
  256. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +10 -5
  257. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +8 -36
  258. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +1 -19
  259. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +6 -23
  260. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
  261. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +10 -10
  262. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +9 -5
  263. package/optimize/es/components/combo_box/combo_box.js +7 -5
  264. package/optimize/es/components/combo_box/combo_box_input/combo_box_input.js +107 -65
  265. package/optimize/es/components/combo_box/combo_box_input/combo_box_pill.js +8 -17
  266. package/optimize/es/components/combo_box/combo_box_options_list/combo_box_options_list.js +6 -6
  267. package/optimize/es/components/combo_box/utils.js +23 -0
  268. package/optimize/es/components/context_menu/context_menu_item.js +9 -6
  269. package/optimize/es/components/context_menu/context_menu_item.styles.js +1 -1
  270. package/optimize/es/components/datagrid/body/data_grid_cell.js +38 -30
  271. package/optimize/es/components/datagrid/body/data_grid_cell_actions.js +12 -12
  272. package/optimize/es/components/datagrid/body/data_grid_cell_popover.js +43 -10
  273. package/optimize/es/components/datagrid/body/header/data_grid_header_cell.js +50 -29
  274. package/optimize/es/components/datagrid/controls/column_selector.js +24 -45
  275. package/optimize/es/components/datagrid/controls/column_sorting.js +23 -37
  276. package/optimize/es/components/datagrid/controls/data_grid_toolbar_control.js +70 -0
  277. package/optimize/es/components/datagrid/controls/display_selector.js +21 -17
  278. package/optimize/es/components/datagrid/controls/fullscreen_selector.js +2 -6
  279. package/optimize/es/components/datagrid/controls/index.js +2 -1
  280. package/optimize/es/components/datagrid/data_grid.js +3 -3
  281. package/optimize/es/components/datagrid/index.js +1 -1
  282. package/optimize/es/components/datagrid/utils/row_heights.js +1 -1
  283. package/optimize/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +87 -26
  284. package/optimize/es/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.js +1 -2
  285. package/optimize/es/components/date_picker/super_date_picker/super_update_button.js +1 -1
  286. package/optimize/es/components/error_boundary/error_boundary.a11y.js +1 -1
  287. package/optimize/es/components/expression/expression.a11y.js +2 -4
  288. package/optimize/es/components/filter_group/filter_button.js +2 -2
  289. package/optimize/es/components/filter_group/filter_group.styles.js +1 -1
  290. package/optimize/es/components/focus_trap/focus_trap.a11y.js +3 -3
  291. package/optimize/es/components/form/range/range.a11y.js +5 -10
  292. package/optimize/es/components/form/super_select/super_select.js +3 -2
  293. package/optimize/es/components/form/super_select/super_select_control.js +13 -20
  294. package/optimize/es/components/header/header.a11y.js +1 -1
  295. package/optimize/es/components/i18n/i18n.js +1 -0
  296. package/optimize/es/components/image/image.a11y.js +1 -2
  297. package/optimize/es/components/key_pad_menu/key_pad_menu.a11y.js +5 -5
  298. package/optimize/es/components/link/external_link_icon.js +41 -0
  299. package/optimize/es/components/link/link.js +6 -20
  300. package/optimize/es/components/link/link.styles.js +2 -5
  301. package/optimize/es/components/list_group/list_group_item.js +8 -3
  302. package/optimize/es/components/list_group/list_group_item.styles.js +2 -1
  303. package/optimize/es/components/notification/notification_event.a11y.js +1 -2
  304. package/optimize/es/components/popover/input_popover.js +1 -1
  305. package/optimize/es/components/popover/popover.js +14 -23
  306. package/optimize/es/components/popover/popover_arrow/_popover_arrow.styles.js +2 -4
  307. package/optimize/es/components/popover/popover_panel/_popover_panel.js +2 -1
  308. package/optimize/es/components/popover/popover_panel/_popover_panel.styles.js +6 -1
  309. package/optimize/es/components/resizable_container/resizable_container.a11y.js +4 -8
  310. package/optimize/es/components/search_bar/search_bar.a11y.js +3 -6
  311. package/optimize/es/components/selectable/selectable_list/selectable_list.js +199 -76
  312. package/optimize/es/components/selectable/selectable_templates/selectable_template_sitewide.js +13 -11
  313. package/optimize/es/components/text/text.styles.js +2 -2
  314. package/optimize/es/components/text_truncate/text_truncate.js +26 -9
  315. package/optimize/es/components/toast/global_toast_list.js +1 -1
  316. package/optimize/es/global_styling/mixins/_states.js +4 -1
  317. package/optimize/es/services/color/eui_palettes.js +0 -6
  318. package/optimize/es/services/color/index.js +1 -1
  319. package/optimize/es/services/hooks/useCombinedRefs.js +16 -9
  320. package/optimize/es/services/index.js +1 -2
  321. package/optimize/es/test/rtl/component_helpers.d.ts +2 -0
  322. package/optimize/es/test/rtl/component_helpers.js +40 -1
  323. package/optimize/lib/components/accordion/accordion.a11y.js +1 -3
  324. package/optimize/lib/components/accordion/accordion.js +5 -2
  325. package/optimize/lib/components/accordion/accordion_children/accordion_children.js +4 -3
  326. package/optimize/lib/components/basic_table/action_types.js +8 -2
  327. package/optimize/lib/components/basic_table/basic_table.a11y.js +1 -2
  328. package/optimize/lib/components/basic_table/collapsed_item_actions.js +123 -174
  329. package/optimize/lib/components/basic_table/custom_item_action.js +17 -91
  330. package/optimize/lib/components/basic_table/default_item_action.js +23 -14
  331. package/optimize/lib/components/basic_table/in_memory_table.a11y.js +13 -11
  332. package/optimize/lib/components/breadcrumbs/breadcrumb.js +11 -7
  333. package/optimize/lib/components/breadcrumbs/breadcrumb.styles.js +5 -0
  334. package/optimize/lib/components/button/button_display/_button_display_content.js +3 -1
  335. package/optimize/lib/components/button/button_empty/button_empty.js +2 -2
  336. package/optimize/lib/components/button/button_group/button_group.js +6 -7
  337. package/optimize/lib/components/button/button_group/button_group_button.js +6 -38
  338. package/optimize/lib/components/button/button_group/button_group_button.styles.js +2 -12
  339. package/optimize/lib/components/card/card.a11y.js +5 -18
  340. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +1 -1
  341. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
  342. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +12 -9
  343. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_group/collapsible_nav_group.js +7 -2
  344. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +1 -3
  345. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +10 -5
  346. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +8 -36
  347. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +11 -28
  348. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +6 -26
  349. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
  350. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +9 -9
  351. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +9 -5
  352. package/optimize/lib/components/combo_box/combo_box.js +7 -5
  353. package/optimize/lib/components/combo_box/combo_box_input/combo_box_input.js +107 -65
  354. package/optimize/lib/components/combo_box/combo_box_input/combo_box_pill.js +8 -17
  355. package/optimize/lib/components/combo_box/combo_box_options_list/combo_box_options_list.js +6 -6
  356. package/optimize/lib/components/combo_box/utils.js +31 -0
  357. package/optimize/lib/components/context_menu/context_menu_item.js +9 -6
  358. package/optimize/lib/components/context_menu/context_menu_item.styles.js +1 -1
  359. package/optimize/lib/components/datagrid/body/data_grid_cell.js +38 -30
  360. package/optimize/lib/components/datagrid/body/data_grid_cell_actions.js +12 -12
  361. package/optimize/lib/components/datagrid/body/data_grid_cell_popover.js +43 -10
  362. package/optimize/lib/components/datagrid/body/header/data_grid_header_cell.js +56 -37
  363. package/optimize/lib/components/datagrid/controls/column_selector.js +24 -45
  364. package/optimize/lib/components/datagrid/controls/column_sorting.js +22 -36
  365. package/optimize/lib/components/datagrid/controls/data_grid_toolbar_control.js +75 -0
  366. package/optimize/lib/components/datagrid/controls/display_selector.js +21 -17
  367. package/optimize/lib/components/datagrid/controls/fullscreen_selector.js +2 -6
  368. package/optimize/lib/components/datagrid/controls/index.js +8 -1
  369. package/optimize/lib/components/datagrid/data_grid.js +2 -2
  370. package/optimize/lib/components/datagrid/index.js +8 -1
  371. package/optimize/lib/components/datagrid/utils/row_heights.js +1 -1
  372. package/optimize/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +86 -26
  373. package/optimize/lib/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.js +1 -2
  374. package/optimize/lib/components/date_picker/super_date_picker/super_update_button.js +1 -1
  375. package/optimize/lib/components/error_boundary/error_boundary.a11y.js +1 -1
  376. package/optimize/lib/components/expression/expression.a11y.js +2 -4
  377. package/optimize/lib/components/filter_group/filter_button.js +2 -2
  378. package/optimize/lib/components/filter_group/filter_group.styles.js +1 -1
  379. package/optimize/lib/components/focus_trap/focus_trap.a11y.js +3 -3
  380. package/optimize/lib/components/form/range/range.a11y.js +5 -10
  381. package/optimize/lib/components/form/super_select/super_select.js +3 -2
  382. package/optimize/lib/components/form/super_select/super_select_control.js +12 -19
  383. package/optimize/lib/components/header/header.a11y.js +1 -1
  384. package/optimize/lib/components/i18n/i18n.js +1 -0
  385. package/optimize/lib/components/image/image.a11y.js +1 -2
  386. package/optimize/lib/components/key_pad_menu/key_pad_menu.a11y.js +5 -5
  387. package/optimize/lib/components/link/external_link_icon.js +47 -0
  388. package/optimize/lib/components/link/link.js +6 -20
  389. package/optimize/lib/components/link/link.styles.js +1 -4
  390. package/optimize/lib/components/list_group/list_group_item.js +8 -3
  391. package/optimize/lib/components/list_group/list_group_item.styles.js +2 -1
  392. package/optimize/lib/components/notification/notification_event.a11y.js +1 -2
  393. package/optimize/lib/components/popover/input_popover.js +1 -1
  394. package/optimize/lib/components/popover/popover.js +28 -36
  395. package/optimize/lib/components/popover/popover_arrow/_popover_arrow.styles.js +1 -3
  396. package/optimize/lib/components/popover/popover_panel/_popover_panel.js +2 -1
  397. package/optimize/lib/components/popover/popover_panel/_popover_panel.styles.js +6 -1
  398. package/optimize/lib/components/resizable_container/resizable_container.a11y.js +4 -8
  399. package/optimize/lib/components/search_bar/search_bar.a11y.js +3 -6
  400. package/optimize/lib/components/selectable/selectable_list/selectable_list.js +199 -76
  401. package/optimize/lib/components/selectable/selectable_templates/selectable_template_sitewide.js +12 -10
  402. package/optimize/lib/components/text/text.styles.js +2 -2
  403. package/optimize/lib/components/text_truncate/text_truncate.js +25 -8
  404. package/optimize/lib/components/toast/global_toast_list.js +1 -1
  405. package/optimize/lib/global_styling/mixins/_states.js +4 -1
  406. package/optimize/lib/services/color/eui_palettes.js +1 -8
  407. package/optimize/lib/services/color/index.js +0 -7
  408. package/optimize/lib/services/hooks/useCombinedRefs.js +19 -10
  409. package/optimize/lib/services/index.js +0 -15
  410. package/optimize/lib/test/rtl/component_helpers.d.ts +2 -0
  411. package/optimize/lib/test/rtl/component_helpers.js +41 -3
  412. package/package.json +13 -13
  413. package/src/components/combo_box/_combo_box.scss +46 -14
  414. package/src/components/combo_box/combo_box_input/_combo_box_pill.scss +0 -17
  415. package/src/components/combo_box/combo_box_input/_index.scss +0 -2
  416. package/src/components/datagrid/_data_grid_data_row.scss +139 -101
  417. package/src/components/datagrid/_mixins.scss +2 -2
  418. package/src/components/datagrid/body/header/_data_grid_header_row.scss +36 -28
  419. package/src/components/datagrid/controls/_data_grid_toolbar.scss +0 -5
  420. package/src/components/date_picker/super_date_picker/date_popover/_absolute_tab.scss +21 -0
  421. package/src/components/date_picker/super_date_picker/quick_select_popover/_quick_select_popover.scss +0 -4
  422. package/src/components/form/form_control_layout/_form_control_layout.scss +0 -1
  423. package/src/components/form/form_row/_form_row.scss +1 -1
  424. package/src/components/table/_responsive.scss +19 -0
  425. package/src/components/table/_table.scss +4 -9
  426. package/src/global_styling/variables/_typography.scss +2 -2
  427. package/test-env/components/accordion/accordion.a11y.js +1 -3
  428. package/test-env/components/accordion/accordion.js +13 -2
  429. package/test-env/components/accordion/accordion_children/accordion_children.js +4 -3
  430. package/test-env/components/auto_sizer/auto_sizer.js +10 -3
  431. package/test-env/components/basic_table/action_types.js +8 -2
  432. package/test-env/components/basic_table/basic_table.a11y.js +1 -2
  433. package/test-env/components/basic_table/basic_table.js +8 -8
  434. package/test-env/components/basic_table/collapsed_item_actions.js +124 -251
  435. package/test-env/components/basic_table/custom_item_action.js +18 -100
  436. package/test-env/components/basic_table/default_item_action.js +23 -14
  437. package/test-env/components/basic_table/in_memory_table.a11y.js +13 -11
  438. package/test-env/components/basic_table/in_memory_table.js +8 -8
  439. package/test-env/components/breadcrumbs/breadcrumb.js +16 -12
  440. package/test-env/components/breadcrumbs/breadcrumb.styles.js +5 -0
  441. package/test-env/components/button/button_display/_button_display.js +6 -4
  442. package/test-env/components/button/button_display/_button_display_content.js +8 -4
  443. package/test-env/components/button/button_empty/button_empty.js +9 -7
  444. package/test-env/components/button/button_group/button_group.js +12 -12
  445. package/test-env/components/button/button_group/button_group_button.js +13 -54
  446. package/test-env/components/button/button_group/button_group_button.styles.js +2 -12
  447. package/test-env/components/card/card.a11y.js +5 -18
  448. package/test-env/components/collapsible_nav/collapsible_nav_group/collapsible_nav_group.js +8 -0
  449. package/test-env/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +1 -1
  450. package/test-env/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
  451. package/test-env/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +12 -9
  452. package/test-env/components/collapsible_nav_beta/collapsible_nav_group/collapsible_nav_group.js +8 -103
  453. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +20 -58
  454. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +89 -37
  455. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +66 -80
  456. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +11 -28
  457. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +7 -105
  458. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
  459. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +10 -89
  460. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +150 -130
  461. package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_link.js +0 -10
  462. package/test-env/components/combo_box/combo_box.js +8 -6
  463. package/test-env/components/combo_box/combo_box_input/combo_box_input.js +107 -65
  464. package/test-env/components/combo_box/combo_box_input/combo_box_pill.js +8 -18
  465. package/test-env/components/combo_box/combo_box_options_list/combo_box_options_list.js +6 -6
  466. package/test-env/components/combo_box/utils.js +31 -0
  467. package/test-env/components/context_menu/context_menu_item.js +16 -8
  468. package/test-env/components/context_menu/context_menu_item.styles.js +1 -1
  469. package/test-env/components/datagrid/body/data_grid_body.js +16 -6
  470. package/test-env/components/datagrid/body/data_grid_body_custom.js +16 -6
  471. package/test-env/components/datagrid/body/data_grid_body_virtualized.js +16 -6
  472. package/test-env/components/datagrid/body/data_grid_cell.js +67 -44
  473. package/test-env/components/datagrid/body/data_grid_cell_actions.js +12 -12
  474. package/test-env/components/datagrid/body/data_grid_cell_popover.js +43 -10
  475. package/test-env/components/datagrid/body/header/data_grid_header_cell.js +72 -43
  476. package/test-env/components/datagrid/body/header/data_grid_header_row.js +16 -6
  477. package/test-env/components/datagrid/controls/column_selector.js +24 -45
  478. package/test-env/components/datagrid/controls/column_sorting.js +22 -36
  479. package/test-env/components/datagrid/controls/data_grid_toolbar_control.js +158 -0
  480. package/test-env/components/datagrid/controls/display_selector.js +21 -17
  481. package/test-env/components/datagrid/controls/fullscreen_selector.js +2 -6
  482. package/test-env/components/datagrid/controls/index.js +8 -1
  483. package/test-env/components/datagrid/data_grid.js +2 -863
  484. package/test-env/components/datagrid/index.js +8 -1
  485. package/test-env/components/datagrid/utils/in_memory.js +16 -6
  486. package/test-env/components/datagrid/utils/row_heights.js +1 -1
  487. package/test-env/components/date_picker/auto_refresh/auto_refresh.js +6 -4
  488. package/test-env/components/date_picker/super_date_picker/date_popover/absolute_tab.js +86 -26
  489. package/test-env/components/date_picker/super_date_picker/date_popover/date_popover_button.js +1 -1
  490. package/test-env/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.js +1 -2
  491. package/test-env/components/date_picker/super_date_picker/super_date_picker.js +19 -0
  492. package/test-env/components/date_picker/super_date_picker/super_update_button.js +1 -1
  493. package/test-env/components/error_boundary/error_boundary.a11y.js +1 -1
  494. package/test-env/components/expression/expression.a11y.js +2 -4
  495. package/test-env/components/facet/facet_button.js +6 -4
  496. package/test-env/components/filter_group/filter_button.js +2 -2
  497. package/test-env/components/filter_group/filter_group.styles.js +1 -1
  498. package/test-env/components/focus_trap/focus_trap.a11y.js +3 -3
  499. package/test-env/components/form/range/range.a11y.js +5 -10
  500. package/test-env/components/form/super_select/super_select.js +3 -2
  501. package/test-env/components/form/super_select/super_select_control.js +12 -19
  502. package/test-env/components/header/header.a11y.js +1 -1
  503. package/test-env/components/header/header_links/header_link.js +7 -5
  504. package/test-env/components/header/header_section/header_section_item_button.js +7 -5
  505. package/test-env/components/i18n/i18n.js +1 -0
  506. package/test-env/components/image/image.a11y.js +1 -2
  507. package/test-env/components/key_pad_menu/key_pad_menu.a11y.js +5 -5
  508. package/test-env/components/link/external_link_icon.js +56 -0
  509. package/test-env/components/link/link.js +6 -20
  510. package/test-env/components/link/link.styles.js +1 -4
  511. package/test-env/components/list_group/list_group.js +6 -1
  512. package/test-env/components/list_group/list_group_item.js +14 -4
  513. package/test-env/components/list_group/list_group_item.styles.js +2 -1
  514. package/test-env/components/list_group/pinnable_list_group/pinnable_list_group.js +12 -2
  515. package/test-env/components/notification/notification_event.a11y.js +1 -2
  516. package/test-env/components/notification/notification_event.js +7 -5
  517. package/test-env/components/popover/input_popover.js +1 -1
  518. package/test-env/components/popover/popover.js +33 -36
  519. package/test-env/components/popover/popover_arrow/_popover_arrow.styles.js +1 -3
  520. package/test-env/components/popover/popover_panel/_popover_panel.js +2 -1
  521. package/test-env/components/popover/popover_panel/_popover_panel.styles.js +6 -1
  522. package/test-env/components/resizable_container/resizable_container.a11y.js +4 -8
  523. package/test-env/components/search_bar/search_bar.a11y.js +3 -6
  524. package/test-env/components/selectable/selectable.js +16 -1
  525. package/test-env/components/selectable/selectable_list/selectable_list.js +227 -78
  526. package/test-env/components/selectable/selectable_templates/selectable_template_sitewide.js +28 -11
  527. package/test-env/components/text/text.styles.js +2 -2
  528. package/test-env/components/text_truncate/text_truncate.js +32 -9
  529. package/test-env/components/toast/global_toast_list.js +11 -1
  530. package/test-env/global_styling/mixins/_states.js +4 -1
  531. package/test-env/services/color/eui_palettes.js +1 -8
  532. package/test-env/services/color/index.js +0 -7
  533. package/test-env/services/hooks/useCombinedRefs.js +19 -10
  534. package/test-env/services/index.js +0 -15
  535. package/test-env/test/rtl/component_helpers.js +41 -3
  536. package/es/services/random.js +0 -94
  537. package/es/services/utils.js +0 -25
  538. package/es/test/patch_random.js +0 -18
  539. package/lib/services/random.js +0 -100
  540. package/lib/services/utils.js +0 -35
  541. package/lib/test/patch_random.js +0 -25
  542. package/optimize/es/services/random.js +0 -85
  543. package/optimize/es/services/utils.js +0 -25
  544. package/optimize/es/test/patch_random.js +0 -18
  545. package/optimize/lib/services/random.js +0 -91
  546. package/optimize/lib/services/utils.js +0 -35
  547. package/optimize/lib/test/patch_random.js +0 -25
  548. package/src/components/combo_box/combo_box_input/_combo_box_input.scss +0 -12
  549. package/src/components/combo_box/combo_box_input/_combo_box_placeholder.scss +0 -11
  550. package/test-env/services/random.js +0 -91
  551. package/test-env/services/utils.js +0 -35
  552. package/test-env/test/patch_random.js +0 -25
@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
8
  exports.EuiComboBoxInput = void 0;
9
+ var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
9
10
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
11
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
11
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
12
12
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
13
13
  var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
14
14
  var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
@@ -23,6 +23,7 @@ var _services = require("../../../services");
23
23
  var _accessibility = require("../../accessibility");
24
24
  var _form_control_layout = require("../../form/form_control_layout");
25
25
  var _num_icons = require("../../form/form_control_layout/_num_icons");
26
+ var _utils = require("../utils");
26
27
  var _combo_box_pill = require("./combo_box_pill");
27
28
  var _react2 = require("@emotion/react");
28
29
  var _excluded = ["key", "label", "color", "onClick", "append", "prepend", "truncationProps"];
@@ -60,6 +61,7 @@ var EuiComboBoxInput = /*#__PURE__*/function (_Component) {
60
61
  });
61
62
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "updateInputSize", function (inputValue) {
62
63
  if (!_this.widthUtils) return;
64
+ if (_this.asPlainText) return;
63
65
  _this.widthUtils.setTextToCheck(inputValue);
64
66
  // Canvas has minute subpixel differences in rendering compared to DOM
65
67
  // We'll buffer the input by ~2px just to ensure sufficient width
@@ -85,65 +87,42 @@ var EuiComboBoxInput = /*#__PURE__*/function (_Component) {
85
87
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onKeyDown", function (event) {
86
88
  var _this$props2 = _this.props,
87
89
  searchValue = _this$props2.searchValue,
90
+ hasSelectedOptions = _this$props2.hasSelectedOptions,
88
91
  selectedOptions = _this$props2.selectedOptions,
89
92
  onRemoveOption = _this$props2.onRemoveOption,
90
93
  singleSelection = _this$props2.singleSelection,
91
94
  isListOpen = _this$props2.isListOpen,
92
- onOpenListClick = _this$props2.onOpenListClick;
93
-
94
- // When backspacing from an empty input, delete the last pill option in the list
95
+ onOpenListClick = _this$props2.onOpenListClick,
96
+ onChange = _this$props2.onChange;
95
97
  var searchIsEmpty = !searchValue.length;
96
- var hasPills = selectedOptions.length;
97
- if (event.key === _services.keys.BACKSPACE && searchIsEmpty && hasPills) {
98
- onRemoveOption(selectedOptions[selectedOptions.length - 1]);
99
- if (!!singleSelection && !isListOpen) {
100
- onOpenListClick();
98
+ if (event.key === _services.keys.BACKSPACE) {
99
+ // When backspacing in a plain text combobox, change normally and remove the selection
100
+ if (_this.asPlainText) {
101
+ onChange(event.currentTarget.value);
102
+ if (hasSelectedOptions) {
103
+ onRemoveOption(selectedOptions[selectedOptions.length - 1]);
104
+ }
105
+ }
106
+ // When backspacing from an empty input, delete the last pill option in the list
107
+ else if (searchIsEmpty && hasSelectedOptions) {
108
+ onRemoveOption(selectedOptions[selectedOptions.length - 1]);
109
+ if (!!singleSelection && !isListOpen) {
110
+ onOpenListClick();
111
+ }
101
112
  }
102
113
  }
103
114
  });
104
- return _this;
105
- }
106
- (0, _createClass2.default)(EuiComboBoxInput, [{
107
- key: "componentDidUpdate",
108
- value: function componentDidUpdate(prevProps) {
109
- if (prevProps.searchValue !== this.props.searchValue) {
110
- this.updateInputSize(this.props.searchValue);
111
- }
112
- }
113
- }, {
114
- key: "render",
115
- value: function render() {
116
- var _this$props3 = this.props,
117
- compressed = _this$props3.compressed,
118
- focusedOptionId = _this$props3.focusedOptionId,
119
- fullWidth = _this$props3.fullWidth,
120
- hasSelectedOptions = _this$props3.hasSelectedOptions,
121
- id = _this$props3.id,
122
- isDisabled = _this$props3.isDisabled,
123
- isListOpen = _this$props3.isListOpen,
124
- noIcon = _this$props3.noIcon,
125
- _onChange = _this$props3.onChange,
126
- onClear = _this$props3.onClear,
127
- onClick = _this$props3.onClick,
128
- onCloseListClick = _this$props3.onCloseListClick,
129
- onOpenListClick = _this$props3.onOpenListClick,
130
- onRemoveOption = _this$props3.onRemoveOption,
131
- placeholder = _this$props3.placeholder,
132
- rootId = _this$props3.rootId,
133
- searchValue = _this$props3.searchValue,
115
+ (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderPills", function () {
116
+ // Don't render a pill for plain text comboboxes - use the input instead
117
+ if (_this.asPlainText) return null;
118
+ // Don't render the single pill selection while searching
119
+ if (_this.props.singleSelection && _this.props.searchValue) return null;
120
+ var _this$props3 = _this.props,
134
121
  selectedOptions = _this$props3.selectedOptions,
135
- singleSelectionProp = _this$props3.singleSelection,
136
- value = _this$props3.value,
137
- prepend = _this$props3.prepend,
138
- append = _this$props3.append,
139
- isLoading = _this$props3.isLoading,
140
- isInvalid = _this$props3.isInvalid,
141
- autoFocus = _this$props3.autoFocus,
142
- ariaLabel = _this$props3['aria-label'],
143
- ariaLabelledby = _this$props3['aria-labelledby'];
144
- var singleSelection = Boolean(singleSelectionProp);
145
- var asPlainText = singleSelectionProp && (0, _typeof2.default)(singleSelectionProp) === 'object' && singleSelectionProp.asPlainText || false;
146
- var pills = selectedOptions ? selectedOptions.map(function (option) {
122
+ isDisabled = _this$props3.isDisabled,
123
+ onRemoveOption = _this$props3.onRemoveOption;
124
+ if (!selectedOptions || !selectedOptions.length) return null;
125
+ return selectedOptions.map(function (option) {
147
126
  var key = option.key,
148
127
  label = option.label,
149
128
  color = option.color,
@@ -152,17 +131,77 @@ var EuiComboBoxInput = /*#__PURE__*/function (_Component) {
152
131
  prepend = option.prepend,
153
132
  truncationProps = option.truncationProps,
154
133
  rest = (0, _objectWithoutProperties2.default)(option, _excluded);
155
- var pillOnClose = isDisabled || singleSelection || onClick ? undefined : onRemoveOption;
134
+ var pillOnClose = isDisabled || _this.props.singleSelection || onClick ? undefined : onRemoveOption;
156
135
  return (0, _react2.jsx)(_combo_box_pill.EuiComboBoxPill, (0, _extends2.default)({
157
136
  option: option,
158
137
  onClose: pillOnClose,
159
138
  key: key !== null && key !== void 0 ? key : label.toLowerCase(),
160
139
  color: color,
161
140
  onClick: onClick,
162
- onClickAriaLabel: onClick ? 'Change' : undefined,
163
- asPlainText: asPlainText
141
+ onClickAriaLabel: onClick ? 'Change' : undefined
164
142
  }, rest), label);
165
- }) : null;
143
+ });
144
+ });
145
+ return _this;
146
+ }
147
+ (0, _createClass2.default)(EuiComboBoxInput, [{
148
+ key: "componentDidUpdate",
149
+ value: function componentDidUpdate(prevProps) {
150
+ if (prevProps.searchValue !== this.props.searchValue) {
151
+ this.updateInputSize(this.props.searchValue);
152
+ }
153
+ }
154
+ }, {
155
+ key: "asPlainText",
156
+ get: function get() {
157
+ var singleSelection = this.props.singleSelection;
158
+ var isSingleSelectionConfig = singleSelection && (0, _typeof2.default)(singleSelection) === 'object';
159
+ return !!(isSingleSelectionConfig && singleSelection.asPlainText);
160
+ }
161
+ }, {
162
+ key: "searchValue",
163
+ get: function get() {
164
+ var _this$props4 = this.props,
165
+ searchValue = _this$props4.searchValue,
166
+ selectedOptions = _this$props4.selectedOptions;
167
+ if (this.asPlainText) {
168
+ var _selectedOptions$;
169
+ return searchValue || (selectedOptions === null || selectedOptions === void 0 ? void 0 : (_selectedOptions$ = selectedOptions[0]) === null || _selectedOptions$ === void 0 ? void 0 : _selectedOptions$.label) || '';
170
+ } else {
171
+ return searchValue;
172
+ }
173
+ }
174
+ }, {
175
+ key: "render",
176
+ value: function render() {
177
+ var _this$props5 = this.props,
178
+ compressed = _this$props5.compressed,
179
+ focusedOptionId = _this$props5.focusedOptionId,
180
+ fullWidth = _this$props5.fullWidth,
181
+ hasSelectedOptions = _this$props5.hasSelectedOptions,
182
+ id = _this$props5.id,
183
+ isDisabled = _this$props5.isDisabled,
184
+ isListOpen = _this$props5.isListOpen,
185
+ noIcon = _this$props5.noIcon,
186
+ _onChange = _this$props5.onChange,
187
+ onClear = _this$props5.onClear,
188
+ onClick = _this$props5.onClick,
189
+ onFocus = _this$props5.onFocus,
190
+ onCloseListClick = _this$props5.onCloseListClick,
191
+ onOpenListClick = _this$props5.onOpenListClick,
192
+ placeholder = _this$props5.placeholder,
193
+ rootId = _this$props5.rootId,
194
+ searchValue = _this$props5.searchValue,
195
+ selectedOptions = _this$props5.selectedOptions,
196
+ singleSelection = _this$props5.singleSelection,
197
+ value = _this$props5.value,
198
+ prepend = _this$props5.prepend,
199
+ append = _this$props5.append,
200
+ isLoading = _this$props5.isLoading,
201
+ isInvalid = _this$props5.isInvalid,
202
+ autoFocus = _this$props5.autoFocus,
203
+ ariaLabel = _this$props5['aria-label'],
204
+ ariaLabelledby = _this$props5['aria-labelledby'];
166
205
  var removeOptionMessage;
167
206
  var removeOptionMessageId;
168
207
  if (this.state.hasFocus) {
@@ -179,12 +218,7 @@ var EuiComboBoxInput = /*#__PURE__*/function (_Component) {
179
218
  id: removeOptionMessageId
180
219
  }, removeOptionMessageContent));
181
220
  }
182
- var placeholderMessage;
183
- if (placeholder && selectedOptions && !selectedOptions.length && !searchValue) {
184
- placeholderMessage = (0, _react2.jsx)("p", {
185
- className: "euiComboBoxPlaceholder"
186
- }, placeholder);
187
- }
221
+ var showPlaceholder = placeholder && !(selectedOptions !== null && selectedOptions !== void 0 && selectedOptions.length) && !searchValue;
188
222
  var clickProps = {};
189
223
  if (!isDisabled && onClear && hasSelectedOptions) {
190
224
  clickProps.clear = {
@@ -214,6 +248,7 @@ var EuiComboBoxInput = /*#__PURE__*/function (_Component) {
214
248
  'euiComboBox__inputWrap--compressed': compressed,
215
249
  'euiComboBox__inputWrap--fullWidth': fullWidth,
216
250
  'euiComboBox__inputWrap--noWrap': singleSelection,
251
+ 'euiComboBox__inputWrap--plainText': this.asPlainText || showPlaceholder,
217
252
  'euiComboBox__inputWrap--inGroup': prepend || append
218
253
  });
219
254
  return (0, _react2.jsx)(_form_control_layout.EuiFormControlLayout, (0, _extends2.default)({
@@ -231,7 +266,10 @@ var EuiComboBoxInput = /*#__PURE__*/function (_Component) {
231
266
  "data-test-subj": "comboBoxInput",
232
267
  onClick: onClick,
233
268
  tabIndex: -1 // becomes onBlur event's relatedTarget, otherwise relatedTarget is null when clicking on this div
234
- }, !singleSelection || !searchValue ? pills : null, placeholderMessage, (0, _react2.jsx)("input", {
269
+ }, this.renderPills(), (0, _react2.jsx)(_utils.EuiComboBoxOptionAppendPrepend, {
270
+ option: this.asPlainText ? selectedOptions === null || selectedOptions === void 0 ? void 0 : selectedOptions[0] : undefined,
271
+ classNamePrefix: "euiComboBoxPlainTextSelection"
272
+ }, (0, _react2.jsx)("input", {
235
273
  "aria-activedescendant": focusedOptionId,
236
274
  "aria-autocomplete": "list",
237
275
  "aria-controls": isListOpen ? rootId('listbox') : '',
@@ -252,11 +290,15 @@ var EuiComboBoxInput = /*#__PURE__*/function (_Component) {
252
290
  ref: this.inputRefCallback,
253
291
  role: "combobox",
254
292
  style: {
255
- inlineSize: this.state.inputWidth
293
+ inlineSize: this.asPlainText || showPlaceholder ? '100%' : this.state.inputWidth
256
294
  },
257
- value: searchValue,
295
+ placeholder: showPlaceholder ? placeholder : undefined,
296
+ value: this.searchValue,
258
297
  autoFocus: autoFocus
259
- }), removeOptionMessage));
298
+ // Force the menu to re-open on every input click - only necessary when plain text
299
+ ,
300
+ onClick: this.asPlainText ? onFocus : undefined // Type shenanigans - event should be mostly the same
301
+ })), removeOptionMessage));
260
302
  }
261
303
  }]);
262
304
  return EuiComboBoxInput;
@@ -20,8 +20,9 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
20
20
  var _classnames = _interopRequireDefault(require("classnames"));
21
21
  var _badge = require("../../badge");
22
22
  var _i18n = require("../../i18n");
23
+ var _utils = require("../utils");
23
24
  var _react2 = require("@emotion/react");
24
- var _excluded = ["asPlainText", "children", "className", "color", "onClick", "onClickAriaLabel", "onClose", "option"];
25
+ var _excluded = ["children", "className", "color", "onClick", "onClickAriaLabel", "onClose", "option"];
25
26
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
26
27
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
27
28
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
@@ -57,7 +58,6 @@ var EuiComboBoxPill = /*#__PURE__*/function (_Component) {
57
58
  value: function render() {
58
59
  var _this2 = this;
59
60
  var _this$props2 = this.props,
60
- asPlainText = _this$props2.asPlainText,
61
61
  children = _this$props2.children,
62
62
  className = _this$props2.className,
63
63
  color = _this$props2.color,
@@ -66,20 +66,17 @@ var EuiComboBoxPill = /*#__PURE__*/function (_Component) {
66
66
  onClose = _this$props2.onClose,
67
67
  option = _this$props2.option,
68
68
  rest = (0, _objectWithoutProperties2.default)(_this$props2, _excluded);
69
- var classes = (0, _classnames.default)('euiComboBoxPill', {
70
- 'euiComboBoxPill--plainText': asPlainText
71
- }, className);
69
+ var classes = (0, _classnames.default)('euiComboBoxPill', className);
72
70
  var onClickProps = onClick && onClickAriaLabel ? {
73
71
  onClick: onClick,
74
72
  onClickAriaLabel: onClickAriaLabel
75
73
  } : {};
76
- var content = (0, _react2.jsx)(_react.default.Fragment, null, option.prepend && (0, _react2.jsx)("span", {
77
- className: "euiComboBoxPill__prepend"
78
- }, option.prepend), (0, _react2.jsx)("span", {
74
+ var content = (0, _react2.jsx)(_utils.EuiComboBoxOptionAppendPrepend, {
75
+ option: option,
76
+ classNamePrefix: "euiComboBoxPill"
77
+ }, (0, _react2.jsx)("span", {
79
78
  className: "eui-textTruncate"
80
- }, children), option.append && (0, _react2.jsx)("span", {
81
- className: "euiComboBoxPill__append"
82
- }, option.append));
79
+ }, children));
83
80
  if (onClose) {
84
81
  return (0, _react2.jsx)(_i18n.EuiI18n, {
85
82
  token: "euiComboBoxPill.removeSelection",
@@ -100,12 +97,6 @@ var EuiComboBoxPill = /*#__PURE__*/function (_Component) {
100
97
  }, onClickProps, rest), content);
101
98
  });
102
99
  }
103
- if (asPlainText) {
104
- return (0, _react2.jsx)("span", (0, _extends2.default)({
105
- className: classes,
106
- "data-test-subj": "euiComboBoxPill"
107
- }, rest), content);
108
- }
109
100
  return (0, _react2.jsx)(_badge.EuiBadge, (0, _extends2.default)({
110
101
  className: classes,
111
102
  color: color,
@@ -121,7 +112,6 @@ exports.EuiComboBoxPill = EuiComboBoxPill;
121
112
  color: 'hollow'
122
113
  });
123
114
  EuiComboBoxPill.propTypes = {
124
- asPlainText: _propTypes.default.bool,
125
115
  children: _propTypes.default.string,
126
116
  className: _propTypes.default.string,
127
117
  color: _propTypes.default.string,
@@ -30,6 +30,7 @@ var _filter_select_item = require("../../filter_group/filter_select_item");
30
30
  var _badge = require("../../badge");
31
31
  var _text_truncate = require("../../text_truncate");
32
32
  var _input_popover = require("../../popover/input_popover");
33
+ var _utils = require("../utils");
33
34
  var _react2 = require("@emotion/react");
34
35
  var _excluded = ["children"],
35
36
  _excluded2 = ["key", "isGroupLabelOption", "label", "value", "prepend", "append", "truncationProps"],
@@ -128,13 +129,12 @@ var EuiComboBoxOptionsList = /*#__PURE__*/function (_Component) {
128
129
  title: label
129
130
  }, rest), (0, _react2.jsx)("span", {
130
131
  className: "euiComboBoxOption__contentWrapper"
131
- }, prepend && (0, _react2.jsx)("span", {
132
- className: "euiComboBoxOption__prepend"
133
- }, prepend), (0, _react2.jsx)("span", {
132
+ }, (0, _react2.jsx)(_utils.EuiComboBoxOptionAppendPrepend, {
133
+ option: option,
134
+ classNamePrefix: "euiComboBoxOption"
135
+ }, (0, _react2.jsx)("span", {
134
136
  className: "euiComboBoxOption__content"
135
- }, renderOption ? renderOption(option, searchValue, 'euiComboBoxOption__renderOption') : _this.renderTruncatedOption(label, truncationProps)), append && (0, _react2.jsx)("span", {
136
- className: "euiComboBoxOption__append"
137
- }, append), optionIsFocused && !optionIsDisabled ? hitEnterBadge : null));
137
+ }, renderOption ? renderOption(option, searchValue, 'euiComboBoxOption__renderOption') : _this.renderTruncatedOption(label, truncationProps))), optionIsFocused && !optionIsDisabled ? hitEnterBadge : null));
138
138
  });
139
139
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "optionWidth", void 0);
140
140
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setOptionWidth", function (width) {
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.EuiComboBoxOptionAppendPrepend = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _react2 = require("@emotion/react");
10
+ /*
11
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
12
+ * or more contributor license agreements. Licensed under the Elastic License
13
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
14
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
15
+ * Side Public License, v 1.
16
+ */
17
+
18
+ /**
19
+ * DRY util for rendering an option with its prepend and append properties
20
+ */
21
+ var EuiComboBoxOptionAppendPrepend = function EuiComboBoxOptionAppendPrepend(_ref) {
22
+ var children = _ref.children,
23
+ option = _ref.option,
24
+ classNamePrefix = _ref.classNamePrefix;
25
+ return (0, _react2.jsx)(_react.default.Fragment, null, (option === null || option === void 0 ? void 0 : option.prepend) && (0, _react2.jsx)("span", {
26
+ className: "".concat(classNamePrefix, "__prepend")
27
+ }, option.prepend), children, (option === null || option === void 0 ? void 0 : option.append) && (0, _react2.jsx)("span", {
28
+ className: "".concat(classNamePrefix, "__append")
29
+ }, option.append));
30
+ };
31
+ exports.EuiComboBoxOptionAppendPrepend = EuiComboBoxOptionAppendPrepend;
@@ -17,7 +17,7 @@ var _icon = require("../icon");
17
17
  var _tool_tip = require("../tool_tip");
18
18
  var _context_menu_item = require("./context_menu_item.styles");
19
19
  var _react2 = require("@emotion/react");
20
- var _excluded = ["children", "className", "hasPanel", "icon", "buttonRef", "disabled", "layoutAlign", "toolTipTitle", "toolTipContent", "toolTipPosition", "href", "target", "rel", "size"];
20
+ var _excluded = ["children", "className", "hasPanel", "icon", "buttonRef", "disabled", "layoutAlign", "toolTipTitle", "toolTipContent", "toolTipPosition", "toolTipProps", "href", "target", "rel", "size"];
21
21
  /*
22
22
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
23
23
  * or more contributor license agreements. Licensed under the Elastic License
@@ -47,6 +47,7 @@ var EuiContextMenuItem = function EuiContextMenuItem(_ref) {
47
47
  toolTipContent = _ref.toolTipContent,
48
48
  _ref$toolTipPosition = _ref.toolTipPosition,
49
49
  toolTipPosition = _ref$toolTipPosition === void 0 ? 'right' : _ref$toolTipPosition,
50
+ toolTipProps = _ref.toolTipProps,
50
51
  href = _ref.href,
51
52
  target = _ref.target,
52
53
  rel = _ref.rel,
@@ -98,7 +99,7 @@ var EuiContextMenuItem = function EuiContextMenuItem(_ref) {
98
99
  rel: secureRel,
99
100
  ref: buttonRef
100
101
  }, rest), buttonContent);
101
- } else if (href || rest.onClick) {
102
+ } else if (href || rest.onClick || toolTipContent) {
102
103
  button = (0, _react2.jsx)("button", (0, _extends2.default)({
103
104
  disabled: disabled,
104
105
  css: cssStyles,
@@ -114,12 +115,14 @@ var EuiContextMenuItem = function EuiContextMenuItem(_ref) {
114
115
  }, rest), buttonContent);
115
116
  }
116
117
  if (toolTipContent) {
117
- return (0, _react2.jsx)(_tool_tip.EuiToolTip, {
118
+ var anchorClasses = (0, _classnames.default)('eui-displayBlock', toolTipProps === null || toolTipProps === void 0 ? void 0 : toolTipProps.anchorClassName);
119
+ return (0, _react2.jsx)(_tool_tip.EuiToolTip, (0, _extends2.default)({
118
120
  title: toolTipTitle ? toolTipTitle : null,
119
- content: toolTipContent,
120
- anchorClassName: "eui-displayBlock",
121
121
  position: toolTipPosition
122
- }, button);
122
+ }, toolTipProps, {
123
+ anchorClassName: anchorClasses,
124
+ content: toolTipContent
125
+ }), button);
123
126
  } else {
124
127
  return button;
125
128
  }
@@ -140,11 +143,16 @@ EuiContextMenuItem.propTypes = {
140
143
  */
141
144
  toolTipContent: _propTypes.default.node,
142
145
  /**
143
- * Optional title for the tooltip
146
+ * Optional configuration to pass to the underlying [EuiToolTip](/#/display/tooltip).
147
+ * Accepts any prop that EuiToolTip does, except for `content` and `children`.
148
+ */
149
+ toolTipProps: _propTypes.default.any,
150
+ /**
151
+ * @deprecated Use toolTipProps.title instead
144
152
  */
145
153
  toolTipTitle: _propTypes.default.node,
146
154
  /**
147
- * Dictates the position of the tooltip.
155
+ * @deprecated Use tooltipProps.position instead
148
156
  */
149
157
  toolTipPosition: _propTypes.default.oneOf(["top", "right", "bottom", "left"]),
150
158
  href: _propTypes.default.string,
@@ -64,7 +64,7 @@ var _ref6 = process.env.NODE_ENV === "production" ? {
64
64
  var euiContextMenuItemStyles = function euiContextMenuItemStyles(euiThemeContext) {
65
65
  var euiTheme = euiThemeContext.euiTheme;
66
66
  return {
67
- euiContextMenuItem: /*#__PURE__*/(0, _react.css)("display:flex;gap:", euiTheme.size.s, ";", (0, _global_styling.logicalCSS)('width', '100%'), " ", (0, _global_styling.logicalTextAlignCSS)('left'), " color:", euiTheme.colors.text, ";outline-offset:-", euiTheme.focus.width, ";&:enabled:hover,&:enabled:focus{text-decoration:underline;}&:enabled:focus{background-color:", euiTheme.focus.backgroundColor, ";};label:euiContextMenuItem;"),
67
+ euiContextMenuItem: /*#__PURE__*/(0, _react.css)("display:flex;gap:", euiTheme.size.s, ";", (0, _global_styling.logicalCSS)('width', '100%'), " ", (0, _global_styling.logicalTextAlignCSS)('left'), " color:", euiTheme.colors.text, ";outline-offset:-", euiTheme.focus.width, ";&:not(:disabled){&:hover,&:focus{text-decoration:underline;}&:focus{background-color:", euiTheme.focus.backgroundColor, ";}};label:euiContextMenuItem;"),
68
68
  disabled: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.disabledText, ";cursor:default;;label:disabled;"),
69
69
  layoutAlign: {
70
70
  center: _ref6,