From e4260b4cd20876fbc5253bd928e8a8eb1c7b6632 Mon Sep 17 00:00:00 2001
From: sergeyteleshev <iamsergeyteleshev@gmail.com>
Date: Thu, 21 May 2026 19:47:45 +0200
Subject: [PATCH] [CB] API token generation dropdown doesn't fit to the island
 (#4351)

Co-authored-by: Daria Marutkina <125263541+dariamarutkina@users.noreply.github.com>
---
 .../@dbeaver/ui-kit/src/Select/SelectField.tsx             | 7 +++++--
 webapp/packages/core-blocks/src/FormControls/Select.tsx    | 5 ++++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/webapp/common-react/@dbeaver/ui-kit/src/Select/SelectField.tsx b/webapp/common-react/@dbeaver/ui-kit/src/Select/SelectField.tsx
index 18be853e34..206cd2c919 100644
--- a/webapp/common-react/@dbeaver/ui-kit/src/Select/SelectField.tsx
+++ b/webapp/common-react/@dbeaver/ui-kit/src/Select/SelectField.tsx
@@ -1,6 +1,6 @@
 /*
  * CloudBeaver - Cloud Database Manager
- * Copyright (C) 2020-2025 DBeaver Corp and others
+ * Copyright (C) 2020-2026 DBeaver Corp and others
  *
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
@@ -78,6 +78,8 @@ export interface SelectFieldProps<T, ItemType = SelectItem<T>> {
 
   store?: SelectProviderProps['store'];
 
+  portal?: boolean;
+
   autoFocusItemsOnShow?: boolean;
 
   'aria-labelledby'?: string;
@@ -106,6 +108,7 @@ export function SelectField<T, ItemType extends {} = SelectItem<T>>({
   disabled,
   required,
   className,
+  portal = false,
   selectedRender,
   arrowIcon,
   store,
@@ -167,7 +170,7 @@ export function SelectField<T, ItemType extends {} = SelectItem<T>>({
         </Select>
         {description && <span className="dbv-kit-select__description">{description}</span>}
 
-        <SelectPopover autoFocusOnShow={autoFocusItemsOnShow} gutter={4} unmountOnHide>
+        <SelectPopover autoFocusOnShow={autoFocusItemsOnShow} portal={portal} gutter={4} unmountOnHide>
           {items.length === 0 ? (
             <div className="dbv-kit-select__empty">{noItemsPlaceholder}</div>
           ) : (
diff --git a/webapp/packages/core-blocks/src/FormControls/Select.tsx b/webapp/packages/core-blocks/src/FormControls/Select.tsx
index 5481044f08..867b3dcfd0 100644
--- a/webapp/packages/core-blocks/src/FormControls/Select.tsx
+++ b/webapp/packages/core-blocks/src/FormControls/Select.tsx
@@ -1,6 +1,6 @@
 /*
  * CloudBeaver - Cloud Database Manager
- * Copyright (C) 2020-2025 DBeaver Corp and others
+ * Copyright (C) 2020-2026 DBeaver Corp and others
  *
  * Licensed under the Apache License, Version 2.0.
  * you may not use this file except in compliance with the License.
@@ -39,6 +39,7 @@ export type SelectBaseProps<TKey, TValue> = Omit<
     onSwitch?: (state: boolean) => void;
     inline?: boolean;
     children?: string;
+    portal?: boolean;
   };
 
 type ControlledProps<TKey, TValue> = SelectBaseProps<TKey, TValue> & {
@@ -66,6 +67,7 @@ export const Select: SelectType = observer(function Select({
   name,
   state,
   items,
+  portal = false,
   loading,
   children,
   title,
@@ -180,6 +182,7 @@ export const Select: SelectType = observer(function Select({
       )}
       <SelectField
         {...rest}
+        portal={portal}
         items={items}
         value={value}
         id={inputId}