[Lens] Use EuiContextMenuItem instead of custom ChartOptionWrapper with manually-copied CSS (elastic#270138)

## Summary

Closes elastic#268723

In elastic#260949, they introduced
changes to EUI selection list components that updated their visual
styles:

<img width="396" height="386" alt="Screenshot 2026-05-20 at 13 01 09"
src="https://github.com/user-attachments/assets/20953dfa-04e3-4b3e-82e9-5d2aca9f8984"
/>

However, in
`x-pack/platform/plugins/shared/lens/public/visualizations/xy/add_layer.tsx`,
we created a custom component called`ChartOptionWrapper` that was coping
the previous styles so it looked like the before:

<img width="417" height="261" alt="Screenshot 2026-05-20 at 13 03 26"
src="https://github.com/user-attachments/assets/615748c5-8b79-448c-99ef-8a29d479bc0d"
/>

This PR uses the `EuiContextMenuItem` component as suggested in
elastic#260949 (comment) so
there's no need to copy the styles as we use the expected styles
out-of-the-box.

<img width="353" height="215" alt="Screenshot 2026-05-20 at 13 05 47"
src="https://github.com/user-attachments/assets/7ffd10e8-73b1-4d8a-9efa-6718f111b98c"
/>

This menu is found in: Visualize library > Create visualization > Lens >
Add layer > Visualization

## Checklist

- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [ ] [Flaky Test
Runner](https://ci-stats.kibana.dev/trigger_flaky_test_runner/1) was
used on any tests changed
- [x] The PR description includes the appropriate Release Notes section,
and the correct `release_note:*` label is applied per the
[guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)
- [x] Review the [backport
guidelines](https://docs.google.com/document/d/1VyN5k91e5OVumlc0Gb9RPa3h1ewuPE705nRtioPiTvY/edit?usp=sharing)
and apply applicable `backport:*` labels.

Author: mariairiartef

x-pack/platform/plugins/shared/lens/public/visualizations/xy/add_layer.tsx

@@ -6,17 +6,16 @@
  */
 
 import React, { useState } from 'react';
-import type { IconType } from '@elastic/eui';
 import {
   EuiButtonIcon,
   EuiPopover,
   EuiIcon,
   EuiContextMenu,
+  EuiContextMenuItem,
+  EuiText,
   EuiFlexItem,
   EuiFlexGroup,
   EuiToolTip,
-  type UseEuiTheme,
-  useEuiTheme,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { LayerTypes } from '@kbn/expression-xy-plugin/public';
@@ -30,7 +29,6 @@ import { visualizationTypes } from './types';
 import { isHorizontalChart, isHorizontalSeries, isPercentageSeries } from './state_helpers';
 import { getDataLayers } from './visualization_helpers';
 import { ExperimentalBadge } from '../../shared_components';
-import { ChartOption } from '../../editor_frame_service/editor_frame/config_panel/chart_switch/chart_option';
 
 export interface AddLayerButtonProps {
   state: XYVisualizationState;
@@ -226,27 +224,30 @@ export function AddLayerButton({
                   t.subtypes?.includes(firstLayerSubtype) && !isPercentageSeries(firstLayerSubtype);
 
                 return {
-                  renderItem: () => {
-                    return (
-                      <ChartOptionWrapper
-                        type={t.id}
-                        label={t.label}
-                        description={t.description}
-                        icon={t.icon}
-                        onClick={() => {
-                          addLayer(
-                            LayerTypes.DATA,
-                            undefined,
-                            undefined,
-                            canInitializeWithSubtype
-                              ? firstLayerSubtype
-                              : (t.subtypes?.[0] as SeriesType)
-                          );
-                          toggleLayersChoice(false);
-                        }}
-                      />
-                    );
-                  },
+                  renderItem: () => (
+                    <EuiContextMenuItem
+                      icon={<EuiIcon type={t.icon} aria-hidden={true} />}
+                      data-test-subj={`lnsXY_seriesType-${t.id}`}
+                      onClick={() => {
+                        addLayer(
+                          LayerTypes.DATA,
+                          undefined,
+                          undefined,
+                          canInitializeWithSubtype
+                            ? firstLayerSubtype
+                            : (t.subtypes?.[0] as SeriesType)
+                        );
+                        toggleLayersChoice(false);
+                      }}
+                    >
+                      <EuiText size="s" data-test-subj="lnsChartSwitch-option-label">
+                        {t.label}
+                      </EuiText>
+                      <EuiText size="xs" color="subdued">
+                        {t.description}
+                      </EuiText>
+                    </EuiContextMenuItem>
+                  ),
                 };
               }),
             },
@@ -267,46 +268,3 @@ export function AddLayerButton({
     </div>
   );
 }
-
-const ChartOptionWrapper = ({
-  label,
-  description,
-  icon,
-  onClick,
-  type,
-}: {
-  label: string;
-  description: string;
-  icon: IconType;
-  onClick: () => void;
-  type: string;
-}) => {
-  const euiThemeContext = useEuiTheme();
-  return (
-    <button
-      data-test-subj={`lnsXY_seriesType-${type}`}
-      onClick={onClick}
-      className="euiContextMenuItem"
-      css={chartOptionWrapperStyles(euiThemeContext)}
-    >
-      <ChartOption option={{ icon, label, description }} />
-    </button>
-  );
-};
-
-const chartOptionWrapperStyles = ({ euiTheme }: UseEuiTheme) => css`
-  padding: ${euiTheme.size.s};
-  border-bottom: ${euiTheme.border.thin};
-  border-bottom-color: ${euiTheme.colors.backgroundBaseSubdued};
-  width: 100%;
-  &:hover,
-  &:focus {
-    color: ${euiTheme.colors.primary};
-    background-color: ${euiTheme.colors.backgroundBasePrimary};
-    span,
-    .euiText {
-      text-decoration: underline;
-      color: ${euiTheme.colors.primary};
-    }
-  }
-`;