diff --git a/src/core_plugins/kibana/public/dashboard/panel/__snapshots__/dashboard_panel.test.js.snap b/src/core_plugins/kibana/public/dashboard/panel/__snapshots__/dashboard_panel.test.js.snap
index 9f60aa5bc8f1c..b9c1b35b21cc5 100644
--- a/src/core_plugins/kibana/public/dashboard/panel/__snapshots__/dashboard_panel.test.js.snap
+++ b/src/core_plugins/kibana/public/dashboard/panel/__snapshots__/dashboard_panel.test.js.snap
@@ -24,15 +24,36 @@ exports[`DashboardPanel matches snapshot 1`] = `
class="kuiMicroButtonGroup"
>
-
+ type="button"
+ >
+
+
diff --git a/src/core_plugins/kibana/public/dashboard/panel/panel_header/panel_options_menu.js b/src/core_plugins/kibana/public/dashboard/panel/panel_header/panel_options_menu.js
index 6500f3cf97ff1..7eb67551a06ee 100644
--- a/src/core_plugins/kibana/public/dashboard/panel/panel_header/panel_options_menu.js
+++ b/src/core_plugins/kibana/public/dashboard/panel/panel_header/panel_options_menu.js
@@ -1,13 +1,15 @@
import React from 'react';
import PropTypes from 'prop-types';
-import {
- KuiPopover,
- KuiContextMenu,
- KuiKeyboardAccessible,
-} from '@kbn/ui-framework/components';
import { PanelOptionsMenuForm } from './panel_options_menu_form';
+import {
+ EuiContextMenu,
+ EuiPopover,
+ EuiIcon,
+ EuiButtonIcon,
+} from '@elastic/eui';
+
export class PanelOptionsMenu extends React.Component {
state = {
isPopoverOpen: false
@@ -39,9 +41,8 @@ export class PanelOptionsMenu extends React.Component {
{
name: 'Edit visualization',
'data-test-subj': 'dashboardPanelEditLink',
- icon: ,
onClick: this.onEditPanel,
disabled: !this.props.editUrl,
@@ -49,18 +50,16 @@ export class PanelOptionsMenu extends React.Component {
{
name: 'Customize panel',
'data-test-subj': 'dashboardPanelOptionsSubMenuLink',
- icon: ,
panel: 'panelSubOptionsMenu',
},
{
name: isExpanded ? 'Minimize' : 'Full screen',
'data-test-subj': 'dashboardPanelExpandIcon',
- icon: ,
onClick: this.onToggleExpandPanel,
}
@@ -69,9 +68,8 @@ export class PanelOptionsMenu extends React.Component {
mainPanelMenuItems.push({
name: 'Delete from dashboard',
'data-test-subj': 'dashboardPanelRemoveIcon',
- icon: ,
onClick: this.onDeletePanel,
});
@@ -106,31 +104,30 @@ export class PanelOptionsMenu extends React.Component {
render() {
const button = (
-
-
-
+
);
return (
-
+
);
}
}
diff --git a/src/core_plugins/kibana/public/dashboard/styles/index.less b/src/core_plugins/kibana/public/dashboard/styles/index.less
index 6a5f7d5fd2706..34697ed6e998e 100644
--- a/src/core_plugins/kibana/public/dashboard/styles/index.less
+++ b/src/core_plugins/kibana/public/dashboard/styles/index.less
@@ -23,6 +23,10 @@
}
}
+.euiContextMenuItem {
+ display: block;
+}
+
.layout-view {
/**
* 1. Due to https://github.com/STRML/react-grid-layout/issues/240 we have to manually hide the resizable