@elastic/eui 110.0.0 → 111.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.
- package/es/components/avatar/avatar.js +1 -1
- package/es/components/badge/badge.js +1 -1
- package/es/components/badge/beta_badge/beta_badge.js +1 -1
- package/es/components/basic_table/basic_table.js +36 -55
- package/es/components/basic_table/in_memory_table.js +6 -6
- package/es/components/beacon/beacon.styles.js +1 -1
- package/es/components/button/button_display/_button_display_content.js +1 -1
- package/es/components/button/button_empty/button_empty.js +1 -1
- package/es/components/button/button_group/button_group.js +1 -1
- package/es/components/button/button_group/button_group_button.js +1 -1
- package/es/components/button/button_icon/button_icon.js +1 -1
- package/es/components/button/index.js +2 -1
- package/es/components/button/split_button/index.js +10 -0
- package/es/components/button/split_button/split_button.js +120 -0
- package/es/components/button/split_button/split_button.styles.js +51 -0
- package/es/components/button/split_button/split_button_actions.js +115 -0
- package/{optimize/es/components/flyout/flyout_context.js → es/components/button/split_button/split_button_context.js} +5 -7
- package/es/components/call_out/call_out.js +1 -1
- package/es/components/card/card.js +1 -1
- package/es/components/collapsible_nav/collapsible_nav.js +20 -101
- package/es/components/collapsible_nav/collapsible_nav_group/collapsible_nav_group.js +1 -1
- package/es/components/collapsible_nav_beta/_kibana_solution/collapsible_nav_kibana_solution.js +1 -1
- package/es/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +1 -1
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +2 -2
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +2 -2
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +4 -4
- package/es/components/comment_list/comment.js +2 -2
- package/es/components/comment_list/comment_event.js +1 -1
- package/es/components/comment_list/comment_list.js +2 -2
- package/es/components/comment_list/comment_timeline.js +1 -1
- package/es/components/context_menu/context_menu_item.js +1 -1
- package/es/components/datagrid/body/cell/data_grid_cell.js +12 -12
- package/es/components/datagrid/body/data_grid_body.js +7 -7
- package/es/components/datagrid/body/data_grid_body_custom.js +7 -7
- package/es/components/datagrid/body/data_grid_body_virtualized.js +7 -7
- package/es/components/datagrid/body/header/data_grid_header_cell.js +6 -6
- package/es/components/datagrid/controls/column_sorting.js +7 -7
- package/es/components/datagrid/controls/column_sorting_draggable.js +1 -1
- package/es/components/datagrid/controls/data_grid_toolbar_control.js +1 -1
- package/es/components/datagrid/controls/fullscreen_selector.styles.js +1 -1
- package/es/components/datagrid/utils/in_memory.js +6 -6
- package/es/components/date_picker/date_picker.js +2 -2
- package/es/components/date_picker/date_picker_range.js +1 -1
- package/es/components/empty_prompt/empty_prompt.js +2 -2
- package/es/components/flex/flex_group.js +1 -1
- package/es/components/flyout/_flyout_overlay.js +52 -0
- package/es/components/flyout/_flyout_resize_button.js +32 -0
- package/es/components/flyout/{flyout_resizable.styles.js → _flyout_resize_button.styles.js} +11 -11
- package/es/components/flyout/const.js +42 -0
- package/es/components/flyout/flyout.component.js +481 -0
- package/es/components/flyout/flyout.js +77 -379
- package/es/components/flyout/flyout.styles.js +106 -7
- package/es/components/flyout/flyout_menu.js +241 -0
- package/es/components/flyout/flyout_menu.styles.js +19 -0
- package/es/components/flyout/{flyout_context.js → flyout_menu_context.js} +1 -7
- package/es/components/flyout/flyout_parent_context.js +36 -0
- package/es/components/flyout/flyout_resizable.js +33 -144
- package/es/components/flyout/hooks.js +25 -0
- package/es/components/flyout/index.js +5 -2
- package/es/components/flyout/manager/actions.js +153 -0
- package/es/components/flyout/manager/activity_stage.js +95 -0
- package/es/components/flyout/manager/const.js +56 -0
- package/es/components/flyout/manager/context.js +33 -0
- package/es/components/flyout/manager/flyout_child.js +75 -0
- package/es/components/flyout/manager/flyout_main.js +65 -0
- package/es/components/flyout/manager/flyout_main.styles.js +25 -0
- package/es/components/flyout/manager/flyout_managed.js +227 -0
- package/es/components/flyout/manager/flyout_managed.styles.js +69 -0
- package/es/components/flyout/manager/hooks.js +55 -0
- package/es/components/flyout/manager/index.js +31 -0
- package/es/components/flyout/manager/layout_mode.js +167 -0
- package/es/components/flyout/manager/provider.js +57 -0
- package/es/components/flyout/manager/reducer.js +320 -0
- package/es/components/flyout/manager/selectors.js +116 -0
- package/es/components/flyout/manager/store.js +113 -0
- package/es/components/flyout/manager/validation.js +85 -0
- package/es/components/flyout/use_flyout_resizable.js +149 -0
- package/es/components/flyout/use_flyout_z_index.js +46 -0
- package/es/components/form/field_number/field_number.js +2 -2
- package/es/components/form/field_text/field_text.js +2 -2
- package/es/components/form/form_control_button/form_control_button.js +1 -1
- package/es/components/form/form_control_layout/form_control_layout.js +2 -2
- package/es/components/form/form_control_layout/form_control_layout_custom_icon.js +1 -1
- package/es/components/form/form_control_layout/form_control_layout_icons.js +2 -2
- package/es/components/form/text_area/text_area.js +2 -2
- package/es/components/header/header_links/header_link.js +1 -1
- package/es/components/header/header_links/header_links.js +1 -1
- package/es/components/header/header_logo/header_logo.js +1 -1
- package/es/components/header/header_section/header_section_item_button.js +1 -1
- package/es/components/horizontal_rule/horizontal_rule.js +1 -1
- package/es/components/icon/assets/agentBuilderRobot.js +37 -0
- package/es/components/icon/assets/cross_project_search.js +35 -0
- package/es/components/icon/assets/dashed_circle.js +35 -0
- package/es/components/icon/assets/product_robot.js +37 -0
- package/es/components/icon/icon.js +1 -1
- package/es/components/icon/icon_map.js +3 -0
- package/es/components/key_pad_menu/key_pad_menu_item.js +1 -1
- package/es/components/link/external_link_icon.js +6 -3
- package/es/components/list_group/list_group.js +2 -2
- package/es/components/list_group/list_group_item.js +2 -2
- package/es/components/list_group/list_group_item_extra_action.js +1 -1
- package/es/components/list_group/pinnable_list_group/pinnable_list_group.js +4 -4
- package/es/components/loading/loading_logo.js +1 -1
- package/es/components/markdown_editor/markdown_editor.js +1 -1
- package/es/components/markdown_editor/markdown_editor_drop_zone.js +1 -1
- package/es/components/markdown_editor/markdown_editor_footer.js +1 -1
- package/es/components/markdown_editor/markdown_editor_toolbar.js +1 -1
- package/es/components/overlay_mask/overlay_mask.js +13 -3
- package/es/components/overlay_mask/overlay_mask.styles.js +11 -2
- package/es/components/page/page_header/page_header_content.js +2 -2
- package/es/components/pagination/pagination_button.js +1 -1
- package/es/components/provider/provider.js +2 -1
- package/es/components/search_bar/search_bar.js +1 -1
- package/es/components/selectable/selectable_list/selectable_list.js +1 -1
- package/es/components/selectable/selectable_list/selectable_list_item.js +1 -1
- package/es/components/selectable/selectable_templates/selectable_template_sitewide.js +1 -1
- package/es/components/spacer/spacer.js +1 -1
- package/es/components/table/table_header_cell.js +1 -1
- package/es/components/timeline/timeline_item_icon.js +1 -1
- package/es/components/toast/global_toast_list.js +1 -1
- package/es/components/toast/toast.js +1 -1
- package/es/components/tool_tip/icon_tip.js +1 -1
- package/es/components/tour/tour_step_indicator.js +8 -3
- package/es/global_styling/mixins/_button.js +28 -9
- package/es/global_styling/mixins/_container_query.js +106 -0
- package/es/global_styling/mixins/index.js +1 -0
- package/es/services/container_query/container_query_hook.js +64 -0
- package/es/{components/flyout/sessions → services/container_query}/index.js +1 -2
- package/es/services/container_query/match_container.js +242 -0
- package/eui.d.ts +7558 -6642
- package/i18ntokens.json +1438 -1384
- package/lib/components/avatar/avatar.js +1 -1
- package/lib/components/badge/badge.js +1 -1
- package/lib/components/badge/beta_badge/beta_badge.js +1 -1
- package/lib/components/basic_table/basic_table.js +36 -55
- package/lib/components/basic_table/in_memory_table.js +6 -6
- package/lib/components/beacon/beacon.styles.js +1 -1
- package/lib/components/button/button_display/_button_display_content.js +1 -1
- package/lib/components/button/button_empty/button_empty.js +1 -1
- package/lib/components/button/button_group/button_group.js +1 -1
- package/lib/components/button/button_group/button_group_button.js +1 -1
- package/lib/components/button/button_icon/button_icon.js +1 -1
- package/lib/components/button/index.js +8 -1
- package/lib/components/button/split_button/index.js +25 -0
- package/lib/components/button/split_button/split_button.js +129 -0
- package/lib/components/button/split_button/split_button.styles.js +55 -0
- package/lib/components/button/split_button/split_button_actions.js +123 -0
- package/{optimize/lib/components/flyout/flyout_context.js → lib/components/button/split_button/split_button_context.js} +6 -7
- package/lib/components/call_out/call_out.js +1 -1
- package/lib/components/card/card.js +1 -1
- package/lib/components/collapsible_nav/collapsible_nav.js +20 -101
- package/lib/components/collapsible_nav/collapsible_nav_group/collapsible_nav_group.js +1 -1
- package/lib/components/collapsible_nav_beta/_kibana_solution/collapsible_nav_kibana_solution.js +1 -1
- package/lib/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +1 -1
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +2 -2
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +2 -2
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +4 -4
- package/lib/components/comment_list/comment.js +2 -2
- package/lib/components/comment_list/comment_event.js +1 -1
- package/lib/components/comment_list/comment_list.js +2 -2
- package/lib/components/comment_list/comment_timeline.js +1 -1
- package/lib/components/context_menu/context_menu_item.js +1 -1
- package/lib/components/datagrid/body/cell/data_grid_cell.js +12 -12
- package/lib/components/datagrid/body/data_grid_body.js +7 -7
- package/lib/components/datagrid/body/data_grid_body_custom.js +7 -7
- package/lib/components/datagrid/body/data_grid_body_virtualized.js +7 -7
- package/lib/components/datagrid/body/header/data_grid_header_cell.js +6 -6
- package/lib/components/datagrid/controls/column_sorting.js +7 -7
- package/lib/components/datagrid/controls/column_sorting_draggable.js +1 -1
- package/lib/components/datagrid/controls/data_grid_toolbar_control.js +1 -1
- package/lib/components/datagrid/controls/fullscreen_selector.styles.js +1 -1
- package/lib/components/datagrid/utils/in_memory.js +6 -6
- package/lib/components/date_picker/date_picker.js +2 -2
- package/lib/components/date_picker/date_picker_range.js +1 -1
- package/lib/components/empty_prompt/empty_prompt.js +2 -2
- package/lib/components/flex/flex_group.js +1 -1
- package/lib/components/flyout/_flyout_overlay.js +59 -0
- package/lib/components/flyout/_flyout_resize_button.js +38 -0
- package/{test-env/components/flyout/flyout_resizable.styles.js → lib/components/flyout/_flyout_resize_button.styles.js} +12 -12
- package/lib/components/flyout/const.js +49 -0
- package/lib/components/flyout/flyout.component.js +488 -0
- package/lib/components/flyout/flyout.js +102 -379
- package/lib/components/flyout/flyout.styles.js +106 -7
- package/lib/components/flyout/flyout_menu.js +243 -0
- package/lib/components/flyout/flyout_menu.styles.js +25 -0
- package/lib/components/flyout/{flyout_context.js → flyout_menu_context.js} +2 -7
- package/lib/components/flyout/flyout_parent_context.js +43 -0
- package/lib/components/flyout/flyout_resizable.js +36 -147
- package/lib/components/flyout/hooks.js +30 -0
- package/lib/components/flyout/index.js +21 -14
- package/lib/components/flyout/manager/actions.js +159 -0
- package/lib/components/flyout/manager/activity_stage.js +101 -0
- package/lib/components/flyout/manager/const.js +62 -0
- package/lib/components/flyout/manager/context.js +41 -0
- package/lib/components/flyout/manager/flyout_child.js +80 -0
- package/lib/components/flyout/manager/flyout_main.js +70 -0
- package/lib/components/flyout/manager/flyout_main.styles.js +31 -0
- package/lib/components/flyout/manager/flyout_managed.js +233 -0
- package/lib/components/flyout/manager/flyout_managed.styles.js +73 -0
- package/lib/components/flyout/manager/hooks.js +131 -0
- package/lib/components/flyout/manager/index.js +168 -0
- package/lib/components/flyout/manager/layout_mode.js +171 -0
- package/lib/components/flyout/manager/provider.js +63 -0
- package/lib/components/flyout/manager/reducer.js +325 -0
- package/lib/components/flyout/manager/selectors.js +122 -0
- package/lib/components/flyout/manager/store.js +120 -0
- package/lib/components/flyout/manager/validation.js +94 -0
- package/lib/components/flyout/use_flyout_resizable.js +153 -0
- package/lib/components/flyout/use_flyout_z_index.js +51 -0
- package/lib/components/form/field_number/field_number.js +2 -2
- package/lib/components/form/field_text/field_text.js +2 -2
- package/lib/components/form/form_control_button/form_control_button.js +1 -1
- package/lib/components/form/form_control_layout/form_control_layout.js +2 -2
- package/lib/components/form/form_control_layout/form_control_layout_custom_icon.js +1 -1
- package/lib/components/form/form_control_layout/form_control_layout_icons.js +2 -2
- package/lib/components/form/text_area/text_area.js +2 -2
- package/lib/components/header/header_links/header_link.js +1 -1
- package/lib/components/header/header_links/header_links.js +1 -1
- package/lib/components/header/header_logo/header_logo.js +1 -1
- package/lib/components/header/header_section/header_section_item_button.js +1 -1
- package/lib/components/horizontal_rule/horizontal_rule.js +1 -1
- package/lib/components/icon/assets/agentBuilderRobot.js +44 -0
- package/lib/components/icon/assets/cross_project_search.js +42 -0
- package/lib/components/icon/assets/dashed_circle.js +42 -0
- package/lib/components/icon/assets/product_robot.js +44 -0
- package/lib/components/icon/icon.js +1 -1
- package/lib/components/icon/icon_map.js +3 -0
- package/lib/components/icon/svgs/cross_project_search.svg +3 -0
- package/lib/components/icon/svgs/dashed_circle.svg +5 -0
- package/lib/components/icon/svgs/product_robot.svg +4 -0
- package/lib/components/key_pad_menu/key_pad_menu_item.js +1 -1
- package/lib/components/link/external_link_icon.js +6 -3
- package/lib/components/list_group/list_group.js +2 -2
- package/lib/components/list_group/list_group_item.js +2 -2
- package/lib/components/list_group/list_group_item_extra_action.js +1 -1
- package/lib/components/list_group/pinnable_list_group/pinnable_list_group.js +4 -4
- package/lib/components/loading/loading_logo.js +1 -1
- package/lib/components/markdown_editor/markdown_editor.js +1 -1
- package/lib/components/markdown_editor/markdown_editor_drop_zone.js +1 -1
- package/lib/components/markdown_editor/markdown_editor_footer.js +1 -1
- package/lib/components/markdown_editor/markdown_editor_toolbar.js +1 -1
- package/lib/components/overlay_mask/overlay_mask.js +12 -2
- package/lib/components/overlay_mask/overlay_mask.styles.js +11 -4
- package/lib/components/page/page_header/page_header_content.js +2 -2
- package/lib/components/pagination/pagination_button.js +1 -1
- package/lib/components/provider/provider.js +2 -1
- package/lib/components/search_bar/search_bar.js +1 -1
- package/lib/components/selectable/selectable_list/selectable_list.js +1 -1
- package/lib/components/selectable/selectable_list/selectable_list_item.js +1 -1
- package/lib/components/selectable/selectable_templates/selectable_template_sitewide.js +1 -1
- package/lib/components/spacer/spacer.js +1 -1
- package/lib/components/table/table_header_cell.js +1 -1
- package/lib/components/timeline/timeline_item_icon.js +1 -1
- package/lib/components/toast/global_toast_list.js +1 -1
- package/lib/components/toast/toast.js +1 -1
- package/lib/components/tool_tip/icon_tip.js +1 -1
- package/lib/components/tour/tour_step_indicator.js +8 -3
- package/lib/global_styling/mixins/_button.js +29 -10
- package/lib/global_styling/mixins/_container_query.js +112 -0
- package/lib/global_styling/mixins/index.js +11 -0
- package/lib/services/container_query/container_query_hook.js +67 -0
- package/lib/services/container_query/index.js +16 -0
- package/lib/services/container_query/match_container.js +243 -0
- package/optimize/es/components/basic_table/basic_table.js +30 -49
- package/optimize/es/components/beacon/beacon.styles.js +1 -1
- package/optimize/es/components/button/index.js +2 -1
- package/optimize/es/components/button/split_button/index.js +10 -0
- package/optimize/es/components/button/split_button/split_button.js +98 -0
- package/optimize/es/components/button/split_button/split_button.styles.js +51 -0
- package/optimize/es/components/button/split_button/split_button_actions.js +89 -0
- package/optimize/es/components/button/split_button/split_button_context.js +14 -0
- package/optimize/es/components/collapsible_nav/collapsible_nav.js +1 -0
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
- package/optimize/es/components/datagrid/controls/fullscreen_selector.styles.js +1 -1
- package/optimize/es/components/empty_prompt/empty_prompt.js +1 -1
- package/optimize/es/components/flex/flex_group.js +1 -1
- package/optimize/es/components/flyout/_flyout_overlay.js +52 -0
- package/optimize/es/components/flyout/_flyout_resize_button.js +31 -0
- package/optimize/es/components/flyout/{flyout_resizable.styles.js → _flyout_resize_button.styles.js} +11 -11
- package/optimize/es/components/flyout/const.js +42 -0
- package/optimize/es/components/flyout/flyout.component.js +469 -0
- package/optimize/es/components/flyout/flyout.js +53 -349
- package/optimize/es/components/flyout/flyout.styles.js +103 -7
- package/optimize/es/components/flyout/flyout_menu.js +162 -0
- package/optimize/es/components/flyout/flyout_menu.styles.js +19 -0
- package/optimize/es/components/flyout/flyout_menu_context.js +10 -0
- package/optimize/es/components/flyout/flyout_parent_context.js +36 -0
- package/optimize/es/components/flyout/flyout_resizable.js +7 -138
- package/optimize/es/components/flyout/hooks.js +25 -0
- package/optimize/es/components/flyout/index.js +5 -2
- package/optimize/es/components/flyout/manager/actions.js +153 -0
- package/optimize/es/components/flyout/manager/activity_stage.js +95 -0
- package/optimize/es/components/flyout/manager/const.js +56 -0
- package/optimize/es/components/flyout/manager/context.js +33 -0
- package/optimize/es/components/flyout/manager/flyout_child.js +71 -0
- package/optimize/es/components/flyout/manager/flyout_main.js +61 -0
- package/optimize/es/components/flyout/manager/flyout_main.styles.js +25 -0
- package/optimize/es/components/flyout/manager/flyout_managed.js +223 -0
- package/optimize/es/components/flyout/manager/flyout_managed.styles.js +69 -0
- package/optimize/es/components/flyout/manager/hooks.js +55 -0
- package/optimize/es/components/flyout/manager/index.js +31 -0
- package/optimize/es/components/flyout/manager/layout_mode.js +162 -0
- package/optimize/es/components/flyout/manager/provider.js +53 -0
- package/optimize/es/components/flyout/manager/reducer.js +312 -0
- package/optimize/es/components/flyout/manager/selectors.js +116 -0
- package/optimize/es/components/flyout/manager/store.js +113 -0
- package/optimize/es/components/flyout/manager/types.js +1 -0
- package/optimize/es/components/flyout/manager/validation.js +85 -0
- package/optimize/es/components/flyout/types.js +1 -0
- package/optimize/es/components/flyout/use_flyout_resizable.js +144 -0
- package/optimize/es/components/flyout/use_flyout_z_index.js +46 -0
- package/optimize/es/components/horizontal_rule/horizontal_rule.js +1 -1
- package/optimize/es/components/icon/assets/agentBuilderRobot.js +36 -0
- package/optimize/es/components/icon/assets/cross_project_search.js +34 -0
- package/optimize/es/components/icon/assets/dashed_circle.js +34 -0
- package/optimize/es/components/icon/assets/product_robot.js +36 -0
- package/optimize/es/components/icon/icon_map.js +3 -0
- package/optimize/es/components/link/external_link_icon.js +6 -3
- package/optimize/es/components/overlay_mask/overlay_mask.js +13 -3
- package/optimize/es/components/overlay_mask/overlay_mask.styles.js +11 -2
- package/optimize/es/components/page/page_header/page_header_content.js +1 -1
- package/optimize/es/components/provider/provider.js +2 -1
- package/optimize/es/components/search_bar/search_bar.js +1 -1
- package/optimize/es/components/spacer/spacer.js +1 -1
- package/optimize/es/components/tour/tour_step_indicator.js +8 -3
- package/optimize/es/global_styling/mixins/_button.js +28 -9
- package/optimize/es/global_styling/mixins/_container_query.js +106 -0
- package/optimize/es/global_styling/mixins/index.js +1 -0
- package/optimize/es/services/container_query/container_query_hook.js +59 -0
- package/optimize/es/{components/flyout/sessions → services/container_query}/index.js +1 -2
- package/optimize/es/services/container_query/match_container.js +229 -0
- package/optimize/lib/components/basic_table/basic_table.js +30 -49
- package/optimize/lib/components/beacon/beacon.styles.js +1 -1
- package/optimize/lib/components/button/index.js +8 -1
- package/optimize/lib/components/button/split_button/index.js +25 -0
- package/optimize/lib/components/button/split_button/split_button.js +107 -0
- package/optimize/lib/components/button/split_button/split_button.styles.js +55 -0
- package/optimize/lib/components/button/split_button/split_button_actions.js +98 -0
- package/{test-env/components/flyout/flyout_context.js → optimize/lib/components/button/split_button/split_button_context.js} +6 -7
- package/optimize/lib/components/collapsible_nav/collapsible_nav.js +1 -0
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
- package/optimize/lib/components/datagrid/controls/fullscreen_selector.styles.js +1 -1
- package/optimize/lib/components/empty_prompt/empty_prompt.js +1 -1
- package/optimize/lib/components/flex/flex_group.js +1 -1
- package/optimize/lib/components/flyout/_flyout_overlay.js +62 -0
- package/optimize/lib/components/flyout/_flyout_resize_button.js +37 -0
- package/{lib/components/flyout/flyout_resizable.styles.js → optimize/lib/components/flyout/_flyout_resize_button.styles.js} +12 -12
- package/optimize/lib/components/flyout/const.js +49 -0
- package/optimize/lib/components/flyout/flyout.component.js +477 -0
- package/optimize/lib/components/flyout/flyout.js +77 -349
- package/optimize/lib/components/flyout/flyout.styles.js +103 -7
- package/optimize/lib/components/flyout/flyout_menu.js +168 -0
- package/optimize/lib/components/flyout/flyout_menu.styles.js +25 -0
- package/optimize/lib/components/flyout/flyout_menu_context.js +16 -0
- package/optimize/lib/components/flyout/flyout_parent_context.js +43 -0
- package/optimize/lib/components/flyout/flyout_resizable.js +9 -139
- package/optimize/lib/components/flyout/hooks.js +30 -0
- package/optimize/lib/components/flyout/index.js +21 -14
- package/optimize/lib/components/flyout/manager/actions.js +159 -0
- package/optimize/lib/components/flyout/manager/activity_stage.js +101 -0
- package/optimize/lib/components/flyout/manager/const.js +62 -0
- package/optimize/lib/components/flyout/manager/context.js +41 -0
- package/optimize/lib/components/flyout/manager/flyout_child.js +76 -0
- package/optimize/lib/components/flyout/manager/flyout_main.js +66 -0
- package/optimize/lib/components/flyout/manager/flyout_main.styles.js +31 -0
- package/optimize/lib/components/flyout/manager/flyout_managed.js +231 -0
- package/optimize/lib/components/flyout/manager/flyout_managed.styles.js +74 -0
- package/optimize/lib/components/flyout/manager/hooks.js +131 -0
- package/optimize/lib/components/flyout/manager/index.js +168 -0
- package/optimize/lib/components/flyout/manager/layout_mode.js +169 -0
- package/optimize/lib/components/flyout/manager/provider.js +61 -0
- package/optimize/lib/components/flyout/manager/reducer.js +318 -0
- package/optimize/lib/components/flyout/manager/selectors.js +122 -0
- package/optimize/lib/components/flyout/manager/store.js +120 -0
- package/optimize/lib/components/flyout/manager/validation.js +94 -0
- package/optimize/lib/components/flyout/types.js +5 -0
- package/optimize/lib/components/flyout/use_flyout_resizable.js +151 -0
- package/optimize/lib/components/flyout/use_flyout_z_index.js +51 -0
- package/optimize/lib/components/horizontal_rule/horizontal_rule.js +1 -1
- package/optimize/lib/components/icon/assets/agentBuilderRobot.js +44 -0
- package/optimize/lib/components/icon/assets/cross_project_search.js +42 -0
- package/optimize/lib/components/icon/assets/dashed_circle.js +42 -0
- package/optimize/lib/components/icon/assets/product_robot.js +44 -0
- package/optimize/lib/components/icon/icon_map.js +3 -0
- package/optimize/lib/components/icon/svgs/cross_project_search.svg +3 -0
- package/optimize/lib/components/icon/svgs/dashed_circle.svg +5 -0
- package/optimize/lib/components/icon/svgs/product_robot.svg +4 -0
- package/optimize/lib/components/link/external_link_icon.js +6 -3
- package/optimize/lib/components/overlay_mask/overlay_mask.js +12 -2
- package/optimize/lib/components/overlay_mask/overlay_mask.styles.js +11 -4
- package/optimize/lib/components/page/page_header/page_header_content.js +1 -1
- package/optimize/lib/components/provider/provider.js +2 -1
- package/optimize/lib/components/search_bar/search_bar.js +1 -1
- package/optimize/lib/components/spacer/spacer.js +1 -1
- package/optimize/lib/components/tour/tour_step_indicator.js +8 -3
- package/optimize/lib/global_styling/mixins/_button.js +29 -10
- package/optimize/lib/global_styling/mixins/_container_query.js +112 -0
- package/optimize/lib/global_styling/mixins/index.js +11 -0
- package/optimize/lib/services/container_query/container_query_hook.js +65 -0
- package/optimize/lib/services/container_query/index.js +16 -0
- package/optimize/lib/services/container_query/match_container.js +231 -0
- package/package.json +5 -4
- package/test-env/components/avatar/avatar.js +1 -1
- package/test-env/components/badge/badge.js +1 -1
- package/test-env/components/badge/beta_badge/beta_badge.js +1 -1
- package/test-env/components/basic_table/basic_table.js +36 -55
- package/test-env/components/basic_table/in_memory_table.js +6 -6
- package/test-env/components/beacon/beacon.styles.js +1 -1
- package/test-env/components/button/button_display/_button_display_content.js +1 -1
- package/test-env/components/button/button_empty/button_empty.js +1 -1
- package/test-env/components/button/button_group/button_group.js +1 -1
- package/test-env/components/button/button_group/button_group_button.js +1 -1
- package/test-env/components/button/button_icon/button_icon.js +1 -1
- package/test-env/components/button/index.js +8 -1
- package/test-env/components/button/split_button/index.js +25 -0
- package/test-env/components/button/split_button/split_button.js +123 -0
- package/test-env/components/button/split_button/split_button.styles.js +55 -0
- package/test-env/components/button/split_button/split_button_actions.js +120 -0
- package/test-env/components/button/split_button/split_button_context.js +20 -0
- package/test-env/components/call_out/call_out.js +1 -1
- package/test-env/components/card/card.js +1 -1
- package/test-env/components/collapsible_nav/collapsible_nav.js +20 -101
- package/test-env/components/collapsible_nav/collapsible_nav_group/collapsible_nav_group.js +1 -1
- package/test-env/components/collapsible_nav_beta/_kibana_solution/collapsible_nav_kibana_solution.js +1 -1
- package/test-env/components/collapsible_nav_beta/collapsible_nav_beta.js +1 -0
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +1 -1
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +2 -2
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +2 -2
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +4 -4
- package/test-env/components/comment_list/comment.js +2 -2
- package/test-env/components/comment_list/comment_event.js +1 -1
- package/test-env/components/comment_list/comment_list.js +2 -2
- package/test-env/components/comment_list/comment_timeline.js +1 -1
- package/test-env/components/context_menu/context_menu_item.js +1 -1
- package/test-env/components/datagrid/body/cell/data_grid_cell.js +12 -12
- package/test-env/components/datagrid/body/data_grid_body.js +7 -7
- package/test-env/components/datagrid/body/data_grid_body_custom.js +7 -7
- package/test-env/components/datagrid/body/data_grid_body_virtualized.js +7 -7
- package/test-env/components/datagrid/body/header/data_grid_header_cell.js +6 -6
- package/test-env/components/datagrid/controls/column_sorting.js +7 -7
- package/test-env/components/datagrid/controls/column_sorting_draggable.js +1 -1
- package/test-env/components/datagrid/controls/data_grid_toolbar_control.js +1 -1
- package/test-env/components/datagrid/controls/fullscreen_selector.styles.js +1 -1
- package/test-env/components/datagrid/utils/in_memory.js +6 -6
- package/test-env/components/date_picker/date_picker.js +2 -2
- package/test-env/components/date_picker/date_picker_range.js +1 -1
- package/test-env/components/empty_prompt/empty_prompt.js +2 -2
- package/test-env/components/flex/flex_group.js +1 -1
- package/test-env/components/flyout/_flyout_overlay.js +62 -0
- package/test-env/components/flyout/_flyout_resize_button.js +37 -0
- package/{optimize/lib/components/flyout/flyout_resizable.styles.js → test-env/components/flyout/_flyout_resize_button.styles.js} +12 -12
- package/test-env/components/flyout/const.js +49 -0
- package/test-env/components/flyout/flyout.component.js +477 -0
- package/test-env/components/flyout/flyout.styles.js +103 -7
- package/test-env/components/flyout/flyout_menu.js +241 -0
- package/test-env/components/flyout/flyout_menu.styles.js +25 -0
- package/test-env/components/flyout/flyout_menu_context.js +16 -0
- package/test-env/components/flyout/flyout_parent_context.js +43 -0
- package/test-env/components/flyout/flyout_resizable.js +35 -139
- package/test-env/components/flyout/hooks.js +30 -0
- package/test-env/components/flyout/index.js +21 -14
- package/test-env/components/flyout/manager/actions.js +159 -0
- package/test-env/components/flyout/manager/activity_stage.js +101 -0
- package/test-env/components/flyout/manager/const.js +62 -0
- package/test-env/components/flyout/manager/context.js +41 -0
- package/test-env/components/flyout/manager/flyout_child.js +76 -0
- package/test-env/components/flyout/manager/flyout_main.js +66 -0
- package/test-env/components/flyout/manager/flyout_main.styles.js +31 -0
- package/test-env/components/flyout/manager/flyout_managed.js +231 -0
- package/test-env/components/flyout/manager/flyout_managed.styles.js +74 -0
- package/test-env/components/flyout/manager/hooks.js +131 -0
- package/test-env/components/flyout/manager/index.js +168 -0
- package/test-env/components/flyout/manager/layout_mode.js +169 -0
- package/test-env/components/flyout/manager/provider.js +61 -0
- package/test-env/components/flyout/manager/reducer.js +318 -0
- package/test-env/components/flyout/manager/selectors.js +122 -0
- package/test-env/components/flyout/manager/store.js +120 -0
- package/test-env/components/flyout/manager/types.js +5 -0
- package/test-env/components/flyout/manager/validation.js +94 -0
- package/test-env/components/flyout/types.js +5 -0
- package/test-env/components/flyout/use_flyout_resizable.js +151 -0
- package/test-env/components/flyout/use_flyout_z_index.js +51 -0
- package/test-env/components/form/field_number/field_number.js +2 -2
- package/test-env/components/form/field_text/field_text.js +2 -2
- package/test-env/components/form/form_control_button/form_control_button.js +1 -1
- package/test-env/components/form/form_control_layout/form_control_layout.js +2 -2
- package/test-env/components/form/form_control_layout/form_control_layout_custom_icon.js +1 -1
- package/test-env/components/form/form_control_layout/form_control_layout_icons.js +2 -2
- package/test-env/components/form/text_area/text_area.js +2 -2
- package/test-env/components/header/header_links/header_link.js +1 -1
- package/test-env/components/header/header_links/header_links.js +1 -1
- package/test-env/components/header/header_logo/header_logo.js +1 -1
- package/test-env/components/header/header_section/header_section_item_button.js +1 -1
- package/test-env/components/horizontal_rule/horizontal_rule.js +1 -1
- package/test-env/components/icon/assets/agentBuilderRobot.js +44 -0
- package/test-env/components/icon/assets/cross_project_search.js +42 -0
- package/test-env/components/icon/assets/dashed_circle.js +42 -0
- package/test-env/components/icon/assets/product_robot.js +44 -0
- package/test-env/components/icon/icon_map.js +3 -0
- package/test-env/components/key_pad_menu/key_pad_menu_item.js +1 -1
- package/test-env/components/link/external_link_icon.js +6 -3
- package/test-env/components/list_group/list_group.js +2 -2
- package/test-env/components/list_group/list_group_item.js +2 -2
- package/test-env/components/list_group/list_group_item_extra_action.js +1 -1
- package/test-env/components/list_group/pinnable_list_group/pinnable_list_group.js +4 -4
- package/test-env/components/loading/loading_logo.js +1 -1
- package/test-env/components/markdown_editor/markdown_editor.js +1 -1
- package/test-env/components/markdown_editor/markdown_editor_drop_zone.js +1 -1
- package/test-env/components/markdown_editor/markdown_editor_footer.js +1 -1
- package/test-env/components/markdown_editor/markdown_editor_toolbar.js +1 -1
- package/test-env/components/overlay_mask/overlay_mask.js +12 -2
- package/test-env/components/overlay_mask/overlay_mask.styles.js +11 -4
- package/test-env/components/page/page_header/page_header_content.js +2 -2
- package/test-env/components/pagination/pagination_button.js +1 -1
- package/test-env/components/provider/provider.js +2 -1
- package/test-env/components/search_bar/search_bar.js +1 -1
- package/test-env/components/selectable/selectable_list/selectable_list.js +1 -1
- package/test-env/components/selectable/selectable_list/selectable_list_item.js +1 -1
- package/test-env/components/selectable/selectable_templates/selectable_template_sitewide.js +1 -1
- package/test-env/components/spacer/spacer.js +1 -1
- package/test-env/components/table/table_header_cell.js +1 -1
- package/test-env/components/timeline/timeline_item_icon.js +1 -1
- package/test-env/components/toast/global_toast_list.js +1 -1
- package/test-env/components/toast/toast.js +1 -1
- package/test-env/components/tool_tip/icon_tip.js +1 -1
- package/test-env/components/tour/tour_step_indicator.js +8 -3
- package/test-env/global_styling/mixins/_button.js +29 -10
- package/test-env/global_styling/mixins/_container_query.js +112 -0
- package/test-env/global_styling/mixins/index.js +11 -0
- package/test-env/services/container_query/container_query_hook.js +65 -0
- package/test-env/services/container_query/index.js +16 -0
- package/test-env/services/container_query/match_container.js +231 -0
- package/es/components/flyout/flyout_child.js +0 -223
- package/es/components/flyout/flyout_child.styles.js +0 -32
- package/es/components/flyout/flyout_child_manager.js +0 -114
- package/es/components/flyout/sessions/flyout_provider.js +0 -95
- package/es/components/flyout/sessions/flyout_reducer.js +0 -195
- package/es/components/flyout/sessions/use_eui_flyout.js +0 -82
- package/lib/components/flyout/flyout_child.js +0 -231
- package/lib/components/flyout/flyout_child.styles.js +0 -38
- package/lib/components/flyout/flyout_child_manager.js +0 -122
- package/lib/components/flyout/sessions/flyout_provider.js +0 -102
- package/lib/components/flyout/sessions/flyout_reducer.js +0 -202
- package/lib/components/flyout/sessions/index.js +0 -25
- package/lib/components/flyout/sessions/use_eui_flyout.js +0 -88
- package/optimize/es/components/flyout/flyout_child.js +0 -178
- package/optimize/es/components/flyout/flyout_child.styles.js +0 -32
- package/optimize/es/components/flyout/flyout_child_manager.js +0 -100
- package/optimize/es/components/flyout/sessions/flyout_provider.js +0 -90
- package/optimize/es/components/flyout/sessions/flyout_reducer.js +0 -187
- package/optimize/es/components/flyout/sessions/use_eui_flyout.js +0 -82
- package/optimize/lib/components/flyout/flyout_child.js +0 -186
- package/optimize/lib/components/flyout/flyout_child.styles.js +0 -38
- package/optimize/lib/components/flyout/flyout_child_manager.js +0 -110
- package/optimize/lib/components/flyout/sessions/flyout_provider.js +0 -100
- package/optimize/lib/components/flyout/sessions/flyout_reducer.js +0 -195
- package/optimize/lib/components/flyout/sessions/index.js +0 -25
- package/optimize/lib/components/flyout/sessions/use_eui_flyout.js +0 -88
- package/test-env/components/flyout/flyout_child.js +0 -230
- package/test-env/components/flyout/flyout_child.styles.js +0 -38
- package/test-env/components/flyout/flyout_child_manager.js +0 -119
- package/test-env/components/flyout/sessions/flyout_provider.js +0 -100
- package/test-env/components/flyout/sessions/flyout_reducer.js +0 -195
- package/test-env/components/flyout/sessions/index.js +0 -25
- package/test-env/components/flyout/sessions/use_eui_flyout.js +0 -88
- /package/es/components/flyout/{sessions → manager}/types.js +0 -0
- /package/{optimize/es/components/flyout/sessions → es/components/flyout}/types.js +0 -0
- /package/lib/components/flyout/{sessions → manager}/types.js +0 -0
- /package/{optimize/lib/components/flyout/sessions → lib/components/flyout}/types.js +0 -0
- /package/{test-env/components/flyout/sessions → optimize/lib/components/flyout/manager}/types.js +0 -0
|
@@ -1,202 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.flyoutReducer = flyoutReducer;
|
|
7
|
-
exports.initialFlyoutState = void 0;
|
|
8
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
9
|
-
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
|
|
10
|
-
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
11
|
-
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
12
|
-
function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
|
|
13
|
-
function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
|
|
14
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
15
|
-
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; }
|
|
16
|
-
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) { _defineProperty(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; }
|
|
17
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
18
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
19
|
-
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
20
|
-
/*
|
|
21
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
22
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
23
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
24
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
25
|
-
* Side Public License, v 1.
|
|
26
|
-
*/
|
|
27
|
-
|
|
28
|
-
/**
|
|
29
|
-
* Initial state for the flyout session
|
|
30
|
-
* @internal
|
|
31
|
-
*/
|
|
32
|
-
var initialFlyoutState = exports.initialFlyoutState = {
|
|
33
|
-
activeFlyoutGroup: null,
|
|
34
|
-
history: []
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
// Helper to apply size constraints for flyout groups
|
|
38
|
-
var applySizeConstraints = function applySizeConstraints(group) {
|
|
39
|
-
var originalMainSize = group.config.mainSize;
|
|
40
|
-
var originalChildSize = group.config.childSize;
|
|
41
|
-
var newMainSize = originalMainSize;
|
|
42
|
-
var newChildSize = originalChildSize;
|
|
43
|
-
if (group.isChildOpen) {
|
|
44
|
-
if (originalMainSize === 'l') {
|
|
45
|
-
newMainSize = 'm'; // If main is 'l' with child, it must be converted to 'm'
|
|
46
|
-
newChildSize = 's'; // And child must be 's'
|
|
47
|
-
} else if (originalMainSize === 'm' && originalChildSize !== 's') {
|
|
48
|
-
newChildSize = 's'; // If main is 'm' with child, child must be 's'
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
// If sizes haven't changed, return the original group to preserve references
|
|
53
|
-
if (newMainSize === originalMainSize && newChildSize === originalChildSize) {
|
|
54
|
-
return group;
|
|
55
|
-
}
|
|
56
|
-
return _objectSpread(_objectSpread({}, group), {}, {
|
|
57
|
-
config: _objectSpread(_objectSpread({}, group.config), {}, {
|
|
58
|
-
mainSize: newMainSize,
|
|
59
|
-
childSize: newChildSize
|
|
60
|
-
})
|
|
61
|
-
});
|
|
62
|
-
};
|
|
63
|
-
|
|
64
|
-
/**
|
|
65
|
-
* Flyout reducer
|
|
66
|
-
* Controls state changes for flyout groups
|
|
67
|
-
*/
|
|
68
|
-
function flyoutReducer(state, action) {
|
|
69
|
-
switch (action.type) {
|
|
70
|
-
case 'OPEN_MAIN_FLYOUT':
|
|
71
|
-
{
|
|
72
|
-
var _action$payload = action.payload,
|
|
73
|
-
size = _action$payload.size,
|
|
74
|
-
flyoutProps = _action$payload.flyoutProps,
|
|
75
|
-
meta = _action$payload.meta;
|
|
76
|
-
var newHistory = _toConsumableArray(state.history);
|
|
77
|
-
if (state.activeFlyoutGroup) {
|
|
78
|
-
newHistory.push(state.activeFlyoutGroup);
|
|
79
|
-
}
|
|
80
|
-
var newActiveGroup = {
|
|
81
|
-
isMainOpen: true,
|
|
82
|
-
isChildOpen: false,
|
|
83
|
-
config: {
|
|
84
|
-
mainSize: size,
|
|
85
|
-
mainFlyoutProps: flyoutProps
|
|
86
|
-
},
|
|
87
|
-
meta: meta
|
|
88
|
-
};
|
|
89
|
-
return {
|
|
90
|
-
activeFlyoutGroup: applySizeConstraints(newActiveGroup),
|
|
91
|
-
history: newHistory
|
|
92
|
-
};
|
|
93
|
-
}
|
|
94
|
-
case 'OPEN_CHILD_FLYOUT':
|
|
95
|
-
{
|
|
96
|
-
if (!state.activeFlyoutGroup || !state.activeFlyoutGroup.isMainOpen) {
|
|
97
|
-
console.warn('Cannot open child flyout: main flyout is not open or no active group.');
|
|
98
|
-
return state;
|
|
99
|
-
}
|
|
100
|
-
var _action$payload2 = action.payload,
|
|
101
|
-
_size = _action$payload2.size,
|
|
102
|
-
_flyoutProps = _action$payload2.flyoutProps,
|
|
103
|
-
_meta = _action$payload2.meta;
|
|
104
|
-
var updatedActiveGroup = _objectSpread(_objectSpread({}, state.activeFlyoutGroup), {}, {
|
|
105
|
-
isChildOpen: true,
|
|
106
|
-
config: _objectSpread(_objectSpread({}, state.activeFlyoutGroup.config), {}, {
|
|
107
|
-
childSize: _size,
|
|
108
|
-
childFlyoutProps: _flyoutProps
|
|
109
|
-
}),
|
|
110
|
-
meta: _meta
|
|
111
|
-
});
|
|
112
|
-
return {
|
|
113
|
-
history: state.history,
|
|
114
|
-
activeFlyoutGroup: applySizeConstraints(updatedActiveGroup)
|
|
115
|
-
};
|
|
116
|
-
}
|
|
117
|
-
case 'OPEN_FLYOUT_GROUP':
|
|
118
|
-
{
|
|
119
|
-
var _action$payload3 = action.payload,
|
|
120
|
-
main = _action$payload3.main,
|
|
121
|
-
child = _action$payload3.child,
|
|
122
|
-
_meta2 = _action$payload3.meta;
|
|
123
|
-
var _newHistory = _toConsumableArray(state.history);
|
|
124
|
-
if (state.activeFlyoutGroup) {
|
|
125
|
-
_newHistory.push(state.activeFlyoutGroup);
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
// Create the new active group with both main and child flyouts open
|
|
129
|
-
var _newActiveGroup = {
|
|
130
|
-
isMainOpen: true,
|
|
131
|
-
isChildOpen: true,
|
|
132
|
-
config: {
|
|
133
|
-
mainSize: main.size,
|
|
134
|
-
childSize: child.size,
|
|
135
|
-
mainFlyoutProps: main.flyoutProps,
|
|
136
|
-
childFlyoutProps: child.flyoutProps
|
|
137
|
-
},
|
|
138
|
-
meta: _meta2
|
|
139
|
-
};
|
|
140
|
-
return {
|
|
141
|
-
activeFlyoutGroup: applySizeConstraints(_newActiveGroup),
|
|
142
|
-
history: _newHistory
|
|
143
|
-
};
|
|
144
|
-
}
|
|
145
|
-
case 'CLOSE_CHILD_FLYOUT':
|
|
146
|
-
{
|
|
147
|
-
if (!state.activeFlyoutGroup || !state.activeFlyoutGroup.isChildOpen) {
|
|
148
|
-
console.warn('Cannot close child flyout: no child is open or no active group.');
|
|
149
|
-
return state;
|
|
150
|
-
}
|
|
151
|
-
var _updatedActiveGroup = _objectSpread(_objectSpread({}, state.activeFlyoutGroup), {}, {
|
|
152
|
-
isChildOpen: false,
|
|
153
|
-
config: _objectSpread(_objectSpread({}, state.activeFlyoutGroup.config), {}, {
|
|
154
|
-
childFlyoutProps: {}
|
|
155
|
-
})
|
|
156
|
-
});
|
|
157
|
-
return {
|
|
158
|
-
history: state.history,
|
|
159
|
-
activeFlyoutGroup: applySizeConstraints(_updatedActiveGroup)
|
|
160
|
-
};
|
|
161
|
-
}
|
|
162
|
-
case 'GO_BACK':
|
|
163
|
-
{
|
|
164
|
-
if (!state.activeFlyoutGroup) return initialFlyoutState;
|
|
165
|
-
|
|
166
|
-
// Restore from history or return to initial state
|
|
167
|
-
if (state.history.length > 0) {
|
|
168
|
-
var _newHistory2 = _toConsumableArray(state.history);
|
|
169
|
-
var previousGroup = _newHistory2.pop();
|
|
170
|
-
return {
|
|
171
|
-
activeFlyoutGroup: previousGroup ? applySizeConstraints(previousGroup) : null,
|
|
172
|
-
history: _newHistory2
|
|
173
|
-
};
|
|
174
|
-
} else {
|
|
175
|
-
return initialFlyoutState;
|
|
176
|
-
}
|
|
177
|
-
}
|
|
178
|
-
case 'UPDATE_ACTIVE_FLYOUT_CONFIG':
|
|
179
|
-
{
|
|
180
|
-
if (!state.activeFlyoutGroup) {
|
|
181
|
-
console.warn('Cannot update config: no active flyout group.');
|
|
182
|
-
return state;
|
|
183
|
-
}
|
|
184
|
-
var configChanges = action.payload.configChanges;
|
|
185
|
-
var _updatedActiveGroup2 = _objectSpread(_objectSpread({}, state.activeFlyoutGroup), {}, {
|
|
186
|
-
config: _objectSpread(_objectSpread({}, state.activeFlyoutGroup.config), configChanges)
|
|
187
|
-
});
|
|
188
|
-
var finalUpdatedActiveGroup = applySizeConstraints(_updatedActiveGroup2);
|
|
189
|
-
return _objectSpread(_objectSpread({}, state), {}, {
|
|
190
|
-
activeFlyoutGroup: finalUpdatedActiveGroup
|
|
191
|
-
});
|
|
192
|
-
}
|
|
193
|
-
case 'CLOSE_SESSION':
|
|
194
|
-
// Remove the active group and close the session
|
|
195
|
-
return {
|
|
196
|
-
activeFlyoutGroup: null,
|
|
197
|
-
history: []
|
|
198
|
-
};
|
|
199
|
-
default:
|
|
200
|
-
return state;
|
|
201
|
-
}
|
|
202
|
-
}
|
|
@@ -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,178 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["children", "backgroundStyle", "className", "banner", "hideCloseButton", "onClose", "scrollableTabIndex", "size"];
|
|
4
|
-
/*
|
|
5
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
6
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
7
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
8
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
9
|
-
* Side Public License, v 1.
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
|
-
import React, { useContext, Children, useEffect, useMemo, useRef, useCallback } from 'react';
|
|
13
|
-
import classNames from 'classnames';
|
|
14
|
-
import { keys, useEuiMemoizedStyles, useGeneratedHtmlId } from '../../services';
|
|
15
|
-
import { euiFlyoutChildStyles } from './flyout_child.styles';
|
|
16
|
-
import { EuiFlyoutCloseButton } from './_flyout_close_button';
|
|
17
|
-
import { EuiFlyoutContext } from './flyout_context';
|
|
18
|
-
import { EuiFlyoutBody } from './flyout_body';
|
|
19
|
-
import { EuiFocusTrap } from '../focus_trap';
|
|
20
|
-
|
|
21
|
-
/**
|
|
22
|
-
* Props used to render and configure the child flyout panel
|
|
23
|
-
*/
|
|
24
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
25
|
-
/**
|
|
26
|
-
* The child flyout is a panel that appears to the left of the parent flyout.
|
|
27
|
-
* It is only visible when the parent flyout is open.
|
|
28
|
-
*/
|
|
29
|
-
export var EuiFlyoutChild = function EuiFlyoutChild(_ref) {
|
|
30
|
-
var children = _ref.children,
|
|
31
|
-
_ref$backgroundStyle = _ref.backgroundStyle,
|
|
32
|
-
backgroundStyle = _ref$backgroundStyle === void 0 ? 'default' : _ref$backgroundStyle,
|
|
33
|
-
className = _ref.className,
|
|
34
|
-
banner = _ref.banner,
|
|
35
|
-
_ref$hideCloseButton = _ref.hideCloseButton,
|
|
36
|
-
hideCloseButton = _ref$hideCloseButton === void 0 ? false : _ref$hideCloseButton,
|
|
37
|
-
onClose = _ref.onClose,
|
|
38
|
-
_ref$scrollableTabInd = _ref.scrollableTabIndex,
|
|
39
|
-
scrollableTabIndex = _ref$scrollableTabInd === void 0 ? 0 : _ref$scrollableTabInd,
|
|
40
|
-
_ref$size = _ref.size,
|
|
41
|
-
size = _ref$size === void 0 ? 's' : _ref$size,
|
|
42
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
43
|
-
var flyoutContext = useContext(EuiFlyoutContext);
|
|
44
|
-
if (!flyoutContext) {
|
|
45
|
-
throw new Error('EuiFlyoutChild must be used as a child of EuiFlyout.');
|
|
46
|
-
}
|
|
47
|
-
var isChildFlyoutOpen = flyoutContext.isChildFlyoutOpen,
|
|
48
|
-
setIsChildFlyoutOpen = flyoutContext.setIsChildFlyoutOpen,
|
|
49
|
-
parentSize = flyoutContext.parentSize;
|
|
50
|
-
useEffect(function () {
|
|
51
|
-
setIsChildFlyoutOpen === null || setIsChildFlyoutOpen === void 0 || setIsChildFlyoutOpen(true);
|
|
52
|
-
return function () {
|
|
53
|
-
setIsChildFlyoutOpen === null || setIsChildFlyoutOpen === void 0 || setIsChildFlyoutOpen(false);
|
|
54
|
-
};
|
|
55
|
-
}, [setIsChildFlyoutOpen]);
|
|
56
|
-
if (React.Children.count(children) === 0) {
|
|
57
|
-
console.warn('EuiFlyoutChild was rendered with no children!');
|
|
58
|
-
}
|
|
59
|
-
if (parentSize === 'm' && size === 'm') {
|
|
60
|
-
throw new Error('When the parent EuiFlyout size is "m", the EuiFlyoutChild size cannot be "m". Please use size "s" for the EuiFlyoutChild.');
|
|
61
|
-
}
|
|
62
|
-
var handleClose = function handleClose(event) {
|
|
63
|
-
setIsChildFlyoutOpen === null || setIsChildFlyoutOpen === void 0 || setIsChildFlyoutOpen(false);
|
|
64
|
-
onClose(event);
|
|
65
|
-
};
|
|
66
|
-
var flyoutTitleText;
|
|
67
|
-
var hasDescribedByBody = false;
|
|
68
|
-
Children.forEach(children, function (child) {
|
|
69
|
-
if ( /*#__PURE__*/React.isValidElement(child)) {
|
|
70
|
-
var _child$type;
|
|
71
|
-
if (((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName) === 'EuiFlyoutHeader') {
|
|
72
|
-
// Attempt to extract string content from header for ARIA
|
|
73
|
-
var headerChildren = child.props.children;
|
|
74
|
-
if (typeof headerChildren === 'string') {
|
|
75
|
-
flyoutTitleText = headerChildren;
|
|
76
|
-
} else if ( /*#__PURE__*/React.isValidElement(headerChildren) &&
|
|
77
|
-
// Check if props exist and children is a string
|
|
78
|
-
typeof headerChildren.props.children === 'string') {
|
|
79
|
-
flyoutTitleText = headerChildren.props.children;
|
|
80
|
-
} else if (Array.isArray(headerChildren)) {
|
|
81
|
-
// Find the first string child if headerChildren is an array
|
|
82
|
-
flyoutTitleText = headerChildren.find(function (cNode) {
|
|
83
|
-
return typeof cNode === 'string';
|
|
84
|
-
});
|
|
85
|
-
}
|
|
86
|
-
}
|
|
87
|
-
if (child.type === EuiFlyoutBody) {
|
|
88
|
-
hasDescribedByBody = true;
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
});
|
|
92
|
-
var titleIdGenerated = useGeneratedHtmlId({
|
|
93
|
-
prefix: 'euiFlyoutChildTitle'
|
|
94
|
-
});
|
|
95
|
-
var bodyIdGenerated = useGeneratedHtmlId({
|
|
96
|
-
prefix: 'euiFlyoutChildBody'
|
|
97
|
-
});
|
|
98
|
-
var ariaLabelledBy = flyoutTitleText ? titleIdGenerated : undefined;
|
|
99
|
-
var ariaDescribedBy = hasDescribedByBody ? bodyIdGenerated : undefined;
|
|
100
|
-
// Use existing aria-label if provided, otherwise fallback if no labelledby can be derived
|
|
101
|
-
var ariaLabel = rest['aria-label'] || (!ariaLabelledBy && !flyoutTitleText ? 'Flyout panel' : undefined);
|
|
102
|
-
var processedChildren = useMemo(function () {
|
|
103
|
-
return Children.map(children, function (child) {
|
|
104
|
-
if ( /*#__PURE__*/React.isValidElement(child)) {
|
|
105
|
-
var _child$type2, _child$type3;
|
|
106
|
-
if ((child.type === EuiFlyoutBody || ((_child$type2 = child.type) === null || _child$type2 === void 0 ? void 0 : _child$type2.displayName) === 'EuiFlyoutBody') && hasDescribedByBody) {
|
|
107
|
-
return /*#__PURE__*/React.cloneElement(child, {
|
|
108
|
-
id: bodyIdGenerated
|
|
109
|
-
});
|
|
110
|
-
}
|
|
111
|
-
// If EuiFlyoutHeader is found and we derived flyoutTitleText, set its ID
|
|
112
|
-
if (((_child$type3 = child.type) === null || _child$type3 === void 0 ? void 0 : _child$type3.displayName) === 'EuiFlyoutHeader' && flyoutTitleText && ariaLabelledBy) {
|
|
113
|
-
return /*#__PURE__*/React.cloneElement(child, {
|
|
114
|
-
id: titleIdGenerated
|
|
115
|
-
});
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
return child;
|
|
119
|
-
});
|
|
120
|
-
}, [children, bodyIdGenerated, titleIdGenerated, hasDescribedByBody, flyoutTitleText, ariaLabelledBy]);
|
|
121
|
-
var flyoutWrapperRef = useRef(null);
|
|
122
|
-
var classes = classNames('euiFlyoutChild', className);
|
|
123
|
-
var styles = useEuiMemoizedStyles(euiFlyoutChildStyles);
|
|
124
|
-
var childLayoutMode = flyoutContext.childLayoutMode,
|
|
125
|
-
parentFlyoutRef = flyoutContext.parentFlyoutRef;
|
|
126
|
-
var flyoutChildCss = [styles.euiFlyoutChild, backgroundStyle === 'shaded' ? styles.backgroundShaded : styles.backgroundDefault, size === 's' ? styles.s : styles.m, childLayoutMode === 'side-by-side' ? styles.sidePosition : styles.stackedPosition];
|
|
127
|
-
var onKeyDown = useCallback(function (event) {
|
|
128
|
-
if (isChildFlyoutOpen && event.key === keys.ESCAPE) {
|
|
129
|
-
event.preventDefault();
|
|
130
|
-
setIsChildFlyoutOpen === null || setIsChildFlyoutOpen === void 0 || setIsChildFlyoutOpen(false);
|
|
131
|
-
onClose(event.nativeEvent);
|
|
132
|
-
}
|
|
133
|
-
}, [isChildFlyoutOpen, onClose, setIsChildFlyoutOpen]);
|
|
134
|
-
return ___EmotionJSX(EuiFocusTrap, {
|
|
135
|
-
returnFocus: function returnFocus() {
|
|
136
|
-
if (parentFlyoutRef !== null && parentFlyoutRef !== void 0 && parentFlyoutRef.current) {
|
|
137
|
-
parentFlyoutRef.current.focus();
|
|
138
|
-
return false; // We've handled focus
|
|
139
|
-
}
|
|
140
|
-
return true;
|
|
141
|
-
},
|
|
142
|
-
shards: [],
|
|
143
|
-
disabled: false
|
|
144
|
-
}, ___EmotionJSX("div", _extends({
|
|
145
|
-
ref: flyoutWrapperRef,
|
|
146
|
-
className: classes,
|
|
147
|
-
css: flyoutChildCss,
|
|
148
|
-
"data-test-subj": "euiFlyoutChild",
|
|
149
|
-
role: "dialog",
|
|
150
|
-
"aria-modal": "true",
|
|
151
|
-
"aria-label": ariaLabel,
|
|
152
|
-
"aria-labelledby": ariaLabelledBy,
|
|
153
|
-
"aria-describedby": ariaDescribedBy,
|
|
154
|
-
tabIndex: -1,
|
|
155
|
-
onKeyDown: onKeyDown // used as generic container event handler
|
|
156
|
-
}, rest), flyoutTitleText && !ariaLabelledBy && ___EmotionJSX("h2", {
|
|
157
|
-
id: titleIdGenerated,
|
|
158
|
-
className: "euiScreenReaderOnly"
|
|
159
|
-
}, flyoutTitleText), !hideCloseButton && ___EmotionJSX(EuiFlyoutCloseButton, {
|
|
160
|
-
className: "euiFlyoutChild__closeButton",
|
|
161
|
-
onClose: handleClose,
|
|
162
|
-
side: "right",
|
|
163
|
-
closeButtonPosition: "inside",
|
|
164
|
-
"data-test-subj": "euiFlyoutChildCloseButton"
|
|
165
|
-
}), ___EmotionJSX("div", {
|
|
166
|
-
tabIndex: scrollableTabIndex,
|
|
167
|
-
className: "euiFlyoutChild__overflow",
|
|
168
|
-
css: styles.overflow.overflow
|
|
169
|
-
}, banner && ___EmotionJSX("div", {
|
|
170
|
-
className: "euiFlyoutChild__banner",
|
|
171
|
-
css: styles.banner,
|
|
172
|
-
"data-test-subj": "euiFlyoutChildBanner"
|
|
173
|
-
}, banner), ___EmotionJSX("div", {
|
|
174
|
-
className: "euiFlyoutChild__overflowContent",
|
|
175
|
-
css: styles.overflow.wrapper
|
|
176
|
-
}, processedChildren))));
|
|
177
|
-
};
|
|
178
|
-
EuiFlyoutChild.displayName = 'EuiFlyoutChild';
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
3
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
4
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
5
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
|
-
* Side Public License, v 1.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
import { css } from '@emotion/react';
|
|
10
|
-
import { logicalCSS, logicalCSSWithFallback, highContrastModeStyles, euiYScroll } from '../../global_styling';
|
|
11
|
-
import { composeFlyoutSizing, maxedFlyoutWidth } from './flyout.styles';
|
|
12
|
-
export var euiFlyoutChildStyles = function euiFlyoutChildStyles(euiThemeContext) {
|
|
13
|
-
var euiTheme = euiThemeContext.euiTheme;
|
|
14
|
-
return {
|
|
15
|
-
// Base styles for the child flyout
|
|
16
|
-
euiFlyoutChild: /*#__PURE__*/css("position:absolute;inset-block-start:0;inset-inline-start:0;block-size:100%;display:flex;flex-direction:column;", logicalCSSWithFallback('overflow-y', 'hidden'), " ", logicalCSS('height', '100%'), " z-index:", Number(euiTheme.levels.flyout) + 1, ";border-inline-start:", euiTheme.border.thin, ";", maxedFlyoutWidth(euiThemeContext), ";;label:euiFlyoutChild;"),
|
|
17
|
-
backgroundDefault: /*#__PURE__*/css("background:", euiTheme.colors.backgroundBasePlain, ";;label:backgroundDefault;"),
|
|
18
|
-
backgroundShaded: /*#__PURE__*/css("background:", euiTheme.colors.backgroundBaseSubdued, ";;label:backgroundShaded;"),
|
|
19
|
-
// Position variants based on screen size
|
|
20
|
-
sidePosition: /*#__PURE__*/css("transform:translateX(-100%);border-inline-end:", euiTheme.border.thin, ";;label:sidePosition;"),
|
|
21
|
-
stackedPosition: /*#__PURE__*/css("inset-inline-end:0;inline-size:100%;border-block-end:", euiTheme.border.thin, ";;label:stackedPosition;"),
|
|
22
|
-
s: /*#__PURE__*/css(composeFlyoutSizing(euiThemeContext, 's'), ";;label:s;"),
|
|
23
|
-
m: /*#__PURE__*/css(composeFlyoutSizing(euiThemeContext, 'm'), ";;label:m;"),
|
|
24
|
-
overflow: {
|
|
25
|
-
overflow: /*#__PURE__*/css("flex-grow:1;display:flex;flex-direction:column;", euiYScroll(euiThemeContext), ";;label:overflow;"),
|
|
26
|
-
wrapper: /*#__PURE__*/css("display:flex;flex-direction:column;flex-grow:1;", logicalCSS('overflow-x', 'auto'), ";;label:wrapper;")
|
|
27
|
-
},
|
|
28
|
-
banner: /*#__PURE__*/css(logicalCSSWithFallback('overflow-x', 'hidden'), " ", highContrastModeStyles(euiThemeContext, {
|
|
29
|
-
preferred: logicalCSS('border-bottom', euiTheme.border.thin)
|
|
30
|
-
}), ";;label:banner;")
|
|
31
|
-
};
|
|
32
|
-
};
|
|
@@ -1,100 +0,0 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
-
/*
|
|
3
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
4
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
5
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
6
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
7
|
-
* Side Public License, v 1.
|
|
8
|
-
*/
|
|
9
|
-
|
|
10
|
-
import React, { useEffect, useMemo, useState } from 'react';
|
|
11
|
-
import { useEuiTheme } from '../../services';
|
|
12
|
-
import { EuiFlyoutContext } from './flyout_context';
|
|
13
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
14
|
-
/**
|
|
15
|
-
* An intermediate component between EuiFlyout and EuiFlyoutChild.
|
|
16
|
-
* It is responsible for managing the state of the child flyout, and passing it to EuiFlyoutContext.
|
|
17
|
-
* It removes the responsibility of managing child flyout state from EuiFlyout, which is especially important there might not be a child flyout.
|
|
18
|
-
*/
|
|
19
|
-
export var EuiFlyoutChildProvider = function EuiFlyoutChildProvider(_ref) {
|
|
20
|
-
var parentSize = _ref.parentSize,
|
|
21
|
-
parentFlyoutRef = _ref.parentFlyoutRef,
|
|
22
|
-
childElement = _ref.childElement,
|
|
23
|
-
childrenToRender = _ref.childrenToRender,
|
|
24
|
-
reportIsChildOpen = _ref.reportIsChildOpen,
|
|
25
|
-
reportChildLayoutMode = _ref.reportChildLayoutMode;
|
|
26
|
-
var _useEuiTheme = useEuiTheme(),
|
|
27
|
-
euiTheme = _useEuiTheme.euiTheme;
|
|
28
|
-
var _useState = useState(false),
|
|
29
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
30
|
-
isChildFlyoutOpen = _useState2[0],
|
|
31
|
-
setIsChildFlyoutOpen = _useState2[1];
|
|
32
|
-
var _useState3 = useState(typeof window !== 'undefined' ? window.innerWidth : Infinity),
|
|
33
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
34
|
-
windowWidth = _useState4[0],
|
|
35
|
-
setWindowWidth = _useState4[1];
|
|
36
|
-
var _useState5 = useState('side-by-side'),
|
|
37
|
-
_useState6 = _slicedToArray(_useState5, 2),
|
|
38
|
-
childLayoutMode = _useState6[0],
|
|
39
|
-
setChildLayoutMode = _useState6[1];
|
|
40
|
-
|
|
41
|
-
// update windowWidth on resize
|
|
42
|
-
useEffect(function () {
|
|
43
|
-
if (typeof window === 'undefined') return;
|
|
44
|
-
var handleResize = function handleResize() {
|
|
45
|
-
setWindowWidth(window.innerWidth);
|
|
46
|
-
};
|
|
47
|
-
window.addEventListener('resize', handleResize);
|
|
48
|
-
handleResize();
|
|
49
|
-
return function () {
|
|
50
|
-
window.removeEventListener('resize', handleResize);
|
|
51
|
-
reportIsChildOpen === null || reportIsChildOpen === void 0 || reportIsChildOpen(false);
|
|
52
|
-
};
|
|
53
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
54
|
-
}, []);
|
|
55
|
-
|
|
56
|
-
// Calculate stacking breakpoint value for child flyout.
|
|
57
|
-
// Stacking breakpoint value is a sum of parent breakpoint value and child breakpoint value.
|
|
58
|
-
var stackingBreakpointValue = useMemo(function () {
|
|
59
|
-
var parentSizeName = parentSize;
|
|
60
|
-
var childSizeName = childElement.props.size || 's';
|
|
61
|
-
var parentNumericValue = 0;
|
|
62
|
-
if (parentSizeName === 's') parentNumericValue = euiTheme.breakpoint.s;else if (parentSizeName === 'm') parentNumericValue = euiTheme.breakpoint.m;
|
|
63
|
-
// Parent 'l' size is not allowed when child is present, so no need to check here
|
|
64
|
-
|
|
65
|
-
var childNumericValue = 0;
|
|
66
|
-
if (childSizeName === 's') childNumericValue = euiTheme.breakpoint.s;else if (childSizeName === 'm') childNumericValue = euiTheme.breakpoint.m;
|
|
67
|
-
return parentNumericValue + childNumericValue;
|
|
68
|
-
}, [parentSize, childElement.props.size, euiTheme.breakpoint]);
|
|
69
|
-
|
|
70
|
-
// update childLayoutMode based on windowWidth and the calculated stackingBreakpoint
|
|
71
|
-
useEffect(function () {
|
|
72
|
-
if (windowWidth >= stackingBreakpointValue) {
|
|
73
|
-
setChildLayoutMode('side-by-side');
|
|
74
|
-
} else {
|
|
75
|
-
setChildLayoutMode('stacked');
|
|
76
|
-
}
|
|
77
|
-
}, [windowWidth, stackingBreakpointValue]);
|
|
78
|
-
|
|
79
|
-
// report isChildFlyoutOpen changes to the parent EuiFlyout
|
|
80
|
-
useEffect(function () {
|
|
81
|
-
reportIsChildOpen(isChildFlyoutOpen);
|
|
82
|
-
}, [isChildFlyoutOpen, reportIsChildOpen]);
|
|
83
|
-
|
|
84
|
-
// report childLayoutMode changes to the parent EuiFlyout
|
|
85
|
-
useEffect(function () {
|
|
86
|
-
reportChildLayoutMode(childLayoutMode);
|
|
87
|
-
}, [childLayoutMode, reportChildLayoutMode]);
|
|
88
|
-
var contextValue = useMemo(function () {
|
|
89
|
-
return {
|
|
90
|
-
parentSize: parentSize,
|
|
91
|
-
parentFlyoutRef: parentFlyoutRef,
|
|
92
|
-
isChildFlyoutOpen: isChildFlyoutOpen,
|
|
93
|
-
setIsChildFlyoutOpen: setIsChildFlyoutOpen,
|
|
94
|
-
childLayoutMode: childLayoutMode
|
|
95
|
-
};
|
|
96
|
-
}, [parentSize, parentFlyoutRef, isChildFlyoutOpen, setIsChildFlyoutOpen, childLayoutMode]);
|
|
97
|
-
return ___EmotionJSX(EuiFlyoutContext.Provider, {
|
|
98
|
-
value: contextValue
|
|
99
|
-
}, childrenToRender);
|
|
100
|
-
};
|