IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

ToolbarButtonRow: prevent closure of overflow menu when interacting with portal elements (#68319)

Browse Source 
* don't close the overflow menu when interacting with something in a portal

* keep overflow ref logic
This commit is contained in:
Ashley Harrison 2023-05-15 13:48:19 +01:00 committed by GitHub
parent 7e3c68d3c1
commit 5d91ace745
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 5 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/grafana-ui/src/components/ToolbarButton/ToolbarButtonRow.tsx
View File

@ -7,6 +7,7 @@ import React, { forwardRef, HTMLAttributes, useState, useRef, useLayoutEffect, c
import { GrafanaTheme2 } from '@grafana/data'; import { GrafanaTheme2 } from '@grafana/data';
import { useTheme2 } from '../../themes'; import { useTheme2 } from '../../themes';
import { getPortalContainer } from '../Portal/Portal';
import { ToolbarButton } from './ToolbarButton'; import { ToolbarButton } from './ToolbarButton';
export interface Props extends HTMLAttributes<HTMLDivElement> { export interface Props extends HTMLAttributes<HTMLDivElement> {
@ -29,7 +30,10 @@ export const ToolbarButtonRow = forwardRef<HTMLDivElement, Props>(
onClose: () => setShowOverflowItems(false), onClose: () => setShowOverflowItems(false),
isDismissable: true, isDismissable: true,
isOpen: showOverflowItems, isOpen: showOverflowItems,
shouldCloseOnInteractOutside: (element: Element) => !overflowRef.current?.contains(element), shouldCloseOnInteractOutside: (element: Element) => {
const portalContainer = getPortalContainer();
return !overflowRef.current?.contains(element) && !portalContainer.contains(element);
},
}, },
overflowItemsRef overflowItemsRef
); );