fix(global_menu): zoom controls tooltip overlapping

This commit is contained in:
Elian Doran 2025-09-22 20:03:06 +03:00
parent ed8df51216
commit 311f4aded8
No known key found for this signature in database
2 changed files with 7 additions and 3 deletions

View File

@ -157,7 +157,10 @@ function ZoomControls({ parentComponent }: { parentComponent?: Component | null
function ZoomControlButton({ command, title, icon, children }: { command: KeyboardActionNames, title: string, icon?: string, children?: ComponentChildren }) { function ZoomControlButton({ command, title, icon, children }: { command: KeyboardActionNames, title: string, icon?: string, children?: ComponentChildren }) {
const linkRef = useRef<HTMLAnchorElement>(null); const linkRef = useRef<HTMLAnchorElement>(null);
useStaticTooltipWithKeyboardShortcut(linkRef, title, command); useStaticTooltipWithKeyboardShortcut(linkRef, title, command, {
placement: "bottom",
fallbackPlacements: [ "bottom" ]
});
return ( return (
<a <a
ref={linkRef} ref={linkRef}

View File

@ -545,10 +545,11 @@ export function useStaticTooltip(elRef: RefObject<Element>, config?: Partial<Too
}, [ elRef, config ]); }, [ elRef, config ]);
} }
export function useStaticTooltipWithKeyboardShortcut(elRef: RefObject<Element>, title: string, actionName: KeyboardActionNames | undefined) { export function useStaticTooltipWithKeyboardShortcut(elRef: RefObject<Element>, title: string, actionName: KeyboardActionNames | undefined, opts?: Omit<Partial<Tooltip.Options>, "title">) {
const [ keyboardShortcut, setKeyboardShortcut ] = useState<string[]>(); const [ keyboardShortcut, setKeyboardShortcut ] = useState<string[]>();
useStaticTooltip(elRef, { useStaticTooltip(elRef, {
title: keyboardShortcut?.length ? `${title} (${keyboardShortcut?.join(",")})` : title title: keyboardShortcut?.length ? `${title} (${keyboardShortcut?.join(",")})` : title,
...opts
}); });
useEffect(() => { useEffect(() => {