From c11a37eabb09dbf09d6080029f99fafda7403077 Mon Sep 17 00:00:00 2001
From: Collin Fingar <collin.fingar@grafana.com>
Date: Fri, 21 Mar 2025 08:26:32 -0400
Subject: [PATCH] Combobox: Fix option truncation w/ autoPlacement (#102568)

* Combobox: Fix option truncation w/ autoPlacement

* Add back in boundary property
---
 .../src/components/Combobox/useComboboxFloat.ts          | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/packages/grafana-ui/src/components/Combobox/useComboboxFloat.ts b/packages/grafana-ui/src/components/Combobox/useComboboxFloat.ts
index f5803afdf2e..f2d5ca7de20 100644
--- a/packages/grafana-ui/src/components/Combobox/useComboboxFloat.ts
+++ b/packages/grafana-ui/src/components/Combobox/useComboboxFloat.ts
@@ -1,4 +1,4 @@
-import { autoUpdate, flip, size, useFloating } from '@floating-ui/react';
+import { autoUpdate, autoPlacement, size, useFloating } from '@floating-ui/react';
 import { useMemo, useRef, useState } from 'react';
 
 import { measureText } from '../../utils';
@@ -31,10 +31,11 @@ export const useComboboxFloat = (items: Array<ComboboxOption<string | number>>,
 
   // the order of middleware is important!
   const middleware = [
-    flip({
-      // see https://floating-ui.com/docs/flip#combining-with-shift
-      crossAxis: true,
+    autoPlacement({
+      // see https://floating-ui.com/docs/autoplacement
+      allowedPlacements: ['bottom-start', 'bottom-end', 'top-start', 'top-end'],
       boundary: document.body,
+      crossAxis: true,
     }),
     size({
       apply({ availableWidth, availableHeight }) {