diff --git a/src/platform/packages/shared/kbn-coloring/src/shared_components/color_mapping/components/assignment/assignment.tsx b/src/platform/packages/shared/kbn-coloring/src/shared_components/color_mapping/components/assignment/assignment.tsx index b56e05ad7aebe..439d0ccb113dc 100644 --- a/src/platform/packages/shared/kbn-coloring/src/shared_components/color_mapping/components/assignment/assignment.tsx +++ b/src/platform/packages/shared/kbn-coloring/src/shared_components/color_mapping/components/assignment/assignment.tsx @@ -9,7 +9,7 @@ import React from 'react'; import { useDispatch } from 'react-redux'; -import { EuiButtonIcon, EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { EuiButtonIcon, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { css } from '@emotion/react'; import { euiThemeVars } from '@kbn/ui-theme'; @@ -123,32 +123,39 @@ export function Assignment({ )} - dispatch(removeAssignment(index))} - aria-label={i18n.translate( - 'coloring.colorMapping.assignments.deleteAssignmentButtonLabel', - { - defaultMessage: 'Delete this assignment', + + dispatch(removeAssignment(index))} + aria-label={i18n.translate( + 'coloring.colorMapping.assignments.deleteAssignmentButtonLabel', + { + defaultMessage: 'Delete this assignment', + } + )} + color="danger" + css={ + !disableDelete + ? css` + color: ${euiThemeVars.euiTextColor}; + transition: ${euiThemeVars.euiAnimSpeedFast} ease-in-out; + transition-property: color; + &:hover, + &:focus { + color: ${euiThemeVars.euiColorDangerText}; + } + ` + : undefined } - )} - color="danger" - css={ - !disableDelete - ? css` - color: ${euiThemeVars.euiTextColor}; - transition: ${euiThemeVars.euiAnimSpeedFast} ease-in-out; - transition-property: color; - &:hover, - &:focus { - color: ${euiThemeVars.euiColorDangerText}; - } - ` - : undefined - } - /> + /> + ); diff --git a/src/platform/packages/shared/kbn-coloring/src/shared_components/color_mapping/components/container/assignments.tsx b/src/platform/packages/shared/kbn-coloring/src/shared_components/color_mapping/components/container/assignments.tsx index d956f84b38b1b..a13ebe13fca01 100644 --- a/src/platform/packages/shared/kbn-coloring/src/shared_components/color_mapping/components/container/assignments.tsx +++ b/src/platform/packages/shared/kbn-coloring/src/shared_components/color_mapping/components/container/assignments.tsx @@ -22,6 +22,7 @@ import { EuiPanel, EuiPopover, EuiText, + EuiToolTip, } from '@elastic/eui'; import { css } from '@emotion/react'; import React, { useCallback, useMemo, useState } from 'react'; @@ -241,17 +242,27 @@ export function Assignments({ } )} button={ - setShowOtherActions(true)} - /> + disableScreenReaderOutput + > + setShowOtherActions(true)} + /> + } isOpen={showOtherActions} closePopover={() => setShowOtherActions(false)} diff --git a/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item.tsx b/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item.tsx index 82d3adc593c8f..c71dc754a6ef0 100644 --- a/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item.tsx +++ b/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item.tsx @@ -14,13 +14,14 @@ import React, { useState, useCallback, useContext, useMemo } from 'react'; import { css } from '@emotion/react'; import { - EuiFieldNumber, + EuiButtonIcon, EuiColorPicker, - EuiFlexItem, + EuiColorPickerSwatch, + EuiFieldNumber, EuiFlexGroup, + EuiFlexItem, EuiIcon, - EuiColorPickerSwatch, - EuiButtonIcon, + EuiToolTip, useEuiTheme, } from '@elastic/eui'; @@ -181,12 +182,14 @@ export function ColorRangeItem({ style={{ width: euiTheme.size.xl, height: euiTheme.size.xl }} /> ) : ( - + + + ) } secondaryInputDisplay="top" diff --git a/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item_buttons.tsx b/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item_buttons.tsx index 52eda5ee8786d..14c58753ebe1d 100644 --- a/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item_buttons.tsx +++ b/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_item_buttons.tsx @@ -12,7 +12,7 @@ import React, { useCallback, useContext } from 'react'; import { i18n } from '@kbn/i18n'; import type { EuiIconProps } from '@elastic/eui'; -import { EuiButtonIcon } from '@elastic/eui'; +import { EuiButtonIcon, EuiToolTip } from '@elastic/eui'; import { TooltipWrapper } from '@kbn/visualization-utils'; import type { PaletteContinuity, CustomPaletteParams } from '../../../palettes'; @@ -57,14 +57,15 @@ export function ColorRangeDeleteButton({ index, dispatch }: ColorRangesItemButto }); return ( - + + + ); } @@ -105,13 +106,15 @@ export function ColorRangeEditButton({ return ( - + + + ); } @@ -137,14 +140,16 @@ export function ColorRangeAutoDetectButton({ return ( - + + + ); } diff --git a/src/platform/packages/shared/kbn-visualization-ui-components/components/dimension_buttons/dimension_button.tsx b/src/platform/packages/shared/kbn-visualization-ui-components/components/dimension_buttons/dimension_button.tsx index a6029cbfeeecd..8020d4b15b24a 100644 --- a/src/platform/packages/shared/kbn-visualization-ui-components/components/dimension_buttons/dimension_button.tsx +++ b/src/platform/packages/shared/kbn-visualization-ui-components/components/dimension_buttons/dimension_button.tsx @@ -103,37 +103,44 @@ function DimensionButtonImpl({ - onRemoveClick(accessorConfig.columnId)} - css={css` - color: ${euiTheme.colors.textSubdued} - transition: ${euiTheme.animation.fast} ease-in-out; - transition-property: color, opacity, background-color, transform; - opacity: 0; + disableScreenReaderOutput + > + onRemoveClick(accessorConfig.columnId)} + css={css` + color: ${euiTheme.colors.textSubdued} + transition: ${euiTheme.animation.fast} ease-in-out; + transition-property: color, opacity, background-color, transform; + opacity: 0; - .domDraggable:hover &, - .domDraggable:focus-within & { - opacity: 1; - } - &:hover, - &:focus { - color: ${euiTheme.colors.textDanger}; - } - `} - /> + .domDraggable:hover &, + .domDraggable:focus-within & { + opacity: 1; + } + &:hover, + &:focus { + color: ${euiTheme.colors.textDanger}; + } + `} + /> + ); diff --git a/src/platform/packages/shared/kbn-visualization-ui-components/components/drag_drop_bucket/default_bucket_container.tsx b/src/platform/packages/shared/kbn-visualization-ui-components/components/drag_drop_bucket/default_bucket_container.tsx index 5ba2a0a1b912c..23e664e03b891 100644 --- a/src/platform/packages/shared/kbn-visualization-ui-components/components/drag_drop_bucket/default_bucket_container.tsx +++ b/src/platform/packages/shared/kbn-visualization-ui-components/components/drag_drop_bucket/default_bucket_container.tsx @@ -15,6 +15,7 @@ import { EuiFlexItem, EuiIcon, EuiPanel, + EuiToolTip, useEuiTheme, } from '@elastic/eui'; import { TooltipWrapper } from '@kbn/visualization-utils'; @@ -88,15 +89,17 @@ export const DefaultBucketContainer = ({ )} condition={isNotRemovable ?? false} > - + + + diff --git a/src/platform/packages/shared/kbn-visualization-ui-components/components/drag_drop_bucket/fields_bucket_container.tsx b/src/platform/packages/shared/kbn-visualization-ui-components/components/drag_drop_bucket/fields_bucket_container.tsx index 9db20e2d2111c..4a66788208138 100644 --- a/src/platform/packages/shared/kbn-visualization-ui-components/components/drag_drop_bucket/fields_bucket_container.tsx +++ b/src/platform/packages/shared/kbn-visualization-ui-components/components/drag_drop_bucket/fields_bucket_container.tsx @@ -15,6 +15,7 @@ import { EuiFlexItem, EuiIcon, EuiPanel, + EuiToolTip, useEuiTheme, } from '@elastic/eui'; import { TooltipWrapper } from '@kbn/visualization-utils'; @@ -78,14 +79,16 @@ export const FieldsBucketContainer = ({ )} condition={isNotRemovable ?? false} > - + + + diff --git a/src/platform/plugins/private/event_annotation_listing/public/components/group_editor_flyout/group_editor_flyout.tsx b/src/platform/plugins/private/event_annotation_listing/public/components/group_editor_flyout/group_editor_flyout.tsx index 79efdcf257f9b..0bb128224f879 100644 --- a/src/platform/plugins/private/event_annotation_listing/public/components/group_editor_flyout/group_editor_flyout.tsx +++ b/src/platform/plugins/private/event_annotation_listing/public/components/group_editor_flyout/group_editor_flyout.tsx @@ -8,18 +8,19 @@ */ import { + EuiButton, + EuiButtonEmpty, + EuiButtonIcon, + EuiFlexGroup, + EuiFlexItem, EuiFlyout, - EuiFlyoutHeader, - EuiTitle, EuiFlyoutBody, EuiFlyoutFooter, - EuiFlexGroup, - EuiFlexItem, - EuiButtonEmpty, - EuiButton, + EuiFlyoutHeader, + EuiTitle, + EuiToolTip, htmlIdGenerator, useIsWithinBreakpoints, - EuiButtonIcon, } from '@elastic/eui'; import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n-react'; @@ -138,15 +139,22 @@ export const GroupEditorFlyout = ({ {selectedAnnotation ? ( - setSelectedAnnotation(undefined)} - data-test-subj="backToGroupSettingsTop" - /> + disableScreenReaderOutput + > + setSelectedAnnotation(undefined)} + data-test-subj="backToGroupSettingsTop" + /> + {config.renderInputRow(item, index, onChangeValue)} - onDelete(item.id)} - /> + + onDelete(item.id)} + /> + diff --git a/src/platform/plugins/private/vis_default_editor/public/components/controls/components/number_list/__snapshots__/number_row.test.tsx.snap b/src/platform/plugins/private/vis_default_editor/public/components/controls/components/number_list/__snapshots__/number_row.test.tsx.snap index 6b2f160e417a0..80ff63bcf8ab8 100644 --- a/src/platform/plugins/private/vis_default_editor/public/components/controls/components/number_list/__snapshots__/number_row.test.tsx.snap +++ b/src/platform/plugins/private/vis_default_editor/public/components/controls/components/number_list/__snapshots__/number_row.test.tsx.snap @@ -24,14 +24,18 @@ exports[`NumberRow should be rendered with default set of props 1`] = ` - + + + `; diff --git a/src/platform/plugins/private/vis_default_editor/public/components/controls/components/number_list/number_row.tsx b/src/platform/plugins/private/vis_default_editor/public/components/controls/components/number_list/number_row.tsx index 8842cc2f64a90..15fb04bfaf9c6 100644 --- a/src/platform/plugins/private/vis_default_editor/public/components/controls/components/number_list/number_row.tsx +++ b/src/platform/plugins/private/vis_default_editor/public/components/controls/components/number_list/number_row.tsx @@ -9,7 +9,7 @@ import React, { useCallback } from 'react'; -import { EuiFieldNumber, EuiFlexGroup, EuiFlexItem, EuiButtonIcon } from '@elastic/eui'; +import { EuiButtonIcon, EuiFieldNumber, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import type { NumberListRange } from './range'; @@ -85,14 +85,15 @@ function NumberRow({ /> - + + + ); diff --git a/src/platform/plugins/private/vis_default_editor/public/components/controls/date_ranges.tsx b/src/platform/plugins/private/vis_default_editor/public/components/controls/date_ranges.tsx index d39706ee76c77..0009802d8d086 100644 --- a/src/platform/plugins/private/vis_default_editor/public/components/controls/date_ranges.tsx +++ b/src/platform/plugins/private/vis_default_editor/public/components/controls/date_ranges.tsx @@ -12,6 +12,7 @@ import { htmlIdGenerator, EuiButtonIcon, EuiButtonEmpty, + EuiToolTip, EuiFieldText, EuiFlexItem, EuiFlexGroup, @@ -181,14 +182,15 @@ function DateRangesParamEditor({ /> - onRemoveRange(id)} - /> + + onRemoveRange(id)} + /> + diff --git a/src/platform/plugins/private/vis_default_editor/public/components/controls/filter.tsx b/src/platform/plugins/private/vis_default_editor/public/components/controls/filter.tsx index 084a01df8c003..5a4b395024553 100644 --- a/src/platform/plugins/private/vis_default_editor/public/components/controls/filter.tsx +++ b/src/platform/plugins/private/vis_default_editor/public/components/controls/filter.tsx @@ -8,7 +8,14 @@ */ import React, { useState } from 'react'; -import { EuiForm, EuiButtonIcon, EuiFieldText, EuiFormRow, EuiSpacer } from '@elastic/eui'; +import { + EuiButtonIcon, + EuiFieldText, + EuiForm, + EuiFormRow, + EuiSpacer, + EuiToolTip, +} from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import type { Query } from '@kbn/es-query'; @@ -66,30 +73,44 @@ function FilterRow({ const FilterControl = (
- setShowCustomLabel(!showCustomLabel)} - /> - onRemoveFilter(id)} - /> + + setShowCustomLabel(!showCustomLabel)} + /> + + + onRemoveFilter(id)} + /> +
); diff --git a/src/platform/plugins/private/vis_default_editor/public/components/controls/ranges.tsx b/src/platform/plugins/private/vis_default_editor/public/components/controls/ranges.tsx index ee8cf024e4b23..3c56644cf2128 100644 --- a/src/platform/plugins/private/vis_default_editor/public/components/controls/ranges.tsx +++ b/src/platform/plugins/private/vis_default_editor/public/components/controls/ranges.tsx @@ -223,14 +223,15 @@ function RangesParamEditor({ /> - onRemoveRange(id)} - /> + + onRemoveRange(id)} + /> + diff --git a/src/platform/plugins/private/vis_default_editor/public/components/sidebar/sidebar.tsx b/src/platform/plugins/private/vis_default_editor/public/components/sidebar/sidebar.tsx index 187aa2d760a6e..2cf09544fc336 100644 --- a/src/platform/plugins/private/vis_default_editor/public/components/sidebar/sidebar.tsx +++ b/src/platform/plugins/private/vis_default_editor/public/components/sidebar/sidebar.tsx @@ -12,13 +12,14 @@ import React, { memo, useMemo, useState, useCallback, useEffect } from 'react'; import { isEqual } from 'lodash'; import { i18n } from '@kbn/i18n'; import { - keys, EuiButtonIcon, EuiFlexGroup, EuiFlexItem, - type UseEuiTheme, + EuiToolTip, euiBreakpoint, euiScrollBarStyles, + keys, + type UseEuiTheme, } from '@elastic/eui'; import type { EventEmitter } from 'events'; @@ -286,18 +287,25 @@ function DefaultEditorSideBarComponent({ - + disableScreenReaderOutput + > + + ); } diff --git a/src/platform/plugins/private/vis_types/vega/public/components/deprecated_interval_info.tsx b/src/platform/plugins/private/vis_types/vega/public/components/deprecated_interval_info.tsx index 97c0493e84d75..72b42fd451256 100644 --- a/src/platform/plugins/private/vis_types/vega/public/components/deprecated_interval_info.tsx +++ b/src/platform/plugins/private/vis_types/vega/public/components/deprecated_interval_info.tsx @@ -8,7 +8,7 @@ */ import React from 'react'; -import { EuiCallOut, EuiButtonIcon } from '@elastic/eui'; +import { EuiButtonIcon, EuiCallOut, EuiToolTip } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n-react'; import { BUCKET_TYPES } from '@kbn/data-plugin/public'; @@ -27,15 +27,23 @@ export const DeprecatedHistogramIntervalInfo = () => ( explicit fields: 'calendar_interval' and 'fixed_interval'. {dateHistogramDoc}" values={{ dateHistogramDoc: ( - + disableScreenReaderOutput + > + + ), }} /> diff --git a/src/platform/plugins/private/vis_types/vega/public/components/vega_actions_menu.tsx b/src/platform/plugins/private/vis_types/vega/public/components/vega_actions_menu.tsx index 5453990427bcc..7c56b11bab377 100644 --- a/src/platform/plugins/private/vis_types/vega/public/components/vega_actions_menu.tsx +++ b/src/platform/plugins/private/vis_types/vega/public/components/vega_actions_menu.tsx @@ -8,7 +8,13 @@ */ import React, { useState, useCallback } from 'react'; -import { EuiButtonIcon, EuiContextMenuPanel, EuiContextMenuItem, EuiPopover } from '@elastic/eui'; +import { + EuiButtonIcon, + EuiContextMenuItem, + EuiContextMenuPanel, + EuiPopover, + EuiToolTip, +} from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; import { i18n } from '@kbn/i18n'; @@ -34,13 +40,20 @@ function VegaActionsMenu({ formatHJson, formatJson }: VegaActionsMenuProps) { const closePopover = useCallback(() => setIsPopoverOpen(false), []); const button = ( - + disableScreenReaderOutput + > + + ); const items = [ diff --git a/src/platform/plugins/private/vis_types/vega/public/components/vega_help_menu.tsx b/src/platform/plugins/private/vis_types/vega/public/components/vega_help_menu.tsx index 55abed7a13fc5..752dc79d1731c 100644 --- a/src/platform/plugins/private/vis_types/vega/public/components/vega_help_menu.tsx +++ b/src/platform/plugins/private/vis_types/vega/public/components/vega_help_menu.tsx @@ -8,7 +8,13 @@ */ import React, { useCallback, useState } from 'react'; -import { EuiButtonIcon, EuiContextMenuPanel, EuiContextMenuItem, EuiPopover } from '@elastic/eui'; +import { + EuiButtonIcon, + EuiContextMenuItem, + EuiContextMenuPanel, + EuiPopover, + EuiToolTip, +} from '@elastic/eui'; import { FormattedMessage } from '@kbn/i18n-react'; import { i18n } from '@kbn/i18n'; @@ -21,13 +27,20 @@ function VegaHelpMenu() { const closePopover = useCallback(() => setIsPopoverOpen(false), []); const button = ( - + disableScreenReaderOutput + > + + ); const items = [ diff --git a/src/platform/plugins/shared/charts/public/static/components/legend_toggle.tsx b/src/platform/plugins/shared/charts/public/static/components/legend_toggle.tsx index 8ab18aa196d44..404049af5033d 100644 --- a/src/platform/plugins/shared/charts/public/static/components/legend_toggle.tsx +++ b/src/platform/plugins/shared/charts/public/static/components/legend_toggle.tsx @@ -51,6 +51,7 @@ const LegendToggleComponent = ({ onClick, showLegend, legendPosition }: LegendTo ); return ( + // eslint-disable-next-line @elastic/eui/tooltip-button-icon-wrap -- absolute-positioned chart overlay; EuiToolTip wrapper alters snapshot rendering + disableScreenReaderOutput + > + + } isOpen={isPopoverOpen} closePopover={closePopover} diff --git a/src/platform/plugins/shared/vis_types/timeseries/public/application/components/lib/index_pattern_select/field_text_select.tsx b/src/platform/plugins/shared/vis_types/timeseries/public/application/components/lib/index_pattern_select/field_text_select.tsx index 252936bcbd1c1..f1ced1a0bf3c5 100644 --- a/src/platform/plugins/shared/vis_types/timeseries/public/application/components/lib/index_pattern_select/field_text_select.tsx +++ b/src/platform/plugins/shared/vis_types/timeseries/public/application/components/lib/index_pattern_select/field_text_select.tsx @@ -11,7 +11,7 @@ import React, { useCallback, useState, useEffect } from 'react'; import { i18n } from '@kbn/i18n'; import type { EuiFieldTextProps } from '@elastic/eui'; -import { EuiFieldText, EuiButtonIcon } from '@elastic/eui'; +import { EuiButtonIcon, EuiFieldText, EuiToolTip } from '@elastic/eui'; import { SwitchModePopover } from './switch_mode_popover'; import type { SelectIndexComponentProps } from './types'; @@ -48,12 +48,14 @@ export const FieldTextSelect = ({ }, [onIndexChange, inputValue, indexPatternString]); const appends = [ - , + + + , ]; if (allowSwitchMode) { diff --git a/src/platform/plugins/shared/vis_types/timeseries/public/application/components/lib/index_pattern_select/switch_mode_popover.tsx b/src/platform/plugins/shared/vis_types/timeseries/public/application/components/lib/index_pattern_select/switch_mode_popover.tsx index e566a9d84f83d..df59cb401b2fe 100644 --- a/src/platform/plugins/shared/vis_types/timeseries/public/application/components/lib/index_pattern_select/switch_mode_popover.tsx +++ b/src/platform/plugins/shared/vis_types/timeseries/public/application/components/lib/index_pattern_select/switch_mode_popover.tsx @@ -13,12 +13,13 @@ import { FormattedMessage } from '@kbn/i18n-react'; import { EuiButtonIcon, + EuiLink, EuiPopover, EuiPopoverTitle, EuiSpacer, EuiSwitch, EuiText, - EuiLink, + EuiToolTip, useGeneratedHtmlId, } from '@elastic/eui'; @@ -78,17 +79,27 @@ export const SwitchModePopover = ({ onModeChange, useKibanaIndices }: PopoverPro + disableScreenReaderOutput + > + + } isOpen={isPopoverOpen} closePopover={closePopover} diff --git a/x-pack/platform/plugins/shared/lens/public/app_plugin/shared/edit_on_the_fly/convert_to_esql_modal.tsx b/x-pack/platform/plugins/shared/lens/public/app_plugin/shared/edit_on_the_fly/convert_to_esql_modal.tsx index 558ac0c9448da..001511f2ce496 100644 --- a/x-pack/platform/plugins/shared/lens/public/app_plugin/shared/edit_on_the_fly/convert_to_esql_modal.tsx +++ b/x-pack/platform/plugins/shared/lens/public/app_plugin/shared/edit_on_the_fly/convert_to_esql_modal.tsx @@ -25,6 +25,7 @@ import { EuiScreenReaderOnly, EuiSpacer, EuiText, + EuiToolTip, useEuiTheme, } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -128,9 +129,8 @@ export const ConvertToEsqlModal: React.FunctionComponent<{ const isExpanded = Boolean(itemIdToExpandedRowMap[layer.id]); return ( - toggleDetails(layer)} - aria-label={ + + disableScreenReaderOutput + > + toggleDetails(layer)} + aria-label={ + isExpanded + ? i18n.translate('xpack.lens.config.collapseAriaLabel', { + defaultMessage: 'Collapse', + }) + : i18n.translate('xpack.lens.config.expandAriaLabel', { + defaultMessage: 'Expand', + }) + } + iconType={isExpanded ? 'chevronSingleDown' : 'chevronSingleRight'} + disabled={!layer.isConvertibleToEsql} + /> + ); }, }, diff --git a/x-pack/platform/plugins/shared/lens/public/app_plugin/shared/edit_on_the_fly/layer_tabs.test.tsx b/x-pack/platform/plugins/shared/lens/public/app_plugin/shared/edit_on_the_fly/layer_tabs.test.tsx index b68a4e188de87..e02430689d29e 100644 --- a/x-pack/platform/plugins/shared/lens/public/app_plugin/shared/edit_on_the_fly/layer_tabs.test.tsx +++ b/x-pack/platform/plugins/shared/lens/public/app_plugin/shared/edit_on_the_fly/layer_tabs.test.tsx @@ -462,7 +462,7 @@ describe('LayerTabs', () => { expect(instance.find('[data-test-subj="lnsLayerActionsMenu"]').exists()).toBe(true); // The delete action should exist - expect(instance.find('button[title="Delete layer"]').exists()).toBe(true); + expect(instance.find('button[aria-label="Delete layer"]').exists()).toBe(true); }); it('should call the remove callback when deleting layer', async () => { @@ -506,7 +506,7 @@ describe('LayerTabs', () => { // Click the delete layer button act(() => { - instance.find('button[title="Delete layer"]').first().simulate('click'); + instance.find('button[aria-label="Delete layer"]').first().simulate('click'); }); instance.update(); diff --git a/x-pack/platform/plugins/shared/lens/public/editor_frame_service/editor_frame/config_panel/layer_actions/layer_actions.tsx b/x-pack/platform/plugins/shared/lens/public/editor_frame_service/editor_frame/config_panel/layer_actions/layer_actions.tsx index 9c121a9084bab..f5795fb757018 100644 --- a/x-pack/platform/plugins/shared/lens/public/editor_frame_service/editor_frame/config_panel/layer_actions/layer_actions.tsx +++ b/x-pack/platform/plugins/shared/lens/public/editor_frame_service/editor_frame/config_panel/layer_actions/layer_actions.tsx @@ -110,17 +110,24 @@ const InContextMenuActions = (props: LayerActionsProps) => { })} id={splitButtonPopoverId} button={ - + disableScreenReaderOutput + > + + } ownFocus={true} isOpen={isPopoverOpen} @@ -203,7 +210,6 @@ export const LayerActions = (props: LayerActionsProps) => { color={outsideListAction.color ?? 'text'} data-test-subj={outsideListAction['data-test-subj']} aria-label={outsideListAction.displayName} - title={outsideListAction.displayName} disabled={outsideListAction.disabled} onClick={() => outsideListAction.execute?.(props.mountingPoint)} /> diff --git a/x-pack/platform/plugins/shared/lens/public/shared_components/flyout_container.tsx b/x-pack/platform/plugins/shared/lens/public/shared_components/flyout_container.tsx index 0d6788299910c..a75e79ec43826 100644 --- a/x-pack/platform/plugins/shared/lens/public/shared_components/flyout_container.tsx +++ b/x-pack/platform/plugins/shared/lens/public/shared_components/flyout_container.tsx @@ -9,16 +9,17 @@ import React, { useState, useEffect, useCallback } from 'react'; import type { Interpolation, Theme } from '@emotion/react'; import { css } from '@emotion/react'; import { - EuiFlyoutHeader, - EuiFlyoutFooter, - EuiTitle, - EuiButtonIcon, EuiButtonEmpty, + EuiButtonIcon, EuiFlexGroup, EuiFlexItem, + EuiFlyoutFooter, + EuiFlyoutHeader, EuiFocusTrap, - type UseEuiTheme, + EuiTitle, + EuiToolTip, euiBreakpoint, + type UseEuiTheme, useEuiTheme, } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -130,16 +131,26 @@ export function FlyoutContainer({ {isInlineEditing && ( - + disableScreenReaderOutput + > + + )} @@ -150,16 +161,26 @@ export function FlyoutContainer({ {!isInlineEditing && ( - + disableScreenReaderOutput + > + + )} diff --git a/x-pack/platform/plugins/shared/lens/public/shared_components/setting_with_sibling_flyout.tsx b/x-pack/platform/plugins/shared/lens/public/shared_components/setting_with_sibling_flyout.tsx index acf64b9cda9f1..d56277ca9f999 100644 --- a/x-pack/platform/plugins/shared/lens/public/shared_components/setting_with_sibling_flyout.tsx +++ b/x-pack/platform/plugins/shared/lens/public/shared_components/setting_with_sibling_flyout.tsx @@ -9,16 +9,17 @@ import { i18n } from '@kbn/i18n'; import type { MutableRefObject } from 'react'; import React, { useState, useEffect } from 'react'; import { - EuiFlyoutHeader, - EuiFlyoutFooter, - EuiTitle, - EuiButtonIcon, EuiButtonEmpty, + EuiButtonIcon, EuiFlexGroup, EuiFlexItem, + EuiFlyoutFooter, + EuiFlyoutHeader, EuiFocusTrap, EuiOutsideClickDetector, EuiPortal, + EuiTitle, + EuiToolTip, type UseEuiTheme, useEuiTheme, } from '@elastic/eui'; @@ -89,16 +90,23 @@ export function SettingWithSiblingFlyout({ > - + disableScreenReaderOutput + > + + diff --git a/x-pack/platform/plugins/shared/lens/public/visualizations/datatable/components/table_basic.tsx b/x-pack/platform/plugins/shared/lens/public/visualizations/datatable/components/table_basic.tsx index f775d8639fad3..0bb62f9b5498b 100644 --- a/x-pack/platform/plugins/shared/lens/public/visualizations/datatable/components/table_basic.tsx +++ b/x-pack/platform/plugins/shared/lens/public/visualizations/datatable/components/table_basic.tsx @@ -25,7 +25,7 @@ import type { EuiDataGridSorting, EuiDataGridStyle, } from '@elastic/eui'; -import { EuiButtonIcon, EuiDataGrid, useEuiTheme, EuiToolTip } from '@elastic/eui'; +import { EuiButtonIcon, EuiDataGrid, EuiToolTip, useEuiTheme } from '@elastic/eui'; import type { CustomPaletteState } from '@kbn/charts-plugin/public'; import { EmptyPlaceholder } from '@kbn/charts-plugin/public'; import type { ClickTriggerEvent } from '@kbn/charts-plugin/public';