From 5a13fccd62798712e65ce5d5c78fd9c6decbac07 Mon Sep 17 00:00:00 2001
From: kay delaney <45561153+kaydelaney@users.noreply.github.com>
Date: Mon, 9 Jun 2025 11:11:42 +0100
Subject: [PATCH] UI/Combobox: Remove unnecessary div wrapper (#106323)

---
 .../grafana-ui/src/components/Combobox/Combobox.tsx | 13 ++++++++++---
 .../src/components/Combobox/getComboboxStyles.ts    |  4 ++--
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/packages/grafana-ui/src/components/Combobox/Combobox.tsx b/packages/grafana-ui/src/components/Combobox/Combobox.tsx
index 6f9fd93db93..4871f1437b2 100644
--- a/packages/grafana-ui/src/components/Combobox/Combobox.tsx
+++ b/packages/grafana-ui/src/components/Combobox/Combobox.tsx
@@ -1,7 +1,7 @@
 import { cx } from '@emotion/css';
 import { useVirtualizer, type Range } from '@tanstack/react-virtual';
 import { useCombobox } from 'downshift';
-import { useCallback, useId, useMemo } from 'react';
+import React, { useCallback, useId, useMemo } from 'react';
 
 import { useStyles2 } from '../../themes';
 import { t } from '../../utils/i18n';
@@ -356,8 +356,15 @@ export const Combobox = <T extends string | number>(props: ComboboxProps<T>) =>
     </>
   );
 
+  const { Wrapper, wrapperProps } = isAutoSize
+    ? {
+        Wrapper: 'div',
+        wrapperProps: { className: styles.adaptToParent },
+      }
+    : { Wrapper: React.Fragment };
+
   return (
-    <div className={isAutoSize ? styles.addaptToParent : undefined}>
+    <Wrapper {...wrapperProps}>
       <InputComponent
         width={isAutoSize ? undefined : width}
         {...(isAutoSize ? { minWidth, maxWidth } : {})}
@@ -396,6 +403,6 @@ export const Combobox = <T extends string | number>(props: ComboboxProps<T>) =>
           )}
         </div>
       </Portal>
-    </div>
+    </Wrapper>
   );
 };
diff --git a/packages/grafana-ui/src/components/Combobox/getComboboxStyles.ts b/packages/grafana-ui/src/components/Combobox/getComboboxStyles.ts
index 382f53336fc..14c87b124ec 100644
--- a/packages/grafana-ui/src/components/Combobox/getComboboxStyles.ts
+++ b/packages/grafana-ui/src/components/Combobox/getComboboxStyles.ts
@@ -161,8 +161,8 @@ export const getComboboxStyles = (theme: GrafanaTheme2) => {
         cursor: 'text',
       },
     }),
-    addaptToParent: css({
-      label: 'combobox-addapt-to-parent',
+    adaptToParent: css({
+      label: 'combobox-adapt-to-parent',
       maxWidth: '100%',
       '[class*="input-wrapper-combobox-input"]': {
         maxWidth: '100%',