@elastic/eui 109.2.0 → 110.0.0-snapshot.1764783610243

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 (332) hide show
  1. package/es/components/basic_table/in_memory_table.js +87 -61
  2. package/es/components/collapsible_nav/collapsible_nav.js +20 -101
  3. package/es/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
  4. package/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  5. package/es/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  6. package/es/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  7. package/es/components/date_picker/super_date_picker/quick_select_popover/index.js +1 -0
  8. package/es/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  9. package/es/components/filter_group/filter_group.a11y.js +1 -1
  10. package/es/components/flyout/_flyout_overlay.js +52 -0
  11. package/es/components/flyout/_flyout_resize_button.js +32 -0
  12. package/es/components/flyout/{flyout_resizable.styles.js → _flyout_resize_button.styles.js} +11 -11
  13. package/es/components/flyout/const.js +42 -0
  14. package/es/components/flyout/flyout.component.js +481 -0
  15. package/es/components/flyout/flyout.js +77 -379
  16. package/es/components/flyout/flyout.styles.js +105 -7
  17. package/es/components/flyout/flyout_menu.js +241 -0
  18. package/es/components/flyout/flyout_menu.styles.js +19 -0
  19. package/{optimize/es/components/flyout/flyout_context.js → es/components/flyout/flyout_menu_context.js} +1 -7
  20. package/es/components/flyout/flyout_parent_context.js +36 -0
  21. package/es/components/flyout/flyout_resizable.js +33 -144
  22. package/es/components/flyout/hooks.js +25 -0
  23. package/es/components/flyout/index.js +5 -2
  24. package/es/components/flyout/manager/actions.js +153 -0
  25. package/es/components/flyout/manager/activity_stage.js +95 -0
  26. package/es/components/flyout/manager/const.js +56 -0
  27. package/es/components/flyout/manager/context.js +33 -0
  28. package/es/components/flyout/manager/flyout_child.js +75 -0
  29. package/es/components/flyout/manager/flyout_main.js +65 -0
  30. package/es/components/flyout/manager/flyout_main.styles.js +25 -0
  31. package/es/components/flyout/manager/flyout_managed.js +227 -0
  32. package/es/components/flyout/manager/flyout_managed.styles.js +69 -0
  33. package/es/components/flyout/manager/hooks.js +55 -0
  34. package/es/components/flyout/manager/index.js +31 -0
  35. package/es/components/flyout/manager/layout_mode.js +167 -0
  36. package/es/components/flyout/manager/provider.js +57 -0
  37. package/es/components/flyout/manager/reducer.js +320 -0
  38. package/es/components/flyout/manager/selectors.js +116 -0
  39. package/es/components/flyout/manager/store.js +113 -0
  40. package/es/components/flyout/manager/validation.js +85 -0
  41. package/es/components/flyout/use_flyout_resizable.js +149 -0
  42. package/es/components/flyout/use_flyout_z_index.js +46 -0
  43. package/es/components/header/header_logo/header_logo.js +6 -1
  44. package/es/components/header/header_logo/header_logo.styles.js +1 -1
  45. package/es/components/icon/icon.styles.js +4 -4
  46. package/es/components/overlay_mask/overlay_mask.js +13 -3
  47. package/es/components/overlay_mask/overlay_mask.styles.js +11 -2
  48. package/es/components/page/page.js +11 -3
  49. package/es/components/page/page.styles.js +1 -2
  50. package/es/components/page/page_header/page_header.js +11 -3
  51. package/es/components/page_template/outer/page_outer.js +2 -3
  52. package/es/components/page_template/outer/page_outer.styles.js +29 -35
  53. package/es/components/page_template/page_template.js +8 -2
  54. package/es/components/provider/provider.js +2 -1
  55. package/es/components/search_bar/search_bar.js +10 -4
  56. package/es/components/selectable/selectable.js +7 -2
  57. package/es/services/string/to_initials.js +26 -4
  58. package/eui.d.ts +1516 -930
  59. package/i18ntokens.json +577 -523
  60. package/lib/components/basic_table/in_memory_table.js +87 -61
  61. package/lib/components/collapsible_nav/collapsible_nav.js +20 -101
  62. package/lib/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
  63. package/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  64. package/lib/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  65. package/lib/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  66. package/lib/components/date_picker/super_date_picker/quick_select_popover/index.js +7 -0
  67. package/lib/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  68. package/lib/components/filter_group/filter_group.a11y.js +1 -1
  69. package/lib/components/flyout/_flyout_overlay.js +59 -0
  70. package/lib/components/flyout/_flyout_resize_button.js +38 -0
  71. package/{test-env/components/flyout/flyout_resizable.styles.js → lib/components/flyout/_flyout_resize_button.styles.js} +12 -12
  72. package/lib/components/flyout/const.js +49 -0
  73. package/lib/components/flyout/flyout.component.js +488 -0
  74. package/lib/components/flyout/flyout.js +102 -379
  75. package/lib/components/flyout/flyout.styles.js +105 -7
  76. package/lib/components/flyout/flyout_menu.js +243 -0
  77. package/lib/components/flyout/flyout_menu.styles.js +25 -0
  78. package/{optimize/lib/components/flyout/flyout_context.js → lib/components/flyout/flyout_menu_context.js} +2 -7
  79. package/lib/components/flyout/flyout_parent_context.js +43 -0
  80. package/lib/components/flyout/flyout_resizable.js +36 -147
  81. package/lib/components/flyout/hooks.js +30 -0
  82. package/lib/components/flyout/index.js +21 -14
  83. package/lib/components/flyout/manager/actions.js +159 -0
  84. package/lib/components/flyout/manager/activity_stage.js +101 -0
  85. package/lib/components/flyout/manager/const.js +62 -0
  86. package/lib/components/flyout/manager/context.js +41 -0
  87. package/lib/components/flyout/manager/flyout_child.js +80 -0
  88. package/lib/components/flyout/manager/flyout_main.js +70 -0
  89. package/lib/components/flyout/manager/flyout_main.styles.js +31 -0
  90. package/lib/components/flyout/manager/flyout_managed.js +233 -0
  91. package/lib/components/flyout/manager/flyout_managed.styles.js +73 -0
  92. package/lib/components/flyout/manager/hooks.js +131 -0
  93. package/lib/components/flyout/manager/index.js +168 -0
  94. package/lib/components/flyout/manager/layout_mode.js +171 -0
  95. package/lib/components/flyout/manager/provider.js +63 -0
  96. package/lib/components/flyout/manager/reducer.js +325 -0
  97. package/lib/components/flyout/manager/selectors.js +122 -0
  98. package/lib/components/flyout/manager/store.js +120 -0
  99. package/lib/components/flyout/manager/validation.js +94 -0
  100. package/lib/components/flyout/use_flyout_resizable.js +153 -0
  101. package/lib/components/flyout/use_flyout_z_index.js +51 -0
  102. package/lib/components/header/header_logo/header_logo.js +6 -1
  103. package/lib/components/header/header_logo/header_logo.styles.js +1 -1
  104. package/lib/components/icon/icon.styles.js +4 -4
  105. package/lib/components/overlay_mask/overlay_mask.js +12 -2
  106. package/lib/components/overlay_mask/overlay_mask.styles.js +11 -4
  107. package/lib/components/page/page.js +10 -2
  108. package/lib/components/page/page.styles.js +1 -2
  109. package/lib/components/page/page_header/page_header.js +10 -2
  110. package/lib/components/page_template/outer/page_outer.js +1 -2
  111. package/lib/components/page_template/outer/page_outer.styles.js +29 -35
  112. package/lib/components/page_template/page_template.js +8 -2
  113. package/lib/components/provider/provider.js +2 -1
  114. package/lib/components/search_bar/search_bar.js +9 -4
  115. package/lib/components/selectable/selectable.js +7 -2
  116. package/lib/services/string/to_initials.js +26 -4
  117. package/optimize/es/components/basic_table/in_memory_table.js +71 -46
  118. package/optimize/es/components/collapsible_nav/collapsible_nav.js +1 -0
  119. package/optimize/es/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
  120. package/optimize/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  121. package/optimize/es/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  122. package/optimize/es/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  123. package/optimize/es/components/date_picker/super_date_picker/quick_select_popover/index.js +1 -0
  124. package/optimize/es/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  125. package/optimize/es/components/filter_group/filter_group.a11y.js +1 -1
  126. package/optimize/es/components/flyout/_flyout_overlay.js +52 -0
  127. package/optimize/es/components/flyout/_flyout_resize_button.js +31 -0
  128. package/optimize/es/components/flyout/{flyout_resizable.styles.js → _flyout_resize_button.styles.js} +11 -11
  129. package/optimize/es/components/flyout/const.js +42 -0
  130. package/optimize/es/components/flyout/flyout.component.js +469 -0
  131. package/optimize/es/components/flyout/flyout.js +53 -349
  132. package/optimize/es/components/flyout/flyout.styles.js +102 -7
  133. package/optimize/es/components/flyout/flyout_menu.js +162 -0
  134. package/optimize/es/components/flyout/flyout_menu.styles.js +19 -0
  135. package/{es/components/flyout/flyout_context.js → optimize/es/components/flyout/flyout_menu_context.js} +1 -7
  136. package/optimize/es/components/flyout/flyout_parent_context.js +36 -0
  137. package/optimize/es/components/flyout/flyout_resizable.js +7 -138
  138. package/optimize/es/components/flyout/hooks.js +25 -0
  139. package/optimize/es/components/flyout/index.js +5 -2
  140. package/optimize/es/components/flyout/manager/actions.js +153 -0
  141. package/optimize/es/components/flyout/manager/activity_stage.js +95 -0
  142. package/optimize/es/components/flyout/manager/const.js +56 -0
  143. package/optimize/es/components/flyout/manager/context.js +33 -0
  144. package/optimize/es/components/flyout/manager/flyout_child.js +71 -0
  145. package/optimize/es/components/flyout/manager/flyout_main.js +61 -0
  146. package/optimize/es/components/flyout/manager/flyout_main.styles.js +25 -0
  147. package/optimize/es/components/flyout/manager/flyout_managed.js +223 -0
  148. package/optimize/es/components/flyout/manager/flyout_managed.styles.js +69 -0
  149. package/optimize/es/components/flyout/manager/hooks.js +55 -0
  150. package/optimize/es/components/flyout/manager/index.js +31 -0
  151. package/optimize/es/components/flyout/manager/layout_mode.js +162 -0
  152. package/optimize/es/components/flyout/manager/provider.js +53 -0
  153. package/optimize/es/components/flyout/manager/reducer.js +312 -0
  154. package/optimize/es/components/flyout/manager/selectors.js +116 -0
  155. package/optimize/es/components/flyout/manager/store.js +113 -0
  156. package/optimize/es/components/flyout/manager/types.js +1 -0
  157. package/optimize/es/components/flyout/manager/validation.js +85 -0
  158. package/optimize/es/components/flyout/types.js +1 -0
  159. package/optimize/es/components/flyout/use_flyout_resizable.js +144 -0
  160. package/optimize/es/components/flyout/use_flyout_z_index.js +46 -0
  161. package/optimize/es/components/header/header_logo/header_logo.js +6 -1
  162. package/optimize/es/components/header/header_logo/header_logo.styles.js +1 -1
  163. package/optimize/es/components/icon/icon.styles.js +4 -4
  164. package/optimize/es/components/overlay_mask/overlay_mask.js +13 -3
  165. package/optimize/es/components/overlay_mask/overlay_mask.styles.js +11 -2
  166. package/optimize/es/components/page/page.js +6 -3
  167. package/optimize/es/components/page/page.styles.js +1 -2
  168. package/optimize/es/components/page/page_header/page_header.js +6 -3
  169. package/optimize/es/components/page_template/outer/page_outer.js +2 -3
  170. package/optimize/es/components/page_template/outer/page_outer.styles.js +29 -35
  171. package/optimize/es/components/page_template/page_template.js +2 -1
  172. package/optimize/es/components/provider/provider.js +2 -1
  173. package/optimize/es/components/search_bar/search_bar.js +6 -0
  174. package/optimize/es/components/selectable/selectable.js +7 -2
  175. package/optimize/es/services/string/to_initials.js +26 -4
  176. package/optimize/lib/components/basic_table/in_memory_table.js +71 -46
  177. package/optimize/lib/components/collapsible_nav/collapsible_nav.js +1 -0
  178. package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
  179. package/optimize/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  180. package/optimize/lib/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  181. package/optimize/lib/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  182. package/optimize/lib/components/date_picker/super_date_picker/quick_select_popover/index.js +7 -0
  183. package/optimize/lib/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  184. package/optimize/lib/components/filter_group/filter_group.a11y.js +1 -1
  185. package/optimize/lib/components/flyout/_flyout_overlay.js +62 -0
  186. package/optimize/lib/components/flyout/_flyout_resize_button.js +37 -0
  187. package/{lib/components/flyout/flyout_resizable.styles.js → optimize/lib/components/flyout/_flyout_resize_button.styles.js} +12 -12
  188. package/optimize/lib/components/flyout/const.js +49 -0
  189. package/optimize/lib/components/flyout/flyout.component.js +477 -0
  190. package/optimize/lib/components/flyout/flyout.js +77 -349
  191. package/optimize/lib/components/flyout/flyout.styles.js +102 -7
  192. package/optimize/lib/components/flyout/flyout_menu.js +168 -0
  193. package/optimize/lib/components/flyout/flyout_menu.styles.js +25 -0
  194. package/{lib/components/flyout/flyout_context.js → optimize/lib/components/flyout/flyout_menu_context.js} +2 -7
  195. package/optimize/lib/components/flyout/flyout_parent_context.js +43 -0
  196. package/optimize/lib/components/flyout/flyout_resizable.js +9 -139
  197. package/optimize/lib/components/flyout/hooks.js +30 -0
  198. package/optimize/lib/components/flyout/index.js +21 -14
  199. package/optimize/lib/components/flyout/manager/actions.js +159 -0
  200. package/optimize/lib/components/flyout/manager/activity_stage.js +101 -0
  201. package/optimize/lib/components/flyout/manager/const.js +62 -0
  202. package/optimize/lib/components/flyout/manager/context.js +41 -0
  203. package/optimize/lib/components/flyout/manager/flyout_child.js +76 -0
  204. package/optimize/lib/components/flyout/manager/flyout_main.js +66 -0
  205. package/optimize/lib/components/flyout/manager/flyout_main.styles.js +31 -0
  206. package/optimize/lib/components/flyout/manager/flyout_managed.js +231 -0
  207. package/optimize/lib/components/flyout/manager/flyout_managed.styles.js +74 -0
  208. package/optimize/lib/components/flyout/manager/hooks.js +131 -0
  209. package/optimize/lib/components/flyout/manager/index.js +168 -0
  210. package/optimize/lib/components/flyout/manager/layout_mode.js +169 -0
  211. package/optimize/lib/components/flyout/manager/provider.js +61 -0
  212. package/optimize/lib/components/flyout/manager/reducer.js +318 -0
  213. package/optimize/lib/components/flyout/manager/selectors.js +122 -0
  214. package/optimize/lib/components/flyout/manager/store.js +120 -0
  215. package/optimize/lib/components/flyout/manager/validation.js +94 -0
  216. package/optimize/lib/components/flyout/types.js +5 -0
  217. package/optimize/lib/components/flyout/use_flyout_resizable.js +151 -0
  218. package/optimize/lib/components/flyout/use_flyout_z_index.js +51 -0
  219. package/optimize/lib/components/header/header_logo/header_logo.js +6 -1
  220. package/optimize/lib/components/header/header_logo/header_logo.styles.js +1 -1
  221. package/optimize/lib/components/icon/icon.styles.js +4 -4
  222. package/optimize/lib/components/overlay_mask/overlay_mask.js +12 -2
  223. package/optimize/lib/components/overlay_mask/overlay_mask.styles.js +11 -4
  224. package/optimize/lib/components/page/page.js +5 -2
  225. package/optimize/lib/components/page/page.styles.js +1 -2
  226. package/optimize/lib/components/page/page_header/page_header.js +5 -2
  227. package/optimize/lib/components/page_template/outer/page_outer.js +1 -2
  228. package/optimize/lib/components/page_template/outer/page_outer.styles.js +29 -35
  229. package/optimize/lib/components/page_template/page_template.js +2 -1
  230. package/optimize/lib/components/provider/provider.js +2 -1
  231. package/optimize/lib/components/search_bar/search_bar.js +5 -0
  232. package/optimize/lib/components/selectable/selectable.js +7 -2
  233. package/optimize/lib/services/string/to_initials.js +26 -4
  234. package/package.json +7 -5
  235. package/test-env/components/basic_table/in_memory_table.js +87 -61
  236. package/test-env/components/collapsible_nav/collapsible_nav.js +20 -101
  237. package/test-env/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
  238. package/test-env/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  239. package/test-env/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  240. package/test-env/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  241. package/test-env/components/date_picker/super_date_picker/quick_select_popover/index.js +7 -0
  242. package/test-env/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  243. package/test-env/components/filter_group/filter_group.a11y.js +1 -1
  244. package/test-env/components/flyout/_flyout_overlay.js +62 -0
  245. package/test-env/components/flyout/_flyout_resize_button.js +37 -0
  246. package/{optimize/lib/components/flyout/flyout_resizable.styles.js → test-env/components/flyout/_flyout_resize_button.styles.js} +12 -12
  247. package/test-env/components/flyout/const.js +49 -0
  248. package/test-env/components/flyout/flyout.component.js +477 -0
  249. package/test-env/components/flyout/flyout.styles.js +102 -7
  250. package/test-env/components/flyout/flyout_menu.js +241 -0
  251. package/test-env/components/flyout/flyout_menu.styles.js +25 -0
  252. package/test-env/components/flyout/{flyout_context.js → flyout_menu_context.js} +2 -7
  253. package/test-env/components/flyout/flyout_parent_context.js +43 -0
  254. package/test-env/components/flyout/flyout_resizable.js +35 -139
  255. package/test-env/components/flyout/hooks.js +30 -0
  256. package/test-env/components/flyout/index.js +21 -14
  257. package/test-env/components/flyout/manager/actions.js +159 -0
  258. package/test-env/components/flyout/manager/activity_stage.js +101 -0
  259. package/test-env/components/flyout/manager/const.js +62 -0
  260. package/test-env/components/flyout/manager/context.js +41 -0
  261. package/test-env/components/flyout/manager/flyout_child.js +76 -0
  262. package/test-env/components/flyout/manager/flyout_main.js +66 -0
  263. package/test-env/components/flyout/manager/flyout_main.styles.js +31 -0
  264. package/test-env/components/flyout/manager/flyout_managed.js +231 -0
  265. package/test-env/components/flyout/manager/flyout_managed.styles.js +74 -0
  266. package/test-env/components/flyout/manager/hooks.js +131 -0
  267. package/test-env/components/flyout/manager/index.js +168 -0
  268. package/test-env/components/flyout/manager/layout_mode.js +169 -0
  269. package/test-env/components/flyout/manager/provider.js +61 -0
  270. package/test-env/components/flyout/manager/reducer.js +318 -0
  271. package/test-env/components/flyout/manager/selectors.js +122 -0
  272. package/test-env/components/flyout/manager/store.js +120 -0
  273. package/test-env/components/flyout/manager/types.js +5 -0
  274. package/test-env/components/flyout/manager/validation.js +94 -0
  275. package/test-env/components/flyout/types.js +5 -0
  276. package/test-env/components/flyout/use_flyout_resizable.js +151 -0
  277. package/test-env/components/flyout/use_flyout_z_index.js +51 -0
  278. package/test-env/components/header/header_logo/header_logo.js +6 -1
  279. package/test-env/components/header/header_logo/header_logo.styles.js +1 -1
  280. package/test-env/components/icon/icon.styles.js +4 -4
  281. package/test-env/components/overlay_mask/overlay_mask.js +12 -2
  282. package/test-env/components/overlay_mask/overlay_mask.styles.js +11 -4
  283. package/test-env/components/page/page.js +10 -2
  284. package/test-env/components/page/page.styles.js +1 -2
  285. package/test-env/components/page/page_header/page_header.js +10 -2
  286. package/test-env/components/page_template/outer/page_outer.js +1 -2
  287. package/test-env/components/page_template/outer/page_outer.styles.js +29 -35
  288. package/test-env/components/page_template/page_template.js +8 -2
  289. package/test-env/components/provider/provider.js +2 -1
  290. package/test-env/components/search_bar/search_bar.js +9 -4
  291. package/test-env/components/selectable/selectable.js +7 -2
  292. package/test-env/services/string/to_initials.js +26 -4
  293. package/es/components/flyout/flyout_child.js +0 -223
  294. package/es/components/flyout/flyout_child.styles.js +0 -32
  295. package/es/components/flyout/flyout_child_manager.js +0 -114
  296. package/es/components/flyout/sessions/flyout_provider.js +0 -95
  297. package/es/components/flyout/sessions/flyout_reducer.js +0 -195
  298. package/es/components/flyout/sessions/index.js +0 -10
  299. package/es/components/flyout/sessions/use_eui_flyout.js +0 -82
  300. package/lib/components/flyout/flyout_child.js +0 -231
  301. package/lib/components/flyout/flyout_child.styles.js +0 -38
  302. package/lib/components/flyout/flyout_child_manager.js +0 -122
  303. package/lib/components/flyout/sessions/flyout_provider.js +0 -102
  304. package/lib/components/flyout/sessions/flyout_reducer.js +0 -202
  305. package/lib/components/flyout/sessions/index.js +0 -25
  306. package/lib/components/flyout/sessions/use_eui_flyout.js +0 -88
  307. package/optimize/es/components/flyout/flyout_child.js +0 -178
  308. package/optimize/es/components/flyout/flyout_child.styles.js +0 -32
  309. package/optimize/es/components/flyout/flyout_child_manager.js +0 -100
  310. package/optimize/es/components/flyout/sessions/flyout_provider.js +0 -90
  311. package/optimize/es/components/flyout/sessions/flyout_reducer.js +0 -187
  312. package/optimize/es/components/flyout/sessions/index.js +0 -10
  313. package/optimize/es/components/flyout/sessions/use_eui_flyout.js +0 -82
  314. package/optimize/lib/components/flyout/flyout_child.js +0 -186
  315. package/optimize/lib/components/flyout/flyout_child.styles.js +0 -38
  316. package/optimize/lib/components/flyout/flyout_child_manager.js +0 -110
  317. package/optimize/lib/components/flyout/sessions/flyout_provider.js +0 -100
  318. package/optimize/lib/components/flyout/sessions/flyout_reducer.js +0 -195
  319. package/optimize/lib/components/flyout/sessions/index.js +0 -25
  320. package/optimize/lib/components/flyout/sessions/use_eui_flyout.js +0 -88
  321. package/test-env/components/flyout/flyout_child.js +0 -230
  322. package/test-env/components/flyout/flyout_child.styles.js +0 -38
  323. package/test-env/components/flyout/flyout_child_manager.js +0 -119
  324. package/test-env/components/flyout/sessions/flyout_provider.js +0 -100
  325. package/test-env/components/flyout/sessions/flyout_reducer.js +0 -195
  326. package/test-env/components/flyout/sessions/index.js +0 -25
  327. package/test-env/components/flyout/sessions/use_eui_flyout.js +0 -88
  328. /package/es/components/flyout/{sessions → manager}/types.js +0 -0
  329. /package/{optimize/es/components/flyout/sessions → es/components/flyout}/types.js +0 -0
  330. /package/lib/components/flyout/{sessions → manager}/types.js +0 -0
  331. /package/{optimize/lib/components/flyout/sessions → lib/components/flyout}/types.js +0 -0
  332. /package/{test-env/components/flyout/sessions → optimize/lib/components/flyout/manager}/types.js +0 -0
@@ -1,195 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.flyoutReducer = flyoutReducer;
8
- exports.initialFlyoutState = void 0;
9
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
10
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
12
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
13
- /*
14
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
15
- * or more contributor license agreements. Licensed under the Elastic License
16
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
17
- * in compliance with, at your election, the Elastic License 2.0 or the Server
18
- * Side Public License, v 1.
19
- */
20
-
21
- /**
22
- * Initial state for the flyout session
23
- * @internal
24
- */
25
- var initialFlyoutState = exports.initialFlyoutState = {
26
- activeFlyoutGroup: null,
27
- history: []
28
- };
29
-
30
- // Helper to apply size constraints for flyout groups
31
- var applySizeConstraints = function applySizeConstraints(group) {
32
- var originalMainSize = group.config.mainSize;
33
- var originalChildSize = group.config.childSize;
34
- var newMainSize = originalMainSize;
35
- var newChildSize = originalChildSize;
36
- if (group.isChildOpen) {
37
- if (originalMainSize === 'l') {
38
- newMainSize = 'm'; // If main is 'l' with child, it must be converted to 'm'
39
- newChildSize = 's'; // And child must be 's'
40
- } else if (originalMainSize === 'm' && originalChildSize !== 's') {
41
- newChildSize = 's'; // If main is 'm' with child, child must be 's'
42
- }
43
- }
44
-
45
- // If sizes haven't changed, return the original group to preserve references
46
- if (newMainSize === originalMainSize && newChildSize === originalChildSize) {
47
- return group;
48
- }
49
- return _objectSpread(_objectSpread({}, group), {}, {
50
- config: _objectSpread(_objectSpread({}, group.config), {}, {
51
- mainSize: newMainSize,
52
- childSize: newChildSize
53
- })
54
- });
55
- };
56
-
57
- /**
58
- * Flyout reducer
59
- * Controls state changes for flyout groups
60
- */
61
- function flyoutReducer(state, action) {
62
- switch (action.type) {
63
- case 'OPEN_MAIN_FLYOUT':
64
- {
65
- var _action$payload = action.payload,
66
- size = _action$payload.size,
67
- flyoutProps = _action$payload.flyoutProps,
68
- meta = _action$payload.meta;
69
- var newHistory = (0, _toConsumableArray2.default)(state.history);
70
- if (state.activeFlyoutGroup) {
71
- newHistory.push(state.activeFlyoutGroup);
72
- }
73
- var newActiveGroup = {
74
- isMainOpen: true,
75
- isChildOpen: false,
76
- config: {
77
- mainSize: size,
78
- mainFlyoutProps: flyoutProps
79
- },
80
- meta: meta
81
- };
82
- return {
83
- activeFlyoutGroup: applySizeConstraints(newActiveGroup),
84
- history: newHistory
85
- };
86
- }
87
- case 'OPEN_CHILD_FLYOUT':
88
- {
89
- if (!state.activeFlyoutGroup || !state.activeFlyoutGroup.isMainOpen) {
90
- console.warn('Cannot open child flyout: main flyout is not open or no active group.');
91
- return state;
92
- }
93
- var _action$payload2 = action.payload,
94
- _size = _action$payload2.size,
95
- _flyoutProps = _action$payload2.flyoutProps,
96
- _meta = _action$payload2.meta;
97
- var updatedActiveGroup = _objectSpread(_objectSpread({}, state.activeFlyoutGroup), {}, {
98
- isChildOpen: true,
99
- config: _objectSpread(_objectSpread({}, state.activeFlyoutGroup.config), {}, {
100
- childSize: _size,
101
- childFlyoutProps: _flyoutProps
102
- }),
103
- meta: _meta
104
- });
105
- return {
106
- history: state.history,
107
- activeFlyoutGroup: applySizeConstraints(updatedActiveGroup)
108
- };
109
- }
110
- case 'OPEN_FLYOUT_GROUP':
111
- {
112
- var _action$payload3 = action.payload,
113
- main = _action$payload3.main,
114
- child = _action$payload3.child,
115
- _meta2 = _action$payload3.meta;
116
- var _newHistory = (0, _toConsumableArray2.default)(state.history);
117
- if (state.activeFlyoutGroup) {
118
- _newHistory.push(state.activeFlyoutGroup);
119
- }
120
-
121
- // Create the new active group with both main and child flyouts open
122
- var _newActiveGroup = {
123
- isMainOpen: true,
124
- isChildOpen: true,
125
- config: {
126
- mainSize: main.size,
127
- childSize: child.size,
128
- mainFlyoutProps: main.flyoutProps,
129
- childFlyoutProps: child.flyoutProps
130
- },
131
- meta: _meta2
132
- };
133
- return {
134
- activeFlyoutGroup: applySizeConstraints(_newActiveGroup),
135
- history: _newHistory
136
- };
137
- }
138
- case 'CLOSE_CHILD_FLYOUT':
139
- {
140
- if (!state.activeFlyoutGroup || !state.activeFlyoutGroup.isChildOpen) {
141
- console.warn('Cannot close child flyout: no child is open or no active group.');
142
- return state;
143
- }
144
- var _updatedActiveGroup = _objectSpread(_objectSpread({}, state.activeFlyoutGroup), {}, {
145
- isChildOpen: false,
146
- config: _objectSpread(_objectSpread({}, state.activeFlyoutGroup.config), {}, {
147
- childFlyoutProps: {}
148
- })
149
- });
150
- return {
151
- history: state.history,
152
- activeFlyoutGroup: applySizeConstraints(_updatedActiveGroup)
153
- };
154
- }
155
- case 'GO_BACK':
156
- {
157
- if (!state.activeFlyoutGroup) return initialFlyoutState;
158
-
159
- // Restore from history or return to initial state
160
- if (state.history.length > 0) {
161
- var _newHistory2 = (0, _toConsumableArray2.default)(state.history);
162
- var previousGroup = _newHistory2.pop();
163
- return {
164
- activeFlyoutGroup: previousGroup ? applySizeConstraints(previousGroup) : null,
165
- history: _newHistory2
166
- };
167
- } else {
168
- return initialFlyoutState;
169
- }
170
- }
171
- case 'UPDATE_ACTIVE_FLYOUT_CONFIG':
172
- {
173
- if (!state.activeFlyoutGroup) {
174
- console.warn('Cannot update config: no active flyout group.');
175
- return state;
176
- }
177
- var configChanges = action.payload.configChanges;
178
- var _updatedActiveGroup2 = _objectSpread(_objectSpread({}, state.activeFlyoutGroup), {}, {
179
- config: _objectSpread(_objectSpread({}, state.activeFlyoutGroup.config), configChanges)
180
- });
181
- var finalUpdatedActiveGroup = applySizeConstraints(_updatedActiveGroup2);
182
- return _objectSpread(_objectSpread({}, state), {}, {
183
- activeFlyoutGroup: finalUpdatedActiveGroup
184
- });
185
- }
186
- case 'CLOSE_SESSION':
187
- // Remove the active group and close the session
188
- return {
189
- activeFlyoutGroup: null,
190
- history: []
191
- };
192
- default:
193
- return state;
194
- }
195
- }
@@ -1,25 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "EuiFlyoutSessionProvider", {
7
- enumerable: true,
8
- get: function get() {
9
- return _flyout_provider.EuiFlyoutSessionProvider;
10
- }
11
- });
12
- Object.defineProperty(exports, "useEuiFlyoutSession", {
13
- enumerable: true,
14
- get: function get() {
15
- return _use_eui_flyout.useEuiFlyoutSession;
16
- }
17
- });
18
- Object.defineProperty(exports, "useEuiFlyoutSessionContext", {
19
- enumerable: true,
20
- get: function get() {
21
- return _flyout_provider.useEuiFlyoutSessionContext;
22
- }
23
- });
24
- var _flyout_provider = require("./flyout_provider");
25
- var _use_eui_flyout = require("./use_eui_flyout");
@@ -1,88 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.useEuiFlyoutSession = useEuiFlyoutSession;
7
- var _react = require("react");
8
- var _flyout_provider = require("./flyout_provider");
9
- /*
10
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
11
- * or more contributor license agreements. Licensed under the Elastic License
12
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
13
- * in compliance with, at your election, the Elastic License 2.0 or the Server
14
- * Side Public License, v 1.
15
- */
16
-
17
- /**
18
- * Hook for accessing the flyout API
19
- * @public
20
- */
21
- function useEuiFlyoutSession() {
22
- var _state$activeFlyoutGr, _state$activeFlyoutGr2;
23
- var _useEuiFlyoutSessionC = (0, _flyout_provider.useEuiFlyoutSessionContext)(),
24
- state = _useEuiFlyoutSessionC.state,
25
- dispatch = _useEuiFlyoutSessionC.dispatch,
26
- onUnmount = _useEuiFlyoutSessionC.onUnmount;
27
- var isInitialMount = (0, _react.useRef)(true);
28
- (0, _react.useEffect)(function () {
29
- // When there is no active flyout, we should call the onUnmount callback.
30
- // Ensure this is not called on the initial render, only on subsequent state changes.
31
- if (isInitialMount.current) {
32
- isInitialMount.current = false;
33
- } else if (state.activeFlyoutGroup === null) {
34
- onUnmount === null || onUnmount === void 0 || onUnmount();
35
- }
36
- }, [state.activeFlyoutGroup, onUnmount]);
37
- var openFlyout = function openFlyout(options) {
38
- dispatch({
39
- type: 'OPEN_MAIN_FLYOUT',
40
- payload: options
41
- });
42
- };
43
- var openChildFlyout = function openChildFlyout(options) {
44
- if (!state.activeFlyoutGroup || !state.activeFlyoutGroup.isMainOpen) {
45
- console.warn('useEuiFlyoutApi: Cannot open child flyout when main flyout is not open.');
46
- return;
47
- }
48
- dispatch({
49
- type: 'OPEN_CHILD_FLYOUT',
50
- payload: options
51
- });
52
- };
53
- var openFlyoutGroup = function openFlyoutGroup(options) {
54
- dispatch({
55
- type: 'OPEN_FLYOUT_GROUP',
56
- payload: options
57
- });
58
- };
59
- var closeChildFlyout = function closeChildFlyout() {
60
- dispatch({
61
- type: 'CLOSE_CHILD_FLYOUT'
62
- });
63
- };
64
- var goBack = function goBack() {
65
- dispatch({
66
- type: 'GO_BACK'
67
- });
68
- };
69
- var closeSession = function closeSession() {
70
- dispatch({
71
- type: 'CLOSE_SESSION'
72
- });
73
- };
74
- var isFlyoutOpen = !!((_state$activeFlyoutGr = state.activeFlyoutGroup) !== null && _state$activeFlyoutGr !== void 0 && _state$activeFlyoutGr.isMainOpen);
75
- var isChildFlyoutOpen = !!((_state$activeFlyoutGr2 = state.activeFlyoutGroup) !== null && _state$activeFlyoutGr2 !== void 0 && _state$activeFlyoutGr2.isChildOpen);
76
- var canGoBack = !!state.history.length;
77
- return {
78
- openFlyout: openFlyout,
79
- openChildFlyout: openChildFlyout,
80
- openFlyoutGroup: openFlyoutGroup,
81
- closeChildFlyout: closeChildFlyout,
82
- goBack: goBack,
83
- closeSession: closeSession,
84
- isFlyoutOpen: isFlyoutOpen,
85
- isChildFlyoutOpen: isChildFlyoutOpen,
86
- canGoBack: canGoBack
87
- };
88
- }
@@ -1,230 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- var _typeof = require("@babel/runtime/helpers/typeof");
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.EuiFlyoutChild = void 0;
9
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
- var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
11
- var _react = _interopRequireWildcard(require("react"));
12
- var _propTypes = _interopRequireDefault(require("prop-types"));
13
- var _classnames = _interopRequireDefault(require("classnames"));
14
- var _services = require("../../services");
15
- var _flyout_child = require("./flyout_child.styles");
16
- var _flyout_close_button = require("./_flyout_close_button");
17
- var _flyout_context = require("./flyout_context");
18
- var _flyout_body = require("./flyout_body");
19
- var _focus_trap = require("../focus_trap");
20
- var _react2 = require("@emotion/react");
21
- var _excluded = ["children", "backgroundStyle", "className", "banner", "hideCloseButton", "onClose", "scrollableTabIndex", "size"];
22
- /*
23
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
24
- * or more contributor license agreements. Licensed under the Elastic License
25
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
26
- * in compliance with, at your election, the Elastic License 2.0 or the Server
27
- * Side Public License, v 1.
28
- */
29
- /**
30
- * Props used to render and configure the child flyout panel
31
- */
32
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
33
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
34
- /**
35
- * The child flyout is a panel that appears to the left of the parent flyout.
36
- * It is only visible when the parent flyout is open.
37
- */
38
- var EuiFlyoutChild = exports.EuiFlyoutChild = function EuiFlyoutChild(_ref) {
39
- var children = _ref.children,
40
- _ref$backgroundStyle = _ref.backgroundStyle,
41
- backgroundStyle = _ref$backgroundStyle === void 0 ? 'default' : _ref$backgroundStyle,
42
- className = _ref.className,
43
- banner = _ref.banner,
44
- _ref$hideCloseButton = _ref.hideCloseButton,
45
- hideCloseButton = _ref$hideCloseButton === void 0 ? false : _ref$hideCloseButton,
46
- onClose = _ref.onClose,
47
- _ref$scrollableTabInd = _ref.scrollableTabIndex,
48
- scrollableTabIndex = _ref$scrollableTabInd === void 0 ? 0 : _ref$scrollableTabInd,
49
- _ref$size = _ref.size,
50
- size = _ref$size === void 0 ? 's' : _ref$size,
51
- rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
52
- var flyoutContext = (0, _react.useContext)(_flyout_context.EuiFlyoutContext);
53
- if (!flyoutContext) {
54
- throw new Error('EuiFlyoutChild must be used as a child of EuiFlyout.');
55
- }
56
- var isChildFlyoutOpen = flyoutContext.isChildFlyoutOpen,
57
- setIsChildFlyoutOpen = flyoutContext.setIsChildFlyoutOpen,
58
- parentSize = flyoutContext.parentSize;
59
- (0, _react.useEffect)(function () {
60
- setIsChildFlyoutOpen === null || setIsChildFlyoutOpen === void 0 || setIsChildFlyoutOpen(true);
61
- return function () {
62
- setIsChildFlyoutOpen === null || setIsChildFlyoutOpen === void 0 || setIsChildFlyoutOpen(false);
63
- };
64
- }, [setIsChildFlyoutOpen]);
65
- if (_react.default.Children.count(children) === 0) {
66
- console.warn('EuiFlyoutChild was rendered with no children!');
67
- }
68
- if (parentSize === 'm' && size === 'm') {
69
- throw new Error('When the parent EuiFlyout size is "m", the EuiFlyoutChild size cannot be "m". Please use size "s" for the EuiFlyoutChild.');
70
- }
71
- var handleClose = function handleClose(event) {
72
- setIsChildFlyoutOpen === null || setIsChildFlyoutOpen === void 0 || setIsChildFlyoutOpen(false);
73
- onClose(event);
74
- };
75
- var flyoutTitleText;
76
- var hasDescribedByBody = false;
77
- _react.Children.forEach(children, function (child) {
78
- if ( /*#__PURE__*/_react.default.isValidElement(child)) {
79
- var _child$type;
80
- if (((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName) === 'EuiFlyoutHeader') {
81
- // Attempt to extract string content from header for ARIA
82
- var headerChildren = child.props.children;
83
- if (typeof headerChildren === 'string') {
84
- flyoutTitleText = headerChildren;
85
- } else if ( /*#__PURE__*/_react.default.isValidElement(headerChildren) &&
86
- // Check if props exist and children is a string
87
- typeof headerChildren.props.children === 'string') {
88
- flyoutTitleText = headerChildren.props.children;
89
- } else if (Array.isArray(headerChildren)) {
90
- // Find the first string child if headerChildren is an array
91
- flyoutTitleText = headerChildren.find(function (cNode) {
92
- return typeof cNode === 'string';
93
- });
94
- }
95
- }
96
- if (child.type === _flyout_body.EuiFlyoutBody) {
97
- hasDescribedByBody = true;
98
- }
99
- }
100
- });
101
- var titleIdGenerated = (0, _services.useGeneratedHtmlId)({
102
- prefix: 'euiFlyoutChildTitle'
103
- });
104
- var bodyIdGenerated = (0, _services.useGeneratedHtmlId)({
105
- prefix: 'euiFlyoutChildBody'
106
- });
107
- var ariaLabelledBy = flyoutTitleText ? titleIdGenerated : undefined;
108
- var ariaDescribedBy = hasDescribedByBody ? bodyIdGenerated : undefined;
109
- // Use existing aria-label if provided, otherwise fallback if no labelledby can be derived
110
- var ariaLabel = rest['aria-label'] || (!ariaLabelledBy && !flyoutTitleText ? 'Flyout panel' : undefined);
111
- var processedChildren = (0, _react.useMemo)(function () {
112
- return _react.Children.map(children, function (child) {
113
- if ( /*#__PURE__*/_react.default.isValidElement(child)) {
114
- var _child$type2, _child$type3;
115
- if ((child.type === _flyout_body.EuiFlyoutBody || ((_child$type2 = child.type) === null || _child$type2 === void 0 ? void 0 : _child$type2.displayName) === 'EuiFlyoutBody') && hasDescribedByBody) {
116
- return /*#__PURE__*/_react.default.cloneElement(child, {
117
- id: bodyIdGenerated
118
- });
119
- }
120
- // If EuiFlyoutHeader is found and we derived flyoutTitleText, set its ID
121
- if (((_child$type3 = child.type) === null || _child$type3 === void 0 ? void 0 : _child$type3.displayName) === 'EuiFlyoutHeader' && flyoutTitleText && ariaLabelledBy) {
122
- return /*#__PURE__*/_react.default.cloneElement(child, {
123
- id: titleIdGenerated
124
- });
125
- }
126
- }
127
- return child;
128
- });
129
- }, [children, bodyIdGenerated, titleIdGenerated, hasDescribedByBody, flyoutTitleText, ariaLabelledBy]);
130
- var flyoutWrapperRef = (0, _react.useRef)(null);
131
- var classes = (0, _classnames.default)('euiFlyoutChild', className);
132
- var styles = (0, _services.useEuiMemoizedStyles)(_flyout_child.euiFlyoutChildStyles);
133
- var childLayoutMode = flyoutContext.childLayoutMode,
134
- parentFlyoutRef = flyoutContext.parentFlyoutRef;
135
- var flyoutChildCss = [styles.euiFlyoutChild, backgroundStyle === 'shaded' ? styles.backgroundShaded : styles.backgroundDefault, size === 's' ? styles.s : styles.m, childLayoutMode === 'side-by-side' ? styles.sidePosition : styles.stackedPosition];
136
- var onKeyDown = (0, _react.useCallback)(function (event) {
137
- if (isChildFlyoutOpen && event.key === _services.keys.ESCAPE) {
138
- event.preventDefault();
139
- setIsChildFlyoutOpen === null || setIsChildFlyoutOpen === void 0 || setIsChildFlyoutOpen(false);
140
- onClose(event.nativeEvent);
141
- }
142
- }, [isChildFlyoutOpen, onClose, setIsChildFlyoutOpen]);
143
- return (0, _react2.jsx)(_focus_trap.EuiFocusTrap, {
144
- returnFocus: function returnFocus() {
145
- if (parentFlyoutRef !== null && parentFlyoutRef !== void 0 && parentFlyoutRef.current) {
146
- parentFlyoutRef.current.focus();
147
- return false; // We've handled focus
148
- }
149
- return true;
150
- },
151
- shards: [],
152
- disabled: false
153
- }, (0, _react2.jsx)("div", (0, _extends2.default)({
154
- ref: flyoutWrapperRef,
155
- className: classes,
156
- css: flyoutChildCss,
157
- "data-test-subj": "euiFlyoutChild",
158
- role: "dialog",
159
- "aria-modal": "true",
160
- "aria-label": ariaLabel,
161
- "aria-labelledby": ariaLabelledBy,
162
- "aria-describedby": ariaDescribedBy,
163
- tabIndex: -1,
164
- onKeyDown: onKeyDown // used as generic container event handler
165
- }, rest), flyoutTitleText && !ariaLabelledBy && (0, _react2.jsx)("h2", {
166
- id: titleIdGenerated,
167
- className: "euiScreenReaderOnly"
168
- }, flyoutTitleText), !hideCloseButton && (0, _react2.jsx)(_flyout_close_button.EuiFlyoutCloseButton, {
169
- className: "euiFlyoutChild__closeButton",
170
- onClose: handleClose,
171
- side: "right",
172
- closeButtonPosition: "inside",
173
- "data-test-subj": "euiFlyoutChildCloseButton"
174
- }), (0, _react2.jsx)("div", {
175
- tabIndex: scrollableTabIndex,
176
- className: "euiFlyoutChild__overflow",
177
- css: styles.overflow.overflow
178
- }, banner && (0, _react2.jsx)("div", {
179
- className: "euiFlyoutChild__banner",
180
- css: styles.banner,
181
- "data-test-subj": "euiFlyoutChildBanner"
182
- }, banner), (0, _react2.jsx)("div", {
183
- className: "euiFlyoutChild__overflowContent",
184
- css: styles.overflow.wrapper
185
- }, processedChildren))));
186
- };
187
- EuiFlyoutChild.propTypes = {
188
- /**
189
- * Called when the child panel's close button is clicked
190
- */
191
- onClose: _propTypes.default.func.isRequired,
192
- /**
193
- * Use to display a banner at the top of the child. It is suggested to use `EuiCallOut` for it.
194
- */
195
- banner: _propTypes.default.node,
196
- /**
197
- * Hides the default close button. You must provide another close button somewhere within the child flyout.
198
- * @default false
199
- */
200
- hideCloseButton: _propTypes.default.bool,
201
- /**
202
- * [Scrollable regions (or their children) should be focusable](https://dequeuniversity.com/rules/axe/4.0/scrollable-region-focusable)
203
- * to allow keyboard users to scroll the region via arrow keys.
204
- *
205
- * By default, EuiFlyoutChild's scroll overflow wrapper sets a `tabIndex` of `0`.
206
- * If you know your flyout child content already contains focusable children
207
- * that satisfy keyboard accessibility requirements, you can use this prop
208
- * to override this default.
209
- */
210
- scrollableTabIndex: _propTypes.default.number,
211
- /**
212
- * Size of the child flyout panel.
213
- * When the parent flyout is 'm', child is limited to 's'.
214
- * @default 's'
215
- */
216
- size: _propTypes.default.oneOf(["s", "m"]),
217
- /*
218
- * The background of the child flyout can be optionally shaded. Use `shaded` to add the shading.
219
- */
220
- backgroundStyle: _propTypes.default.oneOf(["shaded", "default"]),
221
- /**
222
- * Children are implicitly part of FunctionComponent, but good to have if props type is standalone.
223
- */
224
- children: _propTypes.default.node,
225
- className: _propTypes.default.string,
226
- "aria-label": _propTypes.default.string,
227
- "data-test-subj": _propTypes.default.string,
228
- css: _propTypes.default.any
229
- };
230
- EuiFlyoutChild.displayName = 'EuiFlyoutChild';
@@ -1,38 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.euiFlyoutChildStyles = void 0;
7
- var _react = require("@emotion/react");
8
- var _global_styling = require("../../global_styling");
9
- var _flyout = require("./flyout.styles");
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
- var euiFlyoutChildStyles = exports.euiFlyoutChildStyles = function euiFlyoutChildStyles(euiThemeContext) {
19
- var euiTheme = euiThemeContext.euiTheme;
20
- return {
21
- // Base styles for the child flyout
22
- euiFlyoutChild: /*#__PURE__*/(0, _react.css)("position:absolute;inset-block-start:0;inset-inline-start:0;block-size:100%;display:flex;flex-direction:column;", (0, _global_styling.logicalCSSWithFallback)('overflow-y', 'hidden'), " ", (0, _global_styling.logicalCSS)('height', '100%'), " z-index:", Number(euiTheme.levels.flyout) + 1, ";border-inline-start:", euiTheme.border.thin, ";", (0, _flyout.maxedFlyoutWidth)(euiThemeContext), ";;label:euiFlyoutChild;"),
23
- backgroundDefault: /*#__PURE__*/(0, _react.css)("background:", euiTheme.colors.backgroundBasePlain, ";;label:backgroundDefault;"),
24
- backgroundShaded: /*#__PURE__*/(0, _react.css)("background:", euiTheme.colors.backgroundBaseSubdued, ";;label:backgroundShaded;"),
25
- // Position variants based on screen size
26
- sidePosition: /*#__PURE__*/(0, _react.css)("transform:translateX(-100%);border-inline-end:", euiTheme.border.thin, ";;label:sidePosition;"),
27
- stackedPosition: /*#__PURE__*/(0, _react.css)("inset-inline-end:0;inline-size:100%;border-block-end:", euiTheme.border.thin, ";;label:stackedPosition;"),
28
- s: /*#__PURE__*/(0, _react.css)((0, _flyout.composeFlyoutSizing)(euiThemeContext, 's'), ";;label:s;"),
29
- m: /*#__PURE__*/(0, _react.css)((0, _flyout.composeFlyoutSizing)(euiThemeContext, 'm'), ";;label:m;"),
30
- overflow: {
31
- overflow: /*#__PURE__*/(0, _react.css)("flex-grow:1;display:flex;flex-direction:column;", (0, _global_styling.euiYScroll)(euiThemeContext), ";;label:overflow;"),
32
- wrapper: /*#__PURE__*/(0, _react.css)("display:flex;flex-direction:column;flex-grow:1;", (0, _global_styling.logicalCSS)('overflow-x', 'auto'), ";;label:wrapper;")
33
- },
34
- banner: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSSWithFallback)('overflow-x', 'hidden'), " ", (0, _global_styling.highContrastModeStyles)(euiThemeContext, {
35
- preferred: (0, _global_styling.logicalCSS)('border-bottom', euiTheme.border.thin)
36
- }), ";;label:banner;")
37
- };
38
- };