@elastic/eui 93.2.0 → 93.4.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 -324
- package/es/components/breadcrumbs/breadcrumb.styles.js +5 -27
- package/es/components/breadcrumbs/breadcrumbs.js +8 -6
- package/es/components/breadcrumbs/types.js +1 -0
- package/es/components/button/button_display/_button_display.js +2 -3
- package/es/components/button/button_empty/button_empty.js +2 -3
- package/es/components/button/button_group/button_group.js +19 -7
- package/es/components/button/button_group/button_group.styles.js +11 -14
- 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/button/button_icon/button_icon.js +4 -5
- package/es/components/button/button_icon/button_icon.styles.js +11 -3
- package/es/components/datagrid/body/cell/data_grid_cell.js +102 -59
- 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 +34 -31
- package/es/components/datagrid/body/cell/index.js +1 -1
- package/es/components/datagrid/body/data_grid_body.js +14 -0
- package/es/components/datagrid/body/data_grid_body_custom.js +54 -35
- package/es/components/datagrid/body/data_grid_body_virtualized.js +87 -56
- package/es/components/datagrid/body/data_grid_row_manager.js +7 -5
- 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 +47 -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/facet/facet_button.styles.js +1 -2
- 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 +7 -7
- package/es/components/icon/icon.js +13 -16
- package/es/components/icon/icon.styles.js +6 -9
- package/es/components/link/external_link_icon.js +11 -8
- package/es/components/link/link.js +2 -3
- package/es/components/link/link.styles.js +4 -10
- 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/page/page_header/page_header_content.js +4 -2
- package/es/components/progress/progress.styles.js +2 -2
- package/es/components/skeleton/skeleton_circle.js +2 -3
- package/es/components/skeleton/skeleton_rectangle.js +2 -3
- package/es/components/skeleton/skeleton_text.js +16 -12
- package/es/components/skeleton/skeleton_title.js +2 -3
- package/es/components/spacer/spacer.js +2 -3
- package/es/components/text/text.js +2 -3
- package/es/components/text/text_align.js +1 -2
- package/es/components/text/text_align.styles.js +5 -7
- package/es/components/text/text_color.js +2 -3
- package/es/components/title/title.js +2 -3
- package/es/components/title/title.styles.js +0 -7
- 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/global_styling/mixins/_typography.js +17 -6
- 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/index.js +1 -1
- package/es/services/theme/style_memoization.js +47 -14
- package/es/themes/amsterdam/global_styling/mixins/button.js +47 -24
- package/eui.d.ts +2862 -2748
- package/i18ntokens.json +267 -267
- 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 -328
- package/lib/components/breadcrumbs/breadcrumb.styles.js +5 -29
- package/lib/components/breadcrumbs/breadcrumbs.js +7 -5
- package/lib/components/breadcrumbs/types.js +5 -0
- package/lib/components/button/button_display/_button_display.js +1 -2
- package/lib/components/button/button_empty/button_empty.js +1 -2
- package/lib/components/button/button_group/button_group.js +18 -6
- package/lib/components/button/button_group/button_group.styles.js +11 -14
- 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/button/button_icon/button_icon.js +3 -4
- package/lib/components/button/button_icon/button_icon.styles.js +10 -2
- package/lib/components/datagrid/body/cell/data_grid_cell.js +100 -58
- 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 +34 -31
- package/lib/components/datagrid/body/cell/index.js +2 -2
- package/lib/components/datagrid/body/data_grid_body.js +14 -0
- package/lib/components/datagrid/body/data_grid_body_custom.js +53 -34
- package/lib/components/datagrid/body/data_grid_body_virtualized.js +86 -55
- package/lib/components/datagrid/body/data_grid_row_manager.js +6 -4
- 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 +45 -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/facet/facet_button.styles.js +1 -2
- 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 +7 -7
- package/lib/components/icon/icon.js +12 -15
- package/lib/components/icon/icon.styles.js +5 -8
- package/lib/components/link/external_link_icon.js +10 -7
- package/lib/components/link/link.js +1 -2
- package/lib/components/link/link.styles.js +6 -14
- 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/page/page_header/page_header_content.js +4 -2
- package/lib/components/progress/progress.styles.js +1 -1
- package/lib/components/skeleton/skeleton_circle.js +1 -2
- package/lib/components/skeleton/skeleton_rectangle.js +1 -2
- package/lib/components/skeleton/skeleton_text.js +18 -11
- package/lib/components/skeleton/skeleton_title.js +1 -2
- package/lib/components/spacer/spacer.js +1 -2
- package/lib/components/text/text.js +1 -2
- package/lib/components/text/text_align.js +1 -2
- package/lib/components/text/text_align.styles.js +5 -7
- package/lib/components/text/text_color.js +1 -2
- package/lib/components/title/title.js +1 -2
- package/lib/components/title/title.styles.js +2 -10
- 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/global_styling/mixins/_typography.js +27 -19
- 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/index.js +6 -0
- package/lib/services/theme/style_memoization.js +49 -16
- package/lib/themes/amsterdam/global_styling/mixins/button.js +49 -25
- 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 -109
- 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_display/_button_display.js +2 -3
- package/optimize/es/components/button/button_empty/button_empty.js +2 -3
- package/optimize/es/components/button/button_group/button_group.js +5 -7
- package/optimize/es/components/button/button_group/button_group.styles.js +11 -14
- 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/button/button_icon/button_icon.js +4 -5
- package/optimize/es/components/button/button_icon/button_icon.styles.js +8 -3
- package/optimize/es/components/datagrid/body/cell/data_grid_cell.js +83 -56
- 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 +34 -31
- package/optimize/es/components/datagrid/body/cell/index.js +1 -1
- package/optimize/es/components/datagrid/body/data_grid_body_custom.js +40 -35
- package/optimize/es/components/datagrid/body/data_grid_body_virtualized.js +71 -49
- package/optimize/es/components/datagrid/body/data_grid_row_manager.js +7 -5
- 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 +47 -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/facet/facet_button.styles.js +1 -2
- 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/icon/icon.js +13 -16
- package/optimize/es/components/icon/icon.styles.js +6 -9
- package/optimize/es/components/link/external_link_icon.js +11 -8
- package/optimize/es/components/link/link.js +2 -3
- package/optimize/es/components/link/link.styles.js +4 -10
- 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/progress/progress.styles.js +2 -2
- package/optimize/es/components/skeleton/skeleton_circle.js +2 -3
- package/optimize/es/components/skeleton/skeleton_rectangle.js +2 -3
- package/optimize/es/components/skeleton/skeleton_text.js +16 -12
- package/optimize/es/components/skeleton/skeleton_title.js +2 -3
- package/optimize/es/components/spacer/spacer.js +2 -3
- package/optimize/es/components/text/text.js +2 -3
- package/optimize/es/components/text/text_align.js +1 -2
- package/optimize/es/components/text/text_align.styles.js +5 -7
- package/optimize/es/components/text/text_color.js +2 -3
- package/optimize/es/components/title/title.js +2 -3
- package/optimize/es/components/title/title.styles.js +0 -7
- 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/global_styling/mixins/_typography.js +14 -6
- 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/index.js +1 -1
- package/optimize/es/services/theme/style_memoization.js +47 -14
- package/optimize/es/themes/amsterdam/global_styling/mixins/button.js +47 -24
- 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 -112
- 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_display/_button_display.js +1 -2
- package/optimize/lib/components/button/button_empty/button_empty.js +1 -2
- package/optimize/lib/components/button/button_group/button_group.js +4 -6
- package/optimize/lib/components/button/button_group/button_group.styles.js +11 -14
- 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/button/button_icon/button_icon.js +3 -4
- package/optimize/lib/components/button/button_icon/button_icon.styles.js +8 -2
- package/optimize/lib/components/datagrid/body/cell/data_grid_cell.js +81 -55
- 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 +34 -31
- package/optimize/lib/components/datagrid/body/cell/index.js +2 -2
- package/optimize/lib/components/datagrid/body/data_grid_body_custom.js +39 -34
- package/optimize/lib/components/datagrid/body/data_grid_body_virtualized.js +72 -50
- package/optimize/lib/components/datagrid/body/data_grid_row_manager.js +6 -4
- 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 +45 -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/facet/facet_button.styles.js +1 -2
- 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/icon/icon.js +12 -15
- package/optimize/lib/components/icon/icon.styles.js +5 -8
- package/optimize/lib/components/link/external_link_icon.js +10 -7
- package/optimize/lib/components/link/link.js +1 -2
- package/optimize/lib/components/link/link.styles.js +6 -14
- 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/progress/progress.styles.js +1 -1
- package/optimize/lib/components/skeleton/skeleton_circle.js +1 -2
- package/optimize/lib/components/skeleton/skeleton_rectangle.js +1 -2
- package/optimize/lib/components/skeleton/skeleton_text.js +18 -11
- package/optimize/lib/components/skeleton/skeleton_title.js +1 -2
- package/optimize/lib/components/spacer/spacer.js +1 -2
- package/optimize/lib/components/text/text.js +1 -2
- package/optimize/lib/components/text/text_align.js +1 -2
- package/optimize/lib/components/text/text_align.styles.js +5 -7
- package/optimize/lib/components/text/text_color.js +1 -2
- package/optimize/lib/components/title/title.js +1 -2
- package/optimize/lib/components/title/title.styles.js +2 -10
- 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/global_styling/mixins/_typography.js +25 -19
- 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/index.js +6 -0
- package/optimize/lib/services/theme/style_memoization.js +49 -16
- package/optimize/lib/themes/amsterdam/global_styling/mixins/button.js +49 -26
- package/package.json +3 -3
- package/src/components/datagrid/_data_grid_data_row.scss +4 -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 -323
- package/test-env/components/breadcrumbs/breadcrumb.styles.js +5 -29
- package/test-env/components/breadcrumbs/breadcrumbs.js +7 -5
- package/test-env/components/breadcrumbs/types.js +5 -0
- package/test-env/components/button/button_display/_button_display.js +1 -2
- package/test-env/components/button/button_empty/button_empty.js +1 -2
- package/test-env/components/button/button_group/button_group.js +18 -6
- package/test-env/components/button/button_group/button_group.styles.js +11 -14
- 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/button/button_icon/button_icon.js +3 -4
- package/test-env/components/button/button_icon/button_icon.styles.js +8 -2
- package/test-env/components/datagrid/body/cell/data_grid_cell.js +100 -58
- 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 +34 -31
- package/test-env/components/datagrid/body/cell/index.js +2 -2
- package/test-env/components/datagrid/body/data_grid_body.js +14 -0
- package/test-env/components/datagrid/body/data_grid_body_custom.js +53 -34
- package/test-env/components/datagrid/body/data_grid_body_virtualized.js +86 -55
- package/test-env/components/datagrid/body/data_grid_row_manager.js +6 -4
- 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 +45 -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/facet/facet_button.styles.js +1 -2
- 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 +7 -7
- package/test-env/components/icon/icon.styles.js +5 -8
- package/test-env/components/link/external_link_icon.js +10 -7
- package/test-env/components/link/link.js +1 -2
- package/test-env/components/link/link.styles.js +6 -14
- package/test-env/components/modal/confirm_modal.js +2 -1
- package/test-env/components/modal/modal.js +12 -3
- package/test-env/components/page/page_header/page_header_content.js +4 -2
- package/test-env/components/progress/progress.styles.js +1 -1
- package/test-env/components/skeleton/skeleton_circle.js +1 -2
- package/test-env/components/skeleton/skeleton_rectangle.js +1 -2
- package/test-env/components/skeleton/skeleton_text.js +18 -11
- package/test-env/components/skeleton/skeleton_title.js +1 -2
- package/test-env/components/spacer/spacer.js +1 -2
- package/test-env/components/text/text.js +1 -2
- package/test-env/components/text/text_align.js +1 -2
- package/test-env/components/text/text_align.styles.js +5 -7
- package/test-env/components/text/text_color.js +1 -2
- package/test-env/components/title/title.js +1 -2
- package/test-env/components/title/title.styles.js +2 -10
- 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/global_styling/mixins/_typography.js +25 -19
- 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/index.js +6 -0
- package/test-env/services/theme/style_memoization.js +49 -16
- package/test-env/themes/amsterdam/global_styling/mixins/button.js +49 -26
- package/src/themes/charts/theme.scss +0 -5
|
@@ -38,8 +38,7 @@ var EuiTextColor = function EuiTextColor(_ref) {
|
|
|
38
38
|
style = _ref.style,
|
|
39
39
|
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
40
40
|
var isNamedColor = COLORS.includes(color);
|
|
41
|
-
var
|
|
42
|
-
var styles = (0, _text_color.euiTextColorStyles)(euiTheme);
|
|
41
|
+
var styles = (0, _services.useEuiMemoizedStyles)(_text_color.euiTextColorStyles);
|
|
43
42
|
var cssStyles = [styles.euiTextColor, isNamedColor ? styles[color] : styles.customColor];
|
|
44
43
|
|
|
45
44
|
// We're checking if is a custom color.
|
|
@@ -32,8 +32,7 @@ var EuiTitle = function EuiTitle(_ref) {
|
|
|
32
32
|
className = _ref.className,
|
|
33
33
|
textTransform = _ref.textTransform,
|
|
34
34
|
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
35
|
-
var
|
|
36
|
-
var styles = (0, _title.euiTitleStyles)(euiTheme);
|
|
35
|
+
var styles = (0, _services.useEuiMemoizedStyles)(_title.euiTitleStyles);
|
|
37
36
|
var cssStyles = [styles.euiTitle, textTransform ? styles[textTransform] : undefined, styles[size]];
|
|
38
37
|
var classes = (0, _classnames.default)('euiTitle', className, children.props.className);
|
|
39
38
|
var props = _objectSpread({
|
|
@@ -4,10 +4,9 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.
|
|
7
|
+
exports.euiTitleStyles = exports.euiTitle = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _react = require("@emotion/react");
|
|
10
|
-
var _services = require("../../services");
|
|
11
10
|
var _global_styling = require("../../global_styling");
|
|
12
11
|
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; }
|
|
13
12
|
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) { (0, _defineProperty2.default)(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; }
|
|
@@ -40,17 +39,10 @@ var euiTitle = function euiTitle(euiThemeContext) {
|
|
|
40
39
|
});
|
|
41
40
|
};
|
|
42
41
|
|
|
43
|
-
// Hook version
|
|
44
|
-
exports.euiTitle = euiTitle;
|
|
45
|
-
var useEuiTitle = function useEuiTitle(scale, options) {
|
|
46
|
-
var euiTheme = (0, _services.useEuiTheme)();
|
|
47
|
-
return euiTitle(euiTheme, scale, options);
|
|
48
|
-
};
|
|
49
|
-
|
|
50
42
|
/**
|
|
51
43
|
* Styles
|
|
52
44
|
*/
|
|
53
|
-
exports.
|
|
45
|
+
exports.euiTitle = euiTitle;
|
|
54
46
|
var _ref = process.env.NODE_ENV === "production" ? {
|
|
55
47
|
name: "1x2qsb1-uppercase",
|
|
56
48
|
styles: "text-transform:uppercase;label:uppercase;"
|
|
@@ -77,10 +77,9 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
77
77
|
var isScrollingAnimationFrame = (0, _react.useRef)(0);
|
|
78
78
|
var startScrollingAnimationFrame = (0, _react.useRef)(0);
|
|
79
79
|
var listElement = (0, _react.useRef)(null);
|
|
80
|
-
var
|
|
81
|
-
var styles = (0, _global_toast_list.euiGlobalToastListStyles)(euiTheme);
|
|
80
|
+
var styles = (0, _services.useEuiMemoizedStyles)(_global_toast_list.euiGlobalToastListStyles);
|
|
82
81
|
var cssStyles = [styles.euiGlobalToastList, styles[side]];
|
|
83
|
-
var startScrollingToBottom = function
|
|
82
|
+
var startScrollingToBottom = (0, _react.useCallback)(function () {
|
|
84
83
|
isScrollingToBottom.current = true;
|
|
85
84
|
var scrollToBottom = function scrollToBottom() {
|
|
86
85
|
// Although we cancel the requestAnimationFrame in componentWillUnmount,
|
|
@@ -103,8 +102,8 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
103
102
|
}
|
|
104
103
|
};
|
|
105
104
|
startScrollingAnimationFrame.current = window.requestAnimationFrame(scrollToBottom);
|
|
106
|
-
};
|
|
107
|
-
var onMouseEnter = function
|
|
105
|
+
}, []);
|
|
106
|
+
var onMouseEnter = (0, _react.useCallback)(function () {
|
|
108
107
|
// Stop scrolling to bottom if we're in mid-scroll, because the user wants to interact with
|
|
109
108
|
// the list.
|
|
110
109
|
isScrollingToBottom.current = false;
|
|
@@ -117,8 +116,8 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
117
116
|
timer.pause();
|
|
118
117
|
}
|
|
119
118
|
}
|
|
120
|
-
};
|
|
121
|
-
var onMouseLeave = function
|
|
119
|
+
}, []);
|
|
120
|
+
var onMouseLeave = (0, _react.useCallback)(function () {
|
|
122
121
|
isUserInteracting.current = false;
|
|
123
122
|
for (var _toastId2 in toastIdToTimerMap.current) {
|
|
124
123
|
if (toastIdToTimerMap.current.hasOwnProperty(_toastId2)) {
|
|
@@ -126,8 +125,8 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
126
125
|
timer.resume();
|
|
127
126
|
}
|
|
128
127
|
}
|
|
129
|
-
};
|
|
130
|
-
var onScroll = function
|
|
128
|
+
}, []);
|
|
129
|
+
var onScroll = (0, _react.useCallback)(function () {
|
|
131
130
|
// Given that this method also gets invoked by the synthetic scroll that happens when a new toast gets added,
|
|
132
131
|
// we want to evaluate if the scroll bottom has been reached only when the user is interacting with the toast,
|
|
133
132
|
// this way we always retain the scroll position the user has set despite adding in new toasts.
|
|
@@ -135,7 +134,7 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
135
134
|
if (listElement.current && isUserInteracting.current) {
|
|
136
135
|
isScrolledToBottom.current = listElement.current.scrollHeight - listElement.current.scrollTop === listElement.current.clientHeight;
|
|
137
136
|
}
|
|
138
|
-
};
|
|
137
|
+
}, []);
|
|
139
138
|
var dismissToast = (0, _react.useCallback)(function (toast) {
|
|
140
139
|
// Remove the toast after it's done fading out.
|
|
141
140
|
dismissTimeoutIds.current.push(window.setTimeout(function () {
|
|
@@ -158,34 +157,29 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
158
157
|
}
|
|
159
158
|
});
|
|
160
159
|
}, [scheduleToastForDismissal, toasts]);
|
|
161
|
-
var addListeners = function addListeners() {
|
|
162
|
-
if (listElement.current) {
|
|
163
|
-
listElement.current.addEventListener('scroll', onScroll);
|
|
164
|
-
listElement.current.addEventListener('mouseenter', onMouseEnter);
|
|
165
|
-
listElement.current.addEventListener('mouseleave', onMouseLeave);
|
|
166
|
-
}
|
|
167
|
-
};
|
|
168
|
-
var removeListeners = function removeListeners() {
|
|
169
|
-
if (listElement.current) {
|
|
170
|
-
listElement.current.removeEventListener('scroll', onScroll);
|
|
171
|
-
listElement.current.removeEventListener('mouseenter', onMouseEnter);
|
|
172
|
-
listElement.current.removeEventListener('mouseleave', onMouseLeave);
|
|
173
|
-
}
|
|
174
|
-
};
|
|
175
160
|
|
|
176
161
|
// componentDidMount
|
|
177
162
|
(0, _react.useEffect)(function () {
|
|
178
|
-
|
|
163
|
+
var listenerEl = listElement.current;
|
|
164
|
+
if (listenerEl) {
|
|
165
|
+
listenerEl.addEventListener('scroll', onScroll);
|
|
166
|
+
listenerEl.addEventListener('mouseenter', onMouseEnter);
|
|
167
|
+
listenerEl.addEventListener('mouseleave', onMouseLeave);
|
|
168
|
+
}
|
|
179
169
|
|
|
180
170
|
// componentWillUnmount
|
|
181
171
|
return function () {
|
|
172
|
+
if (listenerEl) {
|
|
173
|
+
listenerEl.removeEventListener('scroll', onScroll);
|
|
174
|
+
listenerEl.removeEventListener('mouseenter', onMouseEnter);
|
|
175
|
+
listenerEl.removeEventListener('mouseleave', onMouseLeave);
|
|
176
|
+
}
|
|
182
177
|
if (isScrollingAnimationFrame.current !== 0) {
|
|
183
178
|
window.cancelAnimationFrame(isScrollingAnimationFrame.current);
|
|
184
179
|
}
|
|
185
180
|
if (startScrollingAnimationFrame.current !== 0) {
|
|
186
181
|
window.cancelAnimationFrame(startScrollingAnimationFrame.current);
|
|
187
182
|
}
|
|
188
|
-
removeListeners();
|
|
189
183
|
dismissTimeoutIds.current.forEach(clearTimeout); // eslint-disable-line react-hooks/exhaustive-deps
|
|
190
184
|
for (var _toastId3 in toastIdToTimerMap.current) {
|
|
191
185
|
if (toastIdToTimerMap.current.hasOwnProperty(_toastId3)) {
|
|
@@ -194,7 +188,7 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
194
188
|
}
|
|
195
189
|
}
|
|
196
190
|
};
|
|
197
|
-
}, []);
|
|
191
|
+
}, [onMouseEnter, onMouseLeave, onScroll]);
|
|
198
192
|
|
|
199
193
|
// componentDidUpdate
|
|
200
194
|
(0, _react.useEffect)(function () {
|
|
@@ -209,7 +203,7 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
209
203
|
}
|
|
210
204
|
}
|
|
211
205
|
prevToasts.current = toasts;
|
|
212
|
-
}, [toasts, scheduleAllToastsForDismissal]);
|
|
206
|
+
}, [toasts, scheduleAllToastsForDismissal, startScrollingToBottom]);
|
|
213
207
|
|
|
214
208
|
// Toast dismissal side effect
|
|
215
209
|
// Ensure the callback has correct state by not enclosing it in `setTimeout`
|
|
@@ -230,49 +224,52 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
230
224
|
});
|
|
231
225
|
}
|
|
232
226
|
}, [toastToDismiss, dismissToastProp]);
|
|
233
|
-
var renderedToasts =
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
key: toast.id,
|
|
242
|
-
isDismissed: toastIdToDismissedMap[toast.id]
|
|
243
|
-
}, (0, _react2.jsx)(_toast.EuiToast, (0, _extends2.default)({
|
|
244
|
-
onClose: onClose,
|
|
245
|
-
onFocus: onMouseEnter,
|
|
246
|
-
onBlur: onMouseLeave
|
|
247
|
-
}, rest), text));
|
|
248
|
-
});
|
|
249
|
-
if (showClearAllButtonAt && toasts.length >= showClearAllButtonAt) {
|
|
250
|
-
var dismissAllToasts = function dismissAllToasts() {
|
|
251
|
-
toasts.forEach(function (toast) {
|
|
252
|
-
return dismissToastProp(toast);
|
|
253
|
-
});
|
|
254
|
-
onClearAllToasts === null || onClearAllToasts === void 0 ? void 0 : onClearAllToasts();
|
|
255
|
-
};
|
|
256
|
-
renderedToasts.push((0, _react2.jsx)(_i18n.EuiI18n, {
|
|
257
|
-
key: "euiClearAllToasts",
|
|
258
|
-
tokens: ['euiGlobalToastList.clearAllToastsButtonAriaLabel', 'euiGlobalToastList.clearAllToastsButtonDisplayText'],
|
|
259
|
-
defaults: ['Clear all toast notifications', 'Clear all']
|
|
260
|
-
}, function (_ref2) {
|
|
261
|
-
var _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
|
|
262
|
-
clearAllToastsButtonAriaLabel = _ref3[0],
|
|
263
|
-
clearAllToastsButtonDisplayText = _ref3[1];
|
|
227
|
+
var renderedToasts = (0, _react.useMemo)(function () {
|
|
228
|
+
return toasts.map(function (toast) {
|
|
229
|
+
var text = toast.text,
|
|
230
|
+
toastLifeTimeMs = toast.toastLifeTimeMs,
|
|
231
|
+
rest = (0, _objectWithoutProperties2.default)(toast, _excluded2);
|
|
232
|
+
var onClose = function onClose() {
|
|
233
|
+
return dismissToast(toast);
|
|
234
|
+
};
|
|
264
235
|
return (0, _react2.jsx)(_global_toast_list_item.EuiGlobalToastListItem, {
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
236
|
+
key: toast.id,
|
|
237
|
+
isDismissed: toastIdToDismissedMap[toast.id]
|
|
238
|
+
}, (0, _react2.jsx)(_toast.EuiToast, (0, _extends2.default)({
|
|
239
|
+
onClose: onClose,
|
|
240
|
+
onFocus: onMouseEnter,
|
|
241
|
+
onBlur: onMouseLeave
|
|
242
|
+
}, rest), text));
|
|
243
|
+
});
|
|
244
|
+
}, [toasts, toastIdToDismissedMap, dismissToast, onMouseEnter, onMouseLeave]);
|
|
245
|
+
var clearAllButton = (0, _react.useMemo)(function () {
|
|
246
|
+
if (toasts.length && showClearAllButtonAt && toasts.length >= showClearAllButtonAt) {
|
|
247
|
+
return (0, _react2.jsx)(_i18n.EuiI18n, {
|
|
248
|
+
key: "euiClearAllToasts",
|
|
249
|
+
tokens: ['euiGlobalToastList.clearAllToastsButtonAriaLabel', 'euiGlobalToastList.clearAllToastsButtonDisplayText'],
|
|
250
|
+
defaults: ['Clear all toast notifications', 'Clear all']
|
|
251
|
+
}, function (_ref2) {
|
|
252
|
+
var _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
|
|
253
|
+
clearAllToastsButtonAriaLabel = _ref3[0],
|
|
254
|
+
clearAllToastsButtonDisplayText = _ref3[1];
|
|
255
|
+
return (0, _react2.jsx)(_global_toast_list_item.EuiGlobalToastListItem, {
|
|
256
|
+
isDismissed: false
|
|
257
|
+
}, (0, _react2.jsx)(_button.EuiButton, {
|
|
258
|
+
fill: true,
|
|
259
|
+
color: "text",
|
|
260
|
+
onClick: function onClick() {
|
|
261
|
+
toasts.forEach(function (toast) {
|
|
262
|
+
return dismissToastProp(toast);
|
|
263
|
+
});
|
|
264
|
+
onClearAllToasts === null || onClearAllToasts === void 0 ? void 0 : onClearAllToasts();
|
|
265
|
+
},
|
|
266
|
+
css: styles.euiGlobalToastListDismissButton,
|
|
267
|
+
"aria-label": clearAllToastsButtonAriaLabel,
|
|
268
|
+
"data-test-subj": "euiClearAllToastsButton"
|
|
269
|
+
}, clearAllToastsButtonDisplayText));
|
|
270
|
+
});
|
|
271
|
+
}
|
|
272
|
+
}, [showClearAllButtonAt, onClearAllToasts, toasts, dismissToastProp, styles]);
|
|
276
273
|
var classes = (0, _classnames.default)('euiGlobalToastList', className);
|
|
277
274
|
return (0, _react2.jsx)("div", (0, _extends2.default)({
|
|
278
275
|
"aria-live": "polite",
|
|
@@ -280,7 +277,7 @@ var EuiGlobalToastList = function EuiGlobalToastList(_ref) {
|
|
|
280
277
|
ref: listElement,
|
|
281
278
|
css: cssStyles,
|
|
282
279
|
className: classes
|
|
283
|
-
}, rest), renderedToasts);
|
|
280
|
+
}, rest), renderedToasts, clearAllButton);
|
|
284
281
|
};
|
|
285
282
|
exports.EuiGlobalToastList = EuiGlobalToastList;
|
|
286
283
|
EuiGlobalToastList.propTypes = {
|
|
@@ -36,47 +36,11 @@ var EuiToast = function EuiToast(_ref) {
|
|
|
36
36
|
children = _ref.children,
|
|
37
37
|
className = _ref.className,
|
|
38
38
|
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
39
|
-
var
|
|
40
|
-
var baseStyles = (0, _toast.euiToastStyles)(euiTheme);
|
|
39
|
+
var baseStyles = (0, _services.useEuiMemoizedStyles)(_toast.euiToastStyles);
|
|
41
40
|
var baseCss = [baseStyles.euiToast, color && baseStyles[color]];
|
|
42
|
-
var
|
|
43
|
-
var headerStyles = (0, _toast.euiToastHeaderStyles)(euiTheme);
|
|
41
|
+
var headerStyles = (0, _services.useEuiMemoizedStyles)(_toast.euiToastHeaderStyles);
|
|
44
42
|
var headerCss = [headerStyles.euiToastHeader, children && headerStyles.withBody];
|
|
45
43
|
var classes = (0, _classnames.default)('euiToast', className);
|
|
46
|
-
var headerIcon;
|
|
47
|
-
if (iconType) {
|
|
48
|
-
headerIcon = (0, _react2.jsx)(_icon.EuiIcon, {
|
|
49
|
-
css: headerStyles.euiToastHeader__icon,
|
|
50
|
-
type: iconType,
|
|
51
|
-
size: "m",
|
|
52
|
-
"aria-hidden": "true"
|
|
53
|
-
});
|
|
54
|
-
}
|
|
55
|
-
var closeButton;
|
|
56
|
-
if (onClose) {
|
|
57
|
-
closeButton = (0, _react2.jsx)(_i18n.EuiI18n, {
|
|
58
|
-
token: "euiToast.dismissToast",
|
|
59
|
-
default: "Dismiss toast"
|
|
60
|
-
}, function (dismissToast) {
|
|
61
|
-
return (0, _react2.jsx)(_button.EuiButtonIcon, {
|
|
62
|
-
css: baseStyles.euiToast__closeButton,
|
|
63
|
-
iconType: "cross",
|
|
64
|
-
color: "text",
|
|
65
|
-
size: "xs",
|
|
66
|
-
"aria-label": dismissToast,
|
|
67
|
-
onClick: onClose,
|
|
68
|
-
"data-test-subj": "toastCloseButton"
|
|
69
|
-
});
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
var optionalBody;
|
|
73
|
-
if (children) {
|
|
74
|
-
optionalBody = (0, _react2.jsx)(_text.EuiText, {
|
|
75
|
-
css: bodyStyles.euiToastBody,
|
|
76
|
-
size: "s",
|
|
77
|
-
"data-test-subj": "euiToastBody"
|
|
78
|
-
}, children);
|
|
79
|
-
}
|
|
80
44
|
return (0, _react2.jsx)("div", (0, _extends2.default)({
|
|
81
45
|
css: baseCss,
|
|
82
46
|
className: classes
|
|
@@ -91,11 +55,32 @@ var EuiToast = function EuiToast(_ref) {
|
|
|
91
55
|
css: headerCss,
|
|
92
56
|
"aria-label": notification,
|
|
93
57
|
"data-test-subj": "euiToastHeader"
|
|
94
|
-
},
|
|
58
|
+
}, iconType && (0, _react2.jsx)(_icon.EuiIcon, {
|
|
59
|
+
css: headerStyles.euiToastHeader__icon,
|
|
60
|
+
type: iconType,
|
|
61
|
+
size: "m",
|
|
62
|
+
"aria-hidden": "true"
|
|
63
|
+
}), (0, _react2.jsx)("span", {
|
|
95
64
|
css: headerStyles.euiToastHeader__title,
|
|
96
65
|
"data-test-subj": "euiToastHeader__title"
|
|
97
66
|
}, title));
|
|
98
|
-
}),
|
|
67
|
+
}), onClose && (0, _react2.jsx)(_i18n.EuiI18n, {
|
|
68
|
+
token: "euiToast.dismissToast",
|
|
69
|
+
default: "Dismiss toast"
|
|
70
|
+
}, function (dismissToast) {
|
|
71
|
+
return (0, _react2.jsx)(_button.EuiButtonIcon, {
|
|
72
|
+
css: baseStyles.euiToast__closeButton,
|
|
73
|
+
iconType: "cross",
|
|
74
|
+
color: "text",
|
|
75
|
+
size: "xs",
|
|
76
|
+
"aria-label": dismissToast,
|
|
77
|
+
onClick: onClose,
|
|
78
|
+
"data-test-subj": "toastCloseButton"
|
|
79
|
+
});
|
|
80
|
+
}), children && (0, _react2.jsx)(_text.EuiText, {
|
|
81
|
+
size: "s",
|
|
82
|
+
"data-test-subj": "euiToastBody"
|
|
83
|
+
}, children));
|
|
99
84
|
};
|
|
100
85
|
exports.EuiToast = EuiToast;
|
|
101
86
|
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;
|
|
@@ -1,20 +1,23 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
|
-
exports.
|
|
7
|
+
exports.useEuiFontSize = exports.euiTextTruncate = exports.euiTextBreakWord = exports.euiNumberFormat = exports.euiFontSize = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
7
9
|
var _typography = require("../functions/typography");
|
|
8
|
-
var
|
|
10
|
+
var _theme = require("../../services/theme");
|
|
11
|
+
var _typography2 = require("../variables/typography");
|
|
9
12
|
var _functions = require("../functions");
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
13
|
+
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; }
|
|
14
|
+
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) { (0, _defineProperty2.default)(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; } /*
|
|
15
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
16
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
17
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
18
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
19
|
+
* Side Public License, v 1.
|
|
20
|
+
*/
|
|
18
21
|
/**
|
|
19
22
|
* Returns font-size and line-height
|
|
20
23
|
*/
|
|
@@ -27,15 +30,23 @@ var euiFontSize = function euiFontSize(_ref, scale, options) {
|
|
|
27
30
|
};
|
|
28
31
|
exports.euiFontSize = euiFontSize;
|
|
29
32
|
var useEuiFontSize = function useEuiFontSize(scale, options) {
|
|
30
|
-
var euiTheme = (0,
|
|
31
|
-
|
|
33
|
+
var euiTheme = (0, _theme.useEuiTheme)();
|
|
34
|
+
var memoizedFontSizes = (0, _theme.useEuiMemoizedStyles)(euiFontSizes);
|
|
35
|
+
return !options ? memoizedFontSizes[scale] : euiFontSize(euiTheme, scale, options);
|
|
36
|
+
};
|
|
37
|
+
// Memomize a basic set of font sizes. We unfortunately can't
|
|
38
|
+
// memoize all possible options, there's too many permutations
|
|
39
|
+
exports.useEuiFontSize = useEuiFontSize;
|
|
40
|
+
var euiFontSizes = function euiFontSizes(euiThemeContext) {
|
|
41
|
+
return _typography2.EuiThemeFontScales.reduce(function (map, scale) {
|
|
42
|
+
return _objectSpread(_objectSpread({}, map), {}, (0, _defineProperty2.default)({}, scale, euiFontSize(euiThemeContext, scale)));
|
|
43
|
+
}, {});
|
|
32
44
|
};
|
|
33
45
|
|
|
34
46
|
/**
|
|
35
47
|
* Force text to wrap on natural word breaks (e.g. spaces & hyphens)
|
|
36
48
|
* https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/
|
|
37
49
|
*/
|
|
38
|
-
exports.useEuiFontSize = useEuiFontSize;
|
|
39
50
|
var euiTextBreakWord = function euiTextBreakWord() {
|
|
40
51
|
return "\n overflow-wrap: break-word !important; // makes sure the long string will wrap and not bust out of the container\n word-break: break-word;\n";
|
|
41
52
|
};
|
|
@@ -58,9 +69,4 @@ var euiNumberFormat = function euiNumberFormat(_ref2) {
|
|
|
58
69
|
var euiTheme = _ref2.euiTheme;
|
|
59
70
|
return "\n font-feature-settings: ".concat(euiTheme.font.featureSettings, ", 'tnum' 1;\n");
|
|
60
71
|
};
|
|
61
|
-
exports.euiNumberFormat = euiNumberFormat;
|
|
62
|
-
var useEuiNumberFormat = function useEuiNumberFormat() {
|
|
63
|
-
var euiTheme = (0, _hooks.useEuiTheme)();
|
|
64
|
-
return euiNumberFormat(euiTheme);
|
|
65
|
-
};
|
|
66
|
-
exports.useEuiNumberFormat = useEuiNumberFormat;
|
|
72
|
+
exports.euiNumberFormat = euiNumberFormat;
|
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.euiPaletteWarm = exports.euiPalettePositive = exports.euiPaletteNegative = exports.euiPaletteGray = exports.euiPaletteForTemperature = exports.euiPaletteForStatus = exports.euiPaletteForLightBackground = exports.euiPaletteForDarkBackground = exports.euiPaletteCool = exports.euiPaletteComplementary = exports.euiPaletteColorBlindBehindText = exports.euiPaletteColorBlind = void 0;
|
|
7
|
+
exports.euiPaletteWarm = exports.euiPaletteRed = exports.euiPalettePositive = exports.euiPaletteNegative = exports.euiPaletteGreen = exports.euiPaletteGray = exports.euiPaletteForTemperature = exports.euiPaletteForStatus = exports.euiPaletteForLightBackground = exports.euiPaletteForDarkBackground = exports.euiPaletteCool = exports.euiPaletteComplementary = exports.euiPaletteColorBlindBehindText = exports.euiPaletteColorBlind = void 0;
|
|
8
8
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
9
9
|
var _chromaJs = _interopRequireDefault(require("chroma-js"));
|
|
10
10
|
var _color_palette = require("./color_palette");
|
|
@@ -129,19 +129,19 @@ var euiPaletteForDarkBackground = function euiPaletteForDarkBackground() {
|
|
|
129
129
|
return ['#1BA9F5', '#7DE2D1', '#F990C0', '#F66', '#FFCE7A'];
|
|
130
130
|
};
|
|
131
131
|
exports.euiPaletteForDarkBackground = euiPaletteForDarkBackground;
|
|
132
|
-
var
|
|
133
|
-
var
|
|
134
|
-
var
|
|
132
|
+
var greenColor = '#209280';
|
|
133
|
+
var redColor = '#CC5642';
|
|
134
|
+
var lightRedColor = euiPaletteColorBlind()[9];
|
|
135
135
|
var coolArray = [euiPaletteColorBlind()[1], '#6092C0'];
|
|
136
136
|
var warmArray = [euiPaletteColorBlind()[7], euiPaletteColorBlind()[9]];
|
|
137
137
|
var euiPaletteForStatus = function euiPaletteForStatus(steps) {
|
|
138
138
|
if (steps === 1) {
|
|
139
|
-
return [
|
|
139
|
+
return [greenColor];
|
|
140
140
|
}
|
|
141
141
|
if (steps <= 3) {
|
|
142
|
-
return euiPalette([
|
|
142
|
+
return euiPalette([greenColor, euiPaletteColorBlind()[5], redColor], steps, true);
|
|
143
143
|
}
|
|
144
|
-
return euiPalette([
|
|
144
|
+
return euiPalette([greenColor, euiPaletteColorBlind()[0], euiPaletteColorBlind()[5], lightRedColor, redColor], steps, true);
|
|
145
145
|
};
|
|
146
146
|
exports.euiPaletteForStatus = euiPaletteForStatus;
|
|
147
147
|
var euiPaletteForTemperature = function euiPaletteForTemperature(steps) {
|
|
@@ -150,7 +150,7 @@ var euiPaletteForTemperature = function euiPaletteForTemperature(steps) {
|
|
|
150
150
|
if (steps === 1) {
|
|
151
151
|
return [cools[0]];
|
|
152
152
|
} else if (steps <= 3) {
|
|
153
|
-
return euiPalette([cools[0],
|
|
153
|
+
return euiPalette([cools[0], lightRedColor], steps, true);
|
|
154
154
|
}
|
|
155
155
|
return euiPalette([].concat((0, _toConsumableArray2.default)(cools), (0, _toConsumableArray2.default)(warms)), steps, true);
|
|
156
156
|
};
|
|
@@ -162,19 +162,29 @@ var euiPaletteComplementary = function euiPaletteComplementary(steps) {
|
|
|
162
162
|
return euiPalette([euiPaletteColorBlind()[1], euiPaletteColorBlind()[7]], steps, true);
|
|
163
163
|
};
|
|
164
164
|
exports.euiPaletteComplementary = euiPaletteComplementary;
|
|
165
|
-
var
|
|
165
|
+
var euiPaletteRed = function euiPaletteRed(steps) {
|
|
166
166
|
if (steps === 1) {
|
|
167
|
-
return [
|
|
167
|
+
return [lightRedColor];
|
|
168
168
|
}
|
|
169
|
-
return euiPalette(['white',
|
|
169
|
+
return euiPalette(['white', redColor], steps);
|
|
170
170
|
};
|
|
171
|
+
/**
|
|
172
|
+
* @deprecated - use `euiPaletteRed` instead
|
|
173
|
+
*/
|
|
174
|
+
exports.euiPaletteRed = euiPaletteRed;
|
|
175
|
+
var euiPaletteNegative = euiPaletteRed;
|
|
171
176
|
exports.euiPaletteNegative = euiPaletteNegative;
|
|
172
|
-
var
|
|
177
|
+
var euiPaletteGreen = function euiPaletteGreen(steps) {
|
|
173
178
|
if (steps === 1) {
|
|
174
179
|
return [euiPaletteColorBlind()[0]];
|
|
175
180
|
}
|
|
176
|
-
return euiPalette(['white',
|
|
181
|
+
return euiPalette(['white', greenColor], steps);
|
|
177
182
|
};
|
|
183
|
+
/**
|
|
184
|
+
* @deprecated - use `euiPaletteGreen` instead
|
|
185
|
+
*/
|
|
186
|
+
exports.euiPaletteGreen = euiPaletteGreen;
|
|
187
|
+
var euiPalettePositive = euiPaletteGreen;
|
|
178
188
|
exports.euiPalettePositive = euiPalettePositive;
|
|
179
189
|
var euiPaletteCool = function euiPaletteCool(steps) {
|
|
180
190
|
if (steps === 1) {
|
|
@@ -185,7 +195,7 @@ var euiPaletteCool = function euiPaletteCool(steps) {
|
|
|
185
195
|
exports.euiPaletteCool = euiPaletteCool;
|
|
186
196
|
var euiPaletteWarm = function euiPaletteWarm(steps) {
|
|
187
197
|
if (steps === 1) {
|
|
188
|
-
return [
|
|
198
|
+
return [lightRedColor];
|
|
189
199
|
}
|
|
190
200
|
return euiPalette(['#FBFBDC'].concat(warmArray), steps);
|
|
191
201
|
};
|
|
@@ -24,6 +24,8 @@ var _exportNames = {
|
|
|
24
24
|
euiPaletteForStatus: true,
|
|
25
25
|
euiPaletteForTemperature: true,
|
|
26
26
|
euiPaletteComplementary: true,
|
|
27
|
+
euiPaletteRed: true,
|
|
28
|
+
euiPaletteGreen: true,
|
|
27
29
|
euiPaletteNegative: true,
|
|
28
30
|
euiPalettePositive: true,
|
|
29
31
|
euiPaletteCool: true,
|
|
@@ -115,6 +117,12 @@ Object.defineProperty(exports, "euiPaletteGray", {
|
|
|
115
117
|
return _eui_palettes.euiPaletteGray;
|
|
116
118
|
}
|
|
117
119
|
});
|
|
120
|
+
Object.defineProperty(exports, "euiPaletteGreen", {
|
|
121
|
+
enumerable: true,
|
|
122
|
+
get: function get() {
|
|
123
|
+
return _eui_palettes.euiPaletteGreen;
|
|
124
|
+
}
|
|
125
|
+
});
|
|
118
126
|
Object.defineProperty(exports, "euiPaletteNegative", {
|
|
119
127
|
enumerable: true,
|
|
120
128
|
get: function get() {
|
|
@@ -127,6 +135,12 @@ Object.defineProperty(exports, "euiPalettePositive", {
|
|
|
127
135
|
return _eui_palettes.euiPalettePositive;
|
|
128
136
|
}
|
|
129
137
|
});
|
|
138
|
+
Object.defineProperty(exports, "euiPaletteRed", {
|
|
139
|
+
enumerable: true,
|
|
140
|
+
get: function get() {
|
|
141
|
+
return _eui_palettes.euiPaletteRed;
|
|
142
|
+
}
|
|
143
|
+
});
|
|
130
144
|
Object.defineProperty(exports, "euiPaletteWarm", {
|
|
131
145
|
enumerable: true,
|
|
132
146
|
get: function get() {
|
|
@@ -47,6 +47,17 @@ Object.keys(_useLatest).forEach(function (key) {
|
|
|
47
47
|
}
|
|
48
48
|
});
|
|
49
49
|
});
|
|
50
|
+
var _useDeepEqual = require("./useDeepEqual");
|
|
51
|
+
Object.keys(_useDeepEqual).forEach(function (key) {
|
|
52
|
+
if (key === "default" || key === "__esModule") return;
|
|
53
|
+
if (key in exports && exports[key] === _useDeepEqual[key]) return;
|
|
54
|
+
Object.defineProperty(exports, key, {
|
|
55
|
+
enumerable: true,
|
|
56
|
+
get: function get() {
|
|
57
|
+
return _useDeepEqual[key];
|
|
58
|
+
}
|
|
59
|
+
});
|
|
60
|
+
});
|
|
50
61
|
var _useMouseMove = require("./useMouseMove");
|
|
51
62
|
Object.keys(_useMouseMove).forEach(function (key) {
|
|
52
63
|
if (key === "default" || key === "__esModule") return;
|