@elastic/eui 93.3.0 → 93.5.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/dist/eui_charts_theme.d.ts +9 -0
- package/dist/eui_charts_theme.js +56 -14
- package/dist/eui_charts_theme.js.map +1 -1
- package/dist/eui_theme_dark.css +3 -0
- package/dist/eui_theme_dark.min.css +1 -1
- package/dist/eui_theme_light.css +3 -0
- package/dist/eui_theme_light.min.css +1 -1
- package/es/components/breadcrumbs/_breadcrumb_content.js +362 -0
- package/es/components/breadcrumbs/_breadcrumb_content.styles.js +48 -0
- package/es/components/breadcrumbs/breadcrumb.js +10 -327
- package/es/components/breadcrumbs/breadcrumb.styles.js +5 -27
- package/es/components/breadcrumbs/breadcrumbs.js +4 -4
- package/es/components/breadcrumbs/types.js +1 -0
- package/es/components/button/button_group/button_group.js +16 -2
- package/es/components/button/button_group/button_group.styles.js +1 -1
- package/es/components/button/button_group/button_group_button.js +59 -5
- package/es/components/button/button_group/button_group_button.styles.js +39 -3
- package/es/components/datagrid/body/cell/data_grid_cell.js +97 -58
- package/es/components/datagrid/body/cell/data_grid_cell_actions.js +24 -18
- package/es/components/datagrid/body/cell/data_grid_cell_popover.js +64 -56
- package/es/components/datagrid/body/cell/data_grid_cell_wrapper.js +32 -31
- package/es/components/datagrid/body/cell/index.js +1 -1
- package/es/components/datagrid/body/data_grid_body.js +13 -0
- package/es/components/datagrid/body/data_grid_body_custom.js +52 -36
- package/es/components/datagrid/body/data_grid_body_virtualized.js +84 -56
- package/es/components/datagrid/body/data_grid_row_manager.js +6 -4
- package/es/components/datagrid/body/footer/use_data_grid_footer.js +1 -2
- package/es/components/datagrid/body/header/data_grid_control_header_cell.js +5 -4
- package/es/components/datagrid/body/header/data_grid_header_cell.js +73 -53
- package/es/components/datagrid/body/header/data_grid_header_row.js +15 -551
- package/es/components/datagrid/body/header/use_data_grid_header.js +7 -6
- package/es/components/datagrid/controls/column_selector.js +126 -123
- package/es/components/datagrid/controls/column_sorting.js +605 -103
- package/es/components/datagrid/controls/column_sorting_draggable.js +24 -22
- package/es/components/datagrid/controls/display_selector.js +109 -107
- package/es/components/datagrid/data_grid.a11y.js +13 -12
- package/es/components/datagrid/data_grid.js +45 -22
- package/es/components/datagrid/utils/col_widths.js +12 -8
- package/es/components/datagrid/utils/focus.js +10 -8
- package/es/components/datagrid/utils/grid_height_width.js +31 -30
- package/es/components/datagrid/utils/ref.js +1 -1
- package/es/components/datagrid/utils/row_heights.js +2 -2
- package/es/components/datagrid/utils/sorting.js +29 -27
- package/es/components/date_picker/super_date_picker/super_date_picker.js +9 -0
- package/es/components/date_picker/super_date_picker/super_update_button.js +57 -29
- package/es/components/flex/flex_grid.js +22 -8
- package/es/components/flex/flex_grid.styles.js +13 -6
- package/es/components/flex/flex_group.js +10 -11
- package/es/components/flex/flex_item.js +9 -11
- package/es/components/flex/flex_item.styles.js +107 -122
- package/es/components/flyout/flyout.js +16 -18
- package/es/components/header/header_breadcrumbs/header_breadcrumbs.js +3 -5
- package/es/components/header/header_links/header_links.js +10 -2
- package/es/components/icon/icon.js +3 -3
- package/es/components/modal/confirm_modal.js +2 -1
- package/es/components/modal/modal.js +12 -3
- package/es/components/observer/resize_observer/resize_observer.js +15 -24
- package/es/components/panel/panel.js +2 -3
- package/es/components/resizable_container/resizable_button.js +2 -3
- package/es/components/resizable_container/resizable_collapse_button.js +2 -3
- package/es/components/resizable_container/resizable_container.js +1 -2
- package/es/components/resizable_container/resizable_container.styles.js +11 -14
- package/es/components/resizable_container/resizable_panel.js +6 -8
- package/es/components/resizable_container/resizable_panel.styles.js +18 -29
- package/es/components/selectable/selectable_list/selectable_list.js +26 -6
- package/es/components/spacer/spacer.js +2 -3
- package/es/components/toast/global_toast_list.js +70 -73
- package/es/components/toast/toast.js +27 -42
- package/es/components/toast/toast.styles.js +2 -17
- package/es/components/tool_tip/icon_tip.js +4 -3
- package/es/global_styling/mixins/_color.js +60 -32
- package/es/global_styling/mixins/_padding.js +60 -16
- package/es/services/color/eui_palettes.js +21 -13
- package/es/services/color/index.js +1 -1
- package/es/services/hooks/index.js +1 -0
- package/es/services/hooks/useDeepEqual.js +23 -0
- package/es/services/index.js +1 -1
- package/es/services/theme/style_memoization.js +1 -3
- package/eui.d.ts +2558 -2470
- package/i18ntokens.json +297 -279
- package/lib/components/breadcrumbs/_breadcrumb_content.js +372 -0
- package/lib/components/breadcrumbs/_breadcrumb_content.styles.js +55 -0
- package/lib/components/breadcrumbs/breadcrumb.js +11 -331
- package/lib/components/breadcrumbs/breadcrumb.styles.js +5 -29
- package/lib/components/breadcrumbs/breadcrumbs.js +3 -3
- package/lib/components/breadcrumbs/types.js +5 -0
- package/lib/components/button/button_group/button_group.js +16 -2
- package/lib/components/button/button_group/button_group.styles.js +1 -1
- package/lib/components/button/button_group/button_group_button.js +59 -5
- package/lib/components/button/button_group/button_group_button.styles.js +45 -11
- package/lib/components/datagrid/body/cell/data_grid_cell.js +95 -57
- package/lib/components/datagrid/body/cell/data_grid_cell_actions.js +24 -18
- package/lib/components/datagrid/body/cell/data_grid_cell_popover.js +63 -55
- package/lib/components/datagrid/body/cell/data_grid_cell_wrapper.js +32 -31
- package/lib/components/datagrid/body/cell/index.js +2 -2
- package/lib/components/datagrid/body/data_grid_body.js +13 -0
- package/lib/components/datagrid/body/data_grid_body_custom.js +51 -35
- package/lib/components/datagrid/body/data_grid_body_virtualized.js +83 -55
- package/lib/components/datagrid/body/data_grid_row_manager.js +5 -3
- package/lib/components/datagrid/body/footer/use_data_grid_footer.js +1 -2
- package/lib/components/datagrid/body/header/data_grid_control_header_cell.js +8 -4
- package/lib/components/datagrid/body/header/data_grid_header_cell.js +72 -52
- package/lib/components/datagrid/body/header/data_grid_header_row.js +14 -550
- package/lib/components/datagrid/body/header/use_data_grid_header.js +7 -6
- package/lib/components/datagrid/controls/column_selector.js +126 -123
- package/lib/components/datagrid/controls/column_sorting.js +615 -110
- package/lib/components/datagrid/controls/column_sorting_draggable.js +27 -22
- package/lib/components/datagrid/controls/display_selector.js +109 -107
- package/lib/components/datagrid/data_grid.a11y.js +13 -12
- package/lib/components/datagrid/data_grid.js +43 -20
- package/lib/components/datagrid/utils/col_widths.js +12 -8
- package/lib/components/datagrid/utils/focus.js +10 -8
- package/lib/components/datagrid/utils/grid_height_width.js +29 -28
- package/lib/components/datagrid/utils/ref.js +1 -1
- package/lib/components/datagrid/utils/row_heights.js +1 -1
- package/lib/components/datagrid/utils/sorting.js +31 -29
- package/lib/components/date_picker/super_date_picker/super_date_picker.js +9 -0
- package/lib/components/date_picker/super_date_picker/super_update_button.js +57 -29
- package/lib/components/flex/flex_grid.js +23 -7
- package/lib/components/flex/flex_grid.styles.js +13 -6
- package/lib/components/flex/flex_group.js +10 -10
- package/lib/components/flex/flex_item.js +13 -13
- package/lib/components/flex/flex_item.styles.js +107 -122
- package/lib/components/flyout/flyout.js +16 -18
- package/lib/components/header/header_breadcrumbs/header_breadcrumbs.js +3 -5
- package/lib/components/header/header_links/header_links.js +10 -2
- package/lib/components/icon/icon.js +3 -3
- package/lib/components/modal/confirm_modal.js +2 -1
- package/lib/components/modal/modal.js +12 -3
- package/lib/components/observer/resize_observer/resize_observer.js +15 -24
- package/lib/components/panel/panel.js +1 -2
- package/lib/components/resizable_container/resizable_button.js +1 -2
- package/lib/components/resizable_container/resizable_collapse_button.js +1 -2
- package/lib/components/resizable_container/resizable_container.js +1 -2
- package/lib/components/resizable_container/resizable_container.styles.js +11 -14
- package/lib/components/resizable_container/resizable_panel.js +3 -5
- package/lib/components/resizable_container/resizable_panel.styles.js +17 -28
- package/lib/components/selectable/selectable_list/selectable_list.js +26 -6
- package/lib/components/spacer/spacer.js +1 -2
- package/lib/components/toast/global_toast_list.js +68 -71
- package/lib/components/toast/toast.js +25 -40
- package/lib/components/toast/toast.styles.js +11 -25
- package/lib/components/tool_tip/icon_tip.js +4 -3
- package/lib/global_styling/mixins/_color.js +65 -40
- package/lib/global_styling/mixins/_padding.js +66 -25
- package/lib/services/color/eui_palettes.js +24 -14
- package/lib/services/color/index.js +14 -0
- package/lib/services/hooks/index.js +11 -0
- package/lib/services/hooks/useDeepEqual.js +30 -0
- package/lib/services/index.js +15 -1
- package/lib/services/theme/style_memoization.js +1 -3
- package/optimize/es/components/breadcrumbs/_breadcrumb_content.js +153 -0
- package/optimize/es/components/breadcrumbs/_breadcrumb_content.styles.js +48 -0
- package/optimize/es/components/breadcrumbs/breadcrumb.js +10 -110
- package/optimize/es/components/breadcrumbs/breadcrumb.styles.js +5 -27
- package/optimize/es/components/breadcrumbs/breadcrumbs.js +4 -4
- package/optimize/es/components/breadcrumbs/types.js +1 -0
- package/optimize/es/components/button/button_group/button_group.js +2 -2
- package/optimize/es/components/button/button_group/button_group.styles.js +1 -1
- package/optimize/es/components/button/button_group/button_group_button.js +36 -4
- package/optimize/es/components/button/button_group/button_group_button.styles.js +39 -3
- package/optimize/es/components/datagrid/body/cell/data_grid_cell.js +80 -55
- package/optimize/es/components/datagrid/body/cell/data_grid_cell_actions.js +24 -18
- package/optimize/es/components/datagrid/body/cell/data_grid_cell_popover.js +64 -56
- package/optimize/es/components/datagrid/body/cell/data_grid_cell_wrapper.js +32 -31
- package/optimize/es/components/datagrid/body/cell/index.js +1 -1
- package/optimize/es/components/datagrid/body/data_grid_body_custom.js +39 -36
- package/optimize/es/components/datagrid/body/data_grid_body_virtualized.js +69 -49
- package/optimize/es/components/datagrid/body/data_grid_row_manager.js +6 -4
- package/optimize/es/components/datagrid/body/footer/use_data_grid_footer.js +1 -2
- package/optimize/es/components/datagrid/body/header/data_grid_control_header_cell.js +4 -3
- package/optimize/es/components/datagrid/body/header/data_grid_header_cell.js +65 -49
- package/optimize/es/components/datagrid/body/header/data_grid_header_row.js +15 -13
- package/optimize/es/components/datagrid/body/header/use_data_grid_header.js +7 -6
- package/optimize/es/components/datagrid/controls/column_selector.js +126 -123
- package/optimize/es/components/datagrid/controls/column_sorting.js +121 -103
- package/optimize/es/components/datagrid/controls/column_sorting_draggable.js +24 -22
- package/optimize/es/components/datagrid/controls/display_selector.js +109 -107
- package/optimize/es/components/datagrid/data_grid.a11y.js +13 -12
- package/optimize/es/components/datagrid/data_grid.js +45 -22
- package/optimize/es/components/datagrid/utils/col_widths.js +9 -5
- package/optimize/es/components/datagrid/utils/focus.js +10 -8
- package/optimize/es/components/datagrid/utils/grid_height_width.js +31 -30
- package/optimize/es/components/datagrid/utils/ref.js +1 -1
- package/optimize/es/components/datagrid/utils/row_heights.js +2 -2
- package/optimize/es/components/datagrid/utils/sorting.js +29 -27
- package/optimize/es/components/date_picker/super_date_picker/super_update_button.js +49 -29
- package/optimize/es/components/flex/flex_grid.js +19 -8
- package/optimize/es/components/flex/flex_grid.styles.js +13 -6
- package/optimize/es/components/flex/flex_group.js +9 -10
- package/optimize/es/components/flex/flex_item.js +9 -11
- package/optimize/es/components/flex/flex_item.styles.js +107 -122
- package/optimize/es/components/flyout/flyout.js +16 -18
- package/optimize/es/components/header/header_breadcrumbs/header_breadcrumbs.js +3 -5
- package/optimize/es/components/header/header_links/header_links.js +3 -2
- package/optimize/es/components/icon/icon.js +3 -3
- package/optimize/es/components/modal/confirm_modal.js +2 -1
- package/optimize/es/components/modal/modal.js +6 -2
- package/optimize/es/components/observer/resize_observer/resize_observer.js +15 -24
- package/optimize/es/components/panel/panel.js +2 -3
- package/optimize/es/components/resizable_container/resizable_button.js +2 -3
- package/optimize/es/components/resizable_container/resizable_collapse_button.js +2 -3
- package/optimize/es/components/resizable_container/resizable_container.js +1 -2
- package/optimize/es/components/resizable_container/resizable_container.styles.js +11 -14
- package/optimize/es/components/resizable_container/resizable_panel.js +6 -8
- package/optimize/es/components/resizable_container/resizable_panel.styles.js +18 -26
- package/optimize/es/components/selectable/selectable_list/selectable_list.js +26 -6
- package/optimize/es/components/spacer/spacer.js +2 -3
- package/optimize/es/components/toast/global_toast_list.js +70 -73
- package/optimize/es/components/toast/toast.js +27 -42
- package/optimize/es/components/toast/toast.styles.js +2 -17
- package/optimize/es/components/tool_tip/icon_tip.js +4 -3
- package/optimize/es/global_styling/mixins/_color.js +57 -32
- package/optimize/es/global_styling/mixins/_padding.js +52 -16
- package/optimize/es/services/color/eui_palettes.js +21 -13
- package/optimize/es/services/color/index.js +1 -1
- package/optimize/es/services/hooks/index.js +1 -0
- package/optimize/es/services/hooks/useDeepEqual.js +23 -0
- package/optimize/es/services/index.js +1 -1
- package/optimize/es/services/theme/style_memoization.js +1 -3
- package/optimize/lib/components/breadcrumbs/_breadcrumb_content.js +163 -0
- package/optimize/lib/components/breadcrumbs/_breadcrumb_content.styles.js +55 -0
- package/optimize/lib/components/breadcrumbs/breadcrumb.js +10 -113
- package/optimize/lib/components/breadcrumbs/breadcrumb.styles.js +5 -29
- package/optimize/lib/components/breadcrumbs/breadcrumbs.js +3 -3
- package/optimize/lib/components/breadcrumbs/types.js +5 -0
- package/optimize/lib/components/button/button_group/button_group.js +2 -2
- package/optimize/lib/components/button/button_group/button_group.styles.js +1 -1
- package/optimize/lib/components/button/button_group/button_group_button.js +37 -5
- package/optimize/lib/components/button/button_group/button_group_button.styles.js +45 -11
- package/optimize/lib/components/datagrid/body/cell/data_grid_cell.js +78 -54
- package/optimize/lib/components/datagrid/body/cell/data_grid_cell_actions.js +24 -18
- package/optimize/lib/components/datagrid/body/cell/data_grid_cell_popover.js +63 -55
- package/optimize/lib/components/datagrid/body/cell/data_grid_cell_wrapper.js +32 -31
- package/optimize/lib/components/datagrid/body/cell/index.js +2 -2
- package/optimize/lib/components/datagrid/body/data_grid_body_custom.js +38 -35
- package/optimize/lib/components/datagrid/body/data_grid_body_virtualized.js +70 -50
- package/optimize/lib/components/datagrid/body/data_grid_row_manager.js +5 -3
- package/optimize/lib/components/datagrid/body/footer/use_data_grid_footer.js +1 -2
- package/optimize/lib/components/datagrid/body/header/data_grid_control_header_cell.js +8 -4
- package/optimize/lib/components/datagrid/body/header/data_grid_header_cell.js +65 -49
- package/optimize/lib/components/datagrid/body/header/data_grid_header_row.js +14 -12
- package/optimize/lib/components/datagrid/body/header/use_data_grid_header.js +7 -6
- package/optimize/lib/components/datagrid/controls/column_selector.js +126 -123
- package/optimize/lib/components/datagrid/controls/column_sorting.js +125 -107
- package/optimize/lib/components/datagrid/controls/column_sorting_draggable.js +27 -22
- package/optimize/lib/components/datagrid/controls/display_selector.js +109 -107
- package/optimize/lib/components/datagrid/data_grid.a11y.js +13 -12
- package/optimize/lib/components/datagrid/data_grid.js +43 -20
- package/optimize/lib/components/datagrid/utils/col_widths.js +9 -5
- package/optimize/lib/components/datagrid/utils/focus.js +10 -8
- package/optimize/lib/components/datagrid/utils/grid_height_width.js +29 -28
- package/optimize/lib/components/datagrid/utils/ref.js +1 -1
- package/optimize/lib/components/datagrid/utils/row_heights.js +1 -1
- package/optimize/lib/components/datagrid/utils/sorting.js +31 -29
- package/optimize/lib/components/date_picker/super_date_picker/super_update_button.js +49 -29
- package/optimize/lib/components/flex/flex_grid.js +21 -7
- package/optimize/lib/components/flex/flex_grid.styles.js +13 -6
- package/optimize/lib/components/flex/flex_group.js +9 -9
- package/optimize/lib/components/flex/flex_item.js +13 -13
- package/optimize/lib/components/flex/flex_item.styles.js +107 -122
- package/optimize/lib/components/flyout/flyout.js +16 -18
- package/optimize/lib/components/header/header_breadcrumbs/header_breadcrumbs.js +3 -5
- package/optimize/lib/components/header/header_links/header_links.js +3 -2
- package/optimize/lib/components/icon/icon.js +3 -3
- package/optimize/lib/components/modal/confirm_modal.js +2 -1
- package/optimize/lib/components/modal/modal.js +6 -2
- package/optimize/lib/components/observer/resize_observer/resize_observer.js +15 -24
- package/optimize/lib/components/panel/panel.js +1 -2
- package/optimize/lib/components/resizable_container/resizable_button.js +1 -2
- package/optimize/lib/components/resizable_container/resizable_collapse_button.js +1 -2
- package/optimize/lib/components/resizable_container/resizable_container.js +1 -2
- package/optimize/lib/components/resizable_container/resizable_container.styles.js +11 -14
- package/optimize/lib/components/resizable_container/resizable_panel.js +3 -5
- package/optimize/lib/components/resizable_container/resizable_panel.styles.js +17 -26
- package/optimize/lib/components/selectable/selectable_list/selectable_list.js +26 -6
- package/optimize/lib/components/spacer/spacer.js +1 -2
- package/optimize/lib/components/toast/global_toast_list.js +68 -71
- package/optimize/lib/components/toast/toast.js +25 -40
- package/optimize/lib/components/toast/toast.styles.js +11 -25
- package/optimize/lib/components/tool_tip/icon_tip.js +4 -3
- package/optimize/lib/global_styling/mixins/_color.js +63 -40
- package/optimize/lib/global_styling/mixins/_padding.js +59 -25
- package/optimize/lib/services/color/eui_palettes.js +24 -14
- package/optimize/lib/services/color/index.js +14 -0
- package/optimize/lib/services/hooks/index.js +11 -0
- package/optimize/lib/services/hooks/useDeepEqual.js +30 -0
- package/optimize/lib/services/index.js +15 -1
- package/optimize/lib/services/theme/style_memoization.js +1 -3
- package/package.json +8 -11
- package/src/components/form/text_area/_text_area.scss +5 -0
- package/src/components/selectable/selectable_list/_selectable_list.scss +2 -0
- package/test-env/components/breadcrumbs/_breadcrumb_content.js +363 -0
- package/test-env/components/breadcrumbs/_breadcrumb_content.styles.js +55 -0
- package/test-env/components/breadcrumbs/breadcrumb.js +11 -326
- package/test-env/components/breadcrumbs/breadcrumb.styles.js +5 -29
- package/test-env/components/breadcrumbs/breadcrumbs.js +3 -3
- package/test-env/components/breadcrumbs/types.js +5 -0
- package/test-env/components/button/button_group/button_group.js +16 -2
- package/test-env/components/button/button_group/button_group.styles.js +1 -1
- package/test-env/components/button/button_group/button_group_button.js +56 -5
- package/test-env/components/button/button_group/button_group_button.styles.js +45 -11
- package/test-env/components/datagrid/body/cell/data_grid_cell.js +95 -57
- package/test-env/components/datagrid/body/cell/data_grid_cell_actions.js +24 -18
- package/test-env/components/datagrid/body/cell/data_grid_cell_popover.js +63 -55
- package/test-env/components/datagrid/body/cell/data_grid_cell_wrapper.js +32 -31
- package/test-env/components/datagrid/body/cell/index.js +2 -2
- package/test-env/components/datagrid/body/data_grid_body.js +13 -0
- package/test-env/components/datagrid/body/data_grid_body_custom.js +51 -35
- package/test-env/components/datagrid/body/data_grid_body_virtualized.js +83 -55
- package/test-env/components/datagrid/body/data_grid_row_manager.js +5 -3
- package/test-env/components/datagrid/body/footer/use_data_grid_footer.js +1 -2
- package/test-env/components/datagrid/body/header/data_grid_control_header_cell.js +8 -4
- package/test-env/components/datagrid/body/header/data_grid_header_cell.js +72 -52
- package/test-env/components/datagrid/body/header/data_grid_header_row.js +14 -550
- package/test-env/components/datagrid/body/header/use_data_grid_header.js +7 -6
- package/test-env/components/datagrid/controls/column_selector.js +126 -123
- package/test-env/components/datagrid/controls/column_sorting.js +607 -106
- package/test-env/components/datagrid/controls/column_sorting_draggable.js +27 -22
- package/test-env/components/datagrid/controls/display_selector.js +109 -107
- package/test-env/components/datagrid/data_grid.a11y.js +13 -12
- package/test-env/components/datagrid/data_grid.js +43 -20
- package/test-env/components/datagrid/utils/col_widths.js +9 -5
- package/test-env/components/datagrid/utils/focus.js +10 -8
- package/test-env/components/datagrid/utils/grid_height_width.js +29 -28
- package/test-env/components/datagrid/utils/ref.js +1 -1
- package/test-env/components/datagrid/utils/row_heights.js +1 -1
- package/test-env/components/datagrid/utils/sorting.js +31 -29
- package/test-env/components/date_picker/super_date_picker/super_date_picker.js +9 -0
- package/test-env/components/date_picker/super_date_picker/super_update_button.js +57 -29
- package/test-env/components/flex/flex_grid.js +21 -7
- package/test-env/components/flex/flex_grid.styles.js +13 -6
- package/test-env/components/flex/flex_group.js +10 -10
- package/test-env/components/flex/flex_item.js +13 -13
- package/test-env/components/flex/flex_item.styles.js +107 -122
- package/test-env/components/header/header_breadcrumbs/header_breadcrumbs.js +3 -5
- package/test-env/components/header/header_links/header_links.js +10 -2
- package/test-env/components/modal/confirm_modal.js +2 -1
- package/test-env/components/modal/modal.js +12 -3
- package/test-env/components/panel/panel.js +1 -2
- package/test-env/components/resizable_container/resizable_button.js +1 -2
- package/test-env/components/resizable_container/resizable_collapse_button.js +1 -2
- package/test-env/components/resizable_container/resizable_container.js +1 -2
- package/test-env/components/resizable_container/resizable_container.styles.js +11 -14
- package/test-env/components/resizable_container/resizable_panel.js +3 -5
- package/test-env/components/resizable_container/resizable_panel.styles.js +17 -26
- package/test-env/components/selectable/selectable_list/selectable_list.js +26 -6
- package/test-env/components/spacer/spacer.js +1 -2
- package/test-env/components/toast/global_toast_list.js +68 -71
- package/test-env/components/toast/toast.js +25 -40
- package/test-env/components/toast/toast.styles.js +11 -25
- package/test-env/components/tool_tip/icon_tip.js +4 -3
- package/test-env/global_styling/mixins/_color.js +63 -40
- package/test-env/global_styling/mixins/_padding.js +59 -25
- package/test-env/services/color/eui_palettes.js +24 -14
- package/test-env/services/color/index.js +14 -0
- package/test-env/services/hooks/index.js +11 -0
- package/test-env/services/hooks/useDeepEqual.js +30 -0
- package/test-env/services/index.js +15 -1
- package/test-env/services/theme/style_memoization.js +1 -3
- package/src/themes/charts/theme.scss +0 -5
|
@@ -1,17 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
6
|
exports.euiResizablePanelStyles = exports.euiResizablePanelContentStyles = void 0;
|
|
8
7
|
var _react = require("@emotion/react");
|
|
9
8
|
var _global_styling = require("../../global_styling");
|
|
10
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
11
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
12
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
13
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
14
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
15
9
|
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /*
|
|
16
10
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
17
11
|
* or more contributor license agreements. Licensed under the Elastic License
|
|
@@ -19,28 +13,23 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
|
|
|
19
13
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
20
14
|
* Side Public License, v 1.
|
|
21
15
|
*/
|
|
22
|
-
var
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
return {
|
|
40
|
-
euiResizablePanel: _ref3,
|
|
41
|
-
collapsed: _ref2,
|
|
42
|
-
paddingSizes: _objectSpread({}, (0, _global_styling.euiPaddingSizeCSS)(euiThemeContext))
|
|
43
|
-
};
|
|
16
|
+
var euiResizablePanelStyles = {
|
|
17
|
+
euiResizablePanel: process.env.NODE_ENV === "production" ? {
|
|
18
|
+
name: "15ifdgc-euiResizablePanel",
|
|
19
|
+
styles: "position:relative;label:euiResizablePanel;"
|
|
20
|
+
} : {
|
|
21
|
+
name: "15ifdgc-euiResizablePanel",
|
|
22
|
+
styles: "position:relative;label:euiResizablePanel;",
|
|
23
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
24
|
+
},
|
|
25
|
+
collapsed: process.env.NODE_ENV === "production" ? {
|
|
26
|
+
name: "11qmbh3-collapsed",
|
|
27
|
+
styles: "overflow:hidden;label:collapsed;"
|
|
28
|
+
} : {
|
|
29
|
+
name: "11qmbh3-collapsed",
|
|
30
|
+
styles: "overflow:hidden;label:collapsed;",
|
|
31
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
32
|
+
}
|
|
44
33
|
};
|
|
45
34
|
exports.euiResizablePanelStyles = euiResizablePanelStyles;
|
|
46
35
|
var _ref = process.env.NODE_ENV === "production" ? {
|
|
@@ -427,14 +427,30 @@ var EuiSelectableList = /*#__PURE__*/function (_Component) {
|
|
|
427
427
|
key: "componentDidUpdate",
|
|
428
428
|
value: function componentDidUpdate(prevProps) {
|
|
429
429
|
var _this$props9 = this.props,
|
|
430
|
+
isVirtualized = _this$props9.isVirtualized,
|
|
430
431
|
activeOptionIndex = _this$props9.activeOptionIndex,
|
|
431
432
|
visibleOptions = _this$props9.visibleOptions,
|
|
432
433
|
options = _this$props9.options;
|
|
433
|
-
if (
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
434
|
+
if (prevProps.activeOptionIndex !== activeOptionIndex) {
|
|
435
|
+
var makeOptionId = this.props.makeOptionId;
|
|
436
|
+
if (this.listBoxRef && this.props.searchable !== true) {
|
|
437
|
+
this.listBoxRef.setAttribute('aria-activedescendant', makeOptionId(activeOptionIndex));
|
|
438
|
+
}
|
|
439
|
+
if (typeof activeOptionIndex !== 'undefined') {
|
|
440
|
+
if (isVirtualized) {
|
|
441
|
+
var _this$listRef;
|
|
442
|
+
(_this$listRef = this.listRef) === null || _this$listRef === void 0 ? void 0 : _this$listRef.scrollToItem(activeOptionIndex, 'auto');
|
|
443
|
+
} else {
|
|
444
|
+
var _this$listBoxRef;
|
|
445
|
+
var activeOptionId = "#".concat(makeOptionId(activeOptionIndex));
|
|
446
|
+
var activeOptionEl = (_this$listBoxRef = this.listBoxRef) === null || _this$listBoxRef === void 0 ? void 0 : _this$listBoxRef.querySelector(activeOptionId);
|
|
447
|
+
if (activeOptionEl) {
|
|
448
|
+
activeOptionEl.scrollIntoView({
|
|
449
|
+
block: 'nearest'
|
|
450
|
+
});
|
|
451
|
+
}
|
|
452
|
+
}
|
|
453
|
+
}
|
|
438
454
|
}
|
|
439
455
|
if (prevProps.visibleOptions !== visibleOptions || prevProps.options !== options) {
|
|
440
456
|
var optionArray = visibleOptions || options;
|
|
@@ -477,14 +493,18 @@ var EuiSelectableList = /*#__PURE__*/function (_Component) {
|
|
|
477
493
|
textWrap = _this$props10.textWrap,
|
|
478
494
|
truncationProps = _this$props10.truncationProps,
|
|
479
495
|
rest = _objectWithoutProperties(_this$props10, _excluded3);
|
|
496
|
+
var heightIsFull = forcedHeight === 'full';
|
|
480
497
|
var classes = (0, _classnames.default)('euiSelectableList', {
|
|
481
|
-
'euiSelectableList-fullHeight':
|
|
498
|
+
'euiSelectableList-fullHeight': heightIsFull,
|
|
482
499
|
'euiSelectableList-bordered': bordered
|
|
483
500
|
}, className);
|
|
484
501
|
return (0, _react2.jsx)("div", _extends({
|
|
485
502
|
className: classes
|
|
486
503
|
}, rest), isVirtualized ? this.renderVirtualizedList() : (0, _react2.jsx)("div", {
|
|
487
504
|
className: "euiSelectableList__list",
|
|
505
|
+
style: !heightIsFull ? {
|
|
506
|
+
blockSize: forcedHeight
|
|
507
|
+
} : undefined,
|
|
488
508
|
ref: this.removeScrollableTabStop
|
|
489
509
|
}, (0, _react2.jsx)("ul", {
|
|
490
510
|
ref: this.setListBoxRef
|
|
@@ -33,8 +33,7 @@ var EuiSpacer = function EuiSpacer(_ref) {
|
|
|
33
33
|
_ref$size = _ref.size,
|
|
34
34
|
size = _ref$size === void 0 ? 'l' : _ref$size,
|
|
35
35
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
36
|
-
var
|
|
37
|
-
var styles = (0, _spacer.euiSpacerStyles)(euiTheme);
|
|
36
|
+
var styles = (0, _services.useEuiMemoizedStyles)(_spacer.euiSpacerStyles);
|
|
38
37
|
var classes = (0, _classnames.default)('euiSpacer', _defineProperty({}, "euiSpacer--".concat(size), size), className);
|
|
39
38
|
var cssStyles = [styles.euiSpacer, styles[size]];
|
|
40
39
|
return (0, _react2.jsx)("div", _extends({
|
|
@@ -85,10 +85,9 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
85
85
|
var isScrollingAnimationFrame = (0, _react.useRef)(0);
|
|
86
86
|
var startScrollingAnimationFrame = (0, _react.useRef)(0);
|
|
87
87
|
var listElement = (0, _react.useRef)(null);
|
|
88
|
-
var
|
|
89
|
-
var styles = (0, _global_toast_list.euiGlobalToastListStyles)(euiTheme);
|
|
88
|
+
var styles = (0, _services.useEuiMemoizedStyles)(_global_toast_list.euiGlobalToastListStyles);
|
|
90
89
|
var cssStyles = [styles.euiGlobalToastList, styles[side]];
|
|
91
|
-
var startScrollingToBottom = function
|
|
90
|
+
var startScrollingToBottom = (0, _react.useCallback)(function () {
|
|
92
91
|
isScrollingToBottom.current = true;
|
|
93
92
|
var scrollToBottom = function scrollToBottom() {
|
|
94
93
|
// Although we cancel the requestAnimationFrame in componentWillUnmount,
|
|
@@ -111,8 +110,8 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
111
110
|
}
|
|
112
111
|
};
|
|
113
112
|
startScrollingAnimationFrame.current = window.requestAnimationFrame(scrollToBottom);
|
|
114
|
-
};
|
|
115
|
-
var onMouseEnter = function
|
|
113
|
+
}, []);
|
|
114
|
+
var onMouseEnter = (0, _react.useCallback)(function () {
|
|
116
115
|
// Stop scrolling to bottom if we're in mid-scroll, because the user wants to interact with
|
|
117
116
|
// the list.
|
|
118
117
|
isScrollingToBottom.current = false;
|
|
@@ -125,8 +124,8 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
125
124
|
timer.pause();
|
|
126
125
|
}
|
|
127
126
|
}
|
|
128
|
-
};
|
|
129
|
-
var onMouseLeave = function
|
|
127
|
+
}, []);
|
|
128
|
+
var onMouseLeave = (0, _react.useCallback)(function () {
|
|
130
129
|
isUserInteracting.current = false;
|
|
131
130
|
for (var _toastId2 in toastIdToTimerMap.current) {
|
|
132
131
|
if (toastIdToTimerMap.current.hasOwnProperty(_toastId2)) {
|
|
@@ -134,8 +133,8 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
134
133
|
timer.resume();
|
|
135
134
|
}
|
|
136
135
|
}
|
|
137
|
-
};
|
|
138
|
-
var onScroll = function
|
|
136
|
+
}, []);
|
|
137
|
+
var onScroll = (0, _react.useCallback)(function () {
|
|
139
138
|
// Given that this method also gets invoked by the synthetic scroll that happens when a new toast gets added,
|
|
140
139
|
// we want to evaluate if the scroll bottom has been reached only when the user is interacting with the toast,
|
|
141
140
|
// this way we always retain the scroll position the user has set despite adding in new toasts.
|
|
@@ -143,7 +142,7 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
143
142
|
if (listElement.current && isUserInteracting.current) {
|
|
144
143
|
isScrolledToBottom.current = listElement.current.scrollHeight - listElement.current.scrollTop === listElement.current.clientHeight;
|
|
145
144
|
}
|
|
146
|
-
};
|
|
145
|
+
}, []);
|
|
147
146
|
var dismissToast = (0, _react.useCallback)(function (toast) {
|
|
148
147
|
// Remove the toast after it's done fading out.
|
|
149
148
|
dismissTimeoutIds.current.push(window.setTimeout(function () {
|
|
@@ -166,34 +165,29 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
166
165
|
}
|
|
167
166
|
});
|
|
168
167
|
}, [scheduleToastForDismissal, toasts]);
|
|
169
|
-
var addListeners = function addListeners() {
|
|
170
|
-
if (listElement.current) {
|
|
171
|
-
listElement.current.addEventListener('scroll', onScroll);
|
|
172
|
-
listElement.current.addEventListener('mouseenter', onMouseEnter);
|
|
173
|
-
listElement.current.addEventListener('mouseleave', onMouseLeave);
|
|
174
|
-
}
|
|
175
|
-
};
|
|
176
|
-
var removeListeners = function removeListeners() {
|
|
177
|
-
if (listElement.current) {
|
|
178
|
-
listElement.current.removeEventListener('scroll', onScroll);
|
|
179
|
-
listElement.current.removeEventListener('mouseenter', onMouseEnter);
|
|
180
|
-
listElement.current.removeEventListener('mouseleave', onMouseLeave);
|
|
181
|
-
}
|
|
182
|
-
};
|
|
183
168
|
|
|
184
169
|
// componentDidMount
|
|
185
170
|
(0, _react.useEffect)(function () {
|
|
186
|
-
|
|
171
|
+
var listenerEl = listElement.current;
|
|
172
|
+
if (listenerEl) {
|
|
173
|
+
listenerEl.addEventListener('scroll', onScroll);
|
|
174
|
+
listenerEl.addEventListener('mouseenter', onMouseEnter);
|
|
175
|
+
listenerEl.addEventListener('mouseleave', onMouseLeave);
|
|
176
|
+
}
|
|
187
177
|
|
|
188
178
|
// componentWillUnmount
|
|
189
179
|
return function () {
|
|
180
|
+
if (listenerEl) {
|
|
181
|
+
listenerEl.removeEventListener('scroll', onScroll);
|
|
182
|
+
listenerEl.removeEventListener('mouseenter', onMouseEnter);
|
|
183
|
+
listenerEl.removeEventListener('mouseleave', onMouseLeave);
|
|
184
|
+
}
|
|
190
185
|
if (isScrollingAnimationFrame.current !== 0) {
|
|
191
186
|
window.cancelAnimationFrame(isScrollingAnimationFrame.current);
|
|
192
187
|
}
|
|
193
188
|
if (startScrollingAnimationFrame.current !== 0) {
|
|
194
189
|
window.cancelAnimationFrame(startScrollingAnimationFrame.current);
|
|
195
190
|
}
|
|
196
|
-
removeListeners();
|
|
197
191
|
dismissTimeoutIds.current.forEach(clearTimeout); // eslint-disable-line react-hooks/exhaustive-deps
|
|
198
192
|
for (var _toastId3 in toastIdToTimerMap.current) {
|
|
199
193
|
if (toastIdToTimerMap.current.hasOwnProperty(_toastId3)) {
|
|
@@ -202,7 +196,7 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
202
196
|
}
|
|
203
197
|
}
|
|
204
198
|
};
|
|
205
|
-
}, []);
|
|
199
|
+
}, [onMouseEnter, onMouseLeave, onScroll]);
|
|
206
200
|
|
|
207
201
|
// componentDidUpdate
|
|
208
202
|
(0, _react.useEffect)(function () {
|
|
@@ -217,7 +211,7 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
217
211
|
}
|
|
218
212
|
}
|
|
219
213
|
prevToasts.current = toasts;
|
|
220
|
-
}, [toasts, scheduleAllToastsForDismissal]);
|
|
214
|
+
}, [toasts, scheduleAllToastsForDismissal, startScrollingToBottom]);
|
|
221
215
|
|
|
222
216
|
// Toast dismissal side effect
|
|
223
217
|
// Ensure the callback has correct state by not enclosing it in `setTimeout`
|
|
@@ -238,49 +232,52 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
238
232
|
});
|
|
239
233
|
}
|
|
240
234
|
}, [toastToDismiss, dismissToastProp]);
|
|
241
|
-
var renderedToasts =
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
key: toast.id,
|
|
250
|
-
isDismissed: toastIdToDismissedMap[toast.id]
|
|
251
|
-
}, (0, _react2.jsx)(_toast.EuiToast, _extends({
|
|
252
|
-
onClose: onClose,
|
|
253
|
-
onFocus: onMouseEnter,
|
|
254
|
-
onBlur: onMouseLeave
|
|
255
|
-
}, rest), text));
|
|
256
|
-
});
|
|
257
|
-
if (showClearAllButtonAt && toasts.length >= showClearAllButtonAt) {
|
|
258
|
-
var dismissAllToasts = function dismissAllToasts() {
|
|
259
|
-
toasts.forEach(function (toast) {
|
|
260
|
-
return dismissToastProp(toast);
|
|
261
|
-
});
|
|
262
|
-
onClearAllToasts === null || onClearAllToasts === void 0 ? void 0 : onClearAllToasts();
|
|
263
|
-
};
|
|
264
|
-
renderedToasts.push((0, _react2.jsx)(_i18n.EuiI18n, {
|
|
265
|
-
key: "euiClearAllToasts",
|
|
266
|
-
tokens: ['euiGlobalToastList.clearAllToastsButtonAriaLabel', 'euiGlobalToastList.clearAllToastsButtonDisplayText'],
|
|
267
|
-
defaults: ['Clear all toast notifications', 'Clear all']
|
|
268
|
-
}, function (_ref2) {
|
|
269
|
-
var _ref3 = _slicedToArray(_ref2, 2),
|
|
270
|
-
clearAllToastsButtonAriaLabel = _ref3[0],
|
|
271
|
-
clearAllToastsButtonDisplayText = _ref3[1];
|
|
235
|
+
var renderedToasts = (0, _react.useMemo)(function () {
|
|
236
|
+
return toasts.map(function (toast) {
|
|
237
|
+
var text = toast.text,
|
|
238
|
+
toastLifeTimeMs = toast.toastLifeTimeMs,
|
|
239
|
+
rest = _objectWithoutProperties(toast, _excluded2);
|
|
240
|
+
var onClose = function onClose() {
|
|
241
|
+
return dismissToast(toast);
|
|
242
|
+
};
|
|
272
243
|
return (0, _react2.jsx)(_global_toast_list_item.EuiGlobalToastListItem, {
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
244
|
+
key: toast.id,
|
|
245
|
+
isDismissed: toastIdToDismissedMap[toast.id]
|
|
246
|
+
}, (0, _react2.jsx)(_toast.EuiToast, _extends({
|
|
247
|
+
onClose: onClose,
|
|
248
|
+
onFocus: onMouseEnter,
|
|
249
|
+
onBlur: onMouseLeave
|
|
250
|
+
}, rest), text));
|
|
251
|
+
});
|
|
252
|
+
}, [toasts, toastIdToDismissedMap, dismissToast, onMouseEnter, onMouseLeave]);
|
|
253
|
+
var clearAllButton = (0, _react.useMemo)(function () {
|
|
254
|
+
if (toasts.length && showClearAllButtonAt && toasts.length >= showClearAllButtonAt) {
|
|
255
|
+
return (0, _react2.jsx)(_i18n.EuiI18n, {
|
|
256
|
+
key: "euiClearAllToasts",
|
|
257
|
+
tokens: ['euiGlobalToastList.clearAllToastsButtonAriaLabel', 'euiGlobalToastList.clearAllToastsButtonDisplayText'],
|
|
258
|
+
defaults: ['Clear all toast notifications', 'Clear all']
|
|
259
|
+
}, function (_ref2) {
|
|
260
|
+
var _ref3 = _slicedToArray(_ref2, 2),
|
|
261
|
+
clearAllToastsButtonAriaLabel = _ref3[0],
|
|
262
|
+
clearAllToastsButtonDisplayText = _ref3[1];
|
|
263
|
+
return (0, _react2.jsx)(_global_toast_list_item.EuiGlobalToastListItem, {
|
|
264
|
+
isDismissed: false
|
|
265
|
+
}, (0, _react2.jsx)(_button.EuiButton, {
|
|
266
|
+
fill: true,
|
|
267
|
+
color: "text",
|
|
268
|
+
onClick: function onClick() {
|
|
269
|
+
toasts.forEach(function (toast) {
|
|
270
|
+
return dismissToastProp(toast);
|
|
271
|
+
});
|
|
272
|
+
onClearAllToasts === null || onClearAllToasts === void 0 ? void 0 : onClearAllToasts();
|
|
273
|
+
},
|
|
274
|
+
css: styles.euiGlobalToastListDismissButton,
|
|
275
|
+
"aria-label": clearAllToastsButtonAriaLabel,
|
|
276
|
+
"data-test-subj": "euiClearAllToastsButton"
|
|
277
|
+
}, clearAllToastsButtonDisplayText));
|
|
278
|
+
});
|
|
279
|
+
}
|
|
280
|
+
}, [showClearAllButtonAt, onClearAllToasts, toasts, dismissToastProp, styles]);
|
|
284
281
|
var classes = (0, _classnames.default)('euiGlobalToastList', className);
|
|
285
282
|
return (0, _react2.jsx)("div", _extends({
|
|
286
283
|
"aria-live": "polite",
|
|
@@ -288,7 +285,7 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
288
285
|
ref: listElement,
|
|
289
286
|
css: cssStyles,
|
|
290
287
|
className: classes
|
|
291
|
-
}, rest), renderedToasts);
|
|
288
|
+
}, rest), renderedToasts, clearAllButton);
|
|
292
289
|
};
|
|
293
290
|
exports.EuiGlobalToastList = EuiGlobalToastList;
|
|
294
291
|
EuiGlobalToastList.propTypes = {
|
|
@@ -37,47 +37,11 @@ var EuiToast = function EuiToast(_ref) {
|
|
|
37
37
|
children = _ref.children,
|
|
38
38
|
className = _ref.className,
|
|
39
39
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
40
|
-
var
|
|
41
|
-
var baseStyles = (0, _toast.euiToastStyles)(euiTheme);
|
|
40
|
+
var baseStyles = (0, _services.useEuiMemoizedStyles)(_toast.euiToastStyles);
|
|
42
41
|
var baseCss = [baseStyles.euiToast, color && baseStyles[color]];
|
|
43
|
-
var
|
|
44
|
-
var headerStyles = (0, _toast.euiToastHeaderStyles)(euiTheme);
|
|
42
|
+
var headerStyles = (0, _services.useEuiMemoizedStyles)(_toast.euiToastHeaderStyles);
|
|
45
43
|
var headerCss = [headerStyles.euiToastHeader, children && headerStyles.withBody];
|
|
46
44
|
var classes = (0, _classnames.default)('euiToast', className);
|
|
47
|
-
var headerIcon;
|
|
48
|
-
if (iconType) {
|
|
49
|
-
headerIcon = (0, _react2.jsx)(_icon.EuiIcon, {
|
|
50
|
-
css: headerStyles.euiToastHeader__icon,
|
|
51
|
-
type: iconType,
|
|
52
|
-
size: "m",
|
|
53
|
-
"aria-hidden": "true"
|
|
54
|
-
});
|
|
55
|
-
}
|
|
56
|
-
var closeButton;
|
|
57
|
-
if (onClose) {
|
|
58
|
-
closeButton = (0, _react2.jsx)(_i18n.EuiI18n, {
|
|
59
|
-
token: "euiToast.dismissToast",
|
|
60
|
-
default: "Dismiss toast"
|
|
61
|
-
}, function (dismissToast) {
|
|
62
|
-
return (0, _react2.jsx)(_button.EuiButtonIcon, {
|
|
63
|
-
css: baseStyles.euiToast__closeButton,
|
|
64
|
-
iconType: "cross",
|
|
65
|
-
color: "text",
|
|
66
|
-
size: "xs",
|
|
67
|
-
"aria-label": dismissToast,
|
|
68
|
-
onClick: onClose,
|
|
69
|
-
"data-test-subj": "toastCloseButton"
|
|
70
|
-
});
|
|
71
|
-
});
|
|
72
|
-
}
|
|
73
|
-
var optionalBody;
|
|
74
|
-
if (children) {
|
|
75
|
-
optionalBody = (0, _react2.jsx)(_text.EuiText, {
|
|
76
|
-
css: bodyStyles.euiToastBody,
|
|
77
|
-
size: "s",
|
|
78
|
-
"data-test-subj": "euiToastBody"
|
|
79
|
-
}, children);
|
|
80
|
-
}
|
|
81
45
|
return (0, _react2.jsx)("div", _extends({
|
|
82
46
|
css: baseCss,
|
|
83
47
|
className: classes
|
|
@@ -92,11 +56,32 @@ var EuiToast = function EuiToast(_ref) {
|
|
|
92
56
|
css: headerCss,
|
|
93
57
|
"aria-label": notification,
|
|
94
58
|
"data-test-subj": "euiToastHeader"
|
|
95
|
-
},
|
|
59
|
+
}, iconType && (0, _react2.jsx)(_icon.EuiIcon, {
|
|
60
|
+
css: headerStyles.euiToastHeader__icon,
|
|
61
|
+
type: iconType,
|
|
62
|
+
size: "m",
|
|
63
|
+
"aria-hidden": "true"
|
|
64
|
+
}), (0, _react2.jsx)("span", {
|
|
96
65
|
css: headerStyles.euiToastHeader__title,
|
|
97
66
|
"data-test-subj": "euiToastHeader__title"
|
|
98
67
|
}, title));
|
|
99
|
-
}),
|
|
68
|
+
}), onClose && (0, _react2.jsx)(_i18n.EuiI18n, {
|
|
69
|
+
token: "euiToast.dismissToast",
|
|
70
|
+
default: "Dismiss toast"
|
|
71
|
+
}, function (dismissToast) {
|
|
72
|
+
return (0, _react2.jsx)(_button.EuiButtonIcon, {
|
|
73
|
+
css: baseStyles.euiToast__closeButton,
|
|
74
|
+
iconType: "cross",
|
|
75
|
+
color: "text",
|
|
76
|
+
size: "xs",
|
|
77
|
+
"aria-label": dismissToast,
|
|
78
|
+
onClick: onClose,
|
|
79
|
+
"data-test-subj": "toastCloseButton"
|
|
80
|
+
});
|
|
81
|
+
}), children && (0, _react2.jsx)(_text.EuiText, {
|
|
82
|
+
size: "s",
|
|
83
|
+
"data-test-subj": "euiToastBody"
|
|
84
|
+
}, children));
|
|
100
85
|
};
|
|
101
86
|
exports.EuiToast = EuiToast;
|
|
102
87
|
EuiToast.propTypes = {
|
|
@@ -3,23 +3,24 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.euiToastStyles = exports.euiToastHeaderStyles =
|
|
6
|
+
exports.euiToastStyles = exports.euiToastHeaderStyles = void 0;
|
|
7
7
|
var _react = require("@emotion/react");
|
|
8
8
|
var _global_styling = require("../../global_styling");
|
|
9
9
|
var _amsterdam = require("../../themes/amsterdam");
|
|
10
10
|
var _title = require("../title/title.styles");
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
11
|
+
/*
|
|
12
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
13
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
14
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
15
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
16
|
+
* Side Public License, v 1.
|
|
17
|
+
*/
|
|
18
|
+
|
|
18
19
|
var euiToastStyles = function euiToastStyles(euiThemeContext) {
|
|
19
20
|
var euiTheme = euiThemeContext.euiTheme;
|
|
20
21
|
return {
|
|
21
22
|
// Base
|
|
22
|
-
euiToast: /*#__PURE__*/(0, _react.css)("border-radius:", euiTheme.border.radius.medium, ";", (0, _amsterdam.euiShadowLarge)(euiThemeContext), " position:relative;", (0, _global_styling.logicalCSS)('padding-horizontal', euiTheme.size.base), " ", (0, _global_styling.logicalCSS)('padding-vertical', euiTheme.size.base), " background-color:", euiTheme.colors.emptyShade, ";", (0, _global_styling.logicalCSS)('width', '100%'), " &:hover,&:focus{[class*='euiToast__closeButton']{opacity:1;}};label:euiToast;"),
|
|
23
|
+
euiToast: /*#__PURE__*/(0, _react.css)("border-radius:", euiTheme.border.radius.medium, ";", (0, _amsterdam.euiShadowLarge)(euiThemeContext), " position:relative;", (0, _global_styling.logicalCSS)('padding-horizontal', euiTheme.size.base), " ", (0, _global_styling.logicalCSS)('padding-vertical', euiTheme.size.base), " background-color:", euiTheme.colors.emptyShade, ";", (0, _global_styling.logicalCSS)('width', '100%'), " ", (0, _global_styling.euiTextBreakWord)(), "&:hover,&:focus{[class*='euiToast__closeButton']{opacity:1;}};label:euiToast;"),
|
|
23
24
|
// Elements
|
|
24
25
|
euiToast__closeButton: /*#__PURE__*/(0, _react.css)("position:absolute;", (0, _global_styling.logicalCSS)('top', euiTheme.size.base), " ", (0, _global_styling.logicalCSS)('right', euiTheme.size.base), ";;label:euiToast__closeButton;"),
|
|
25
26
|
// Variants
|
|
@@ -42,19 +43,4 @@ var euiToastHeaderStyles = function euiToastHeaderStyles(euiThemeContext) {
|
|
|
42
43
|
withBody: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('margin-bottom', euiTheme.size.s), ";;label:withBody;")
|
|
43
44
|
};
|
|
44
45
|
};
|
|
45
|
-
exports.euiToastHeaderStyles = euiToastHeaderStyles;
|
|
46
|
-
var _ref = process.env.NODE_ENV === "production" ? {
|
|
47
|
-
name: "1xv63y1-euiToastBody",
|
|
48
|
-
styles: "word-wrap:break-word;label:euiToastBody;"
|
|
49
|
-
} : {
|
|
50
|
-
name: "1xv63y1-euiToastBody",
|
|
51
|
-
styles: "word-wrap:break-word;label:euiToastBody;",
|
|
52
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
53
|
-
};
|
|
54
|
-
var euiToastBodyStyles = function euiToastBodyStyles() {
|
|
55
|
-
return {
|
|
56
|
-
// Base
|
|
57
|
-
euiToastBody: _ref
|
|
58
|
-
};
|
|
59
|
-
};
|
|
60
|
-
exports.euiToastBodyStyles = euiToastBodyStyles;
|
|
46
|
+
exports.euiToastHeaderStyles = euiToastHeaderStyles;
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.EuiIconTip = void 0;
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
+
var _i18n = require("../i18n");
|
|
9
10
|
var _icon = require("../icon");
|
|
10
11
|
var _tool_tip = require("./tool_tip");
|
|
11
12
|
var _react2 = require("@emotion/react");
|
|
@@ -24,8 +25,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
|
|
|
24
25
|
var EuiIconTip = function EuiIconTip(_ref) {
|
|
25
26
|
var _ref$type = _ref.type,
|
|
26
27
|
type = _ref$type === void 0 ? 'questionInCircle' : _ref$type,
|
|
27
|
-
|
|
28
|
-
ariaLabel = _ref$ariaLabel === void 0 ? 'Info' : _ref$ariaLabel,
|
|
28
|
+
ariaLabel = _ref['aria-label'],
|
|
29
29
|
color = _ref.color,
|
|
30
30
|
size = _ref.size,
|
|
31
31
|
iconProps = _ref.iconProps,
|
|
@@ -34,6 +34,7 @@ var EuiIconTip = function EuiIconTip(_ref) {
|
|
|
34
34
|
_ref$delay = _ref.delay,
|
|
35
35
|
delay = _ref$delay === void 0 ? 'regular' : _ref$delay,
|
|
36
36
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
37
|
+
var defaultAriaLabel = (0, _i18n.useEuiI18n)('euiIconTip.defaultAriaLabel', 'Info');
|
|
37
38
|
return (0, _react2.jsx)(_tool_tip.EuiToolTip, _extends({
|
|
38
39
|
position: position,
|
|
39
40
|
delay: delay
|
|
@@ -42,7 +43,7 @@ var EuiIconTip = function EuiIconTip(_ref) {
|
|
|
42
43
|
type: type,
|
|
43
44
|
color: color,
|
|
44
45
|
size: size,
|
|
45
|
-
"aria-label": ariaLabel
|
|
46
|
+
"aria-label": ariaLabel || defaultAriaLabel
|
|
46
47
|
}, iconProps)));
|
|
47
48
|
};
|
|
48
49
|
exports.EuiIconTip = EuiIconTip;
|