diff --git a/apps/client/src/widgets/launch_bar/launch_bar_widgets.tsx b/apps/client/src/widgets/launch_bar/launch_bar_widgets.tsx index e627a1d57..68c68868f 100644 --- a/apps/client/src/widgets/launch_bar/launch_bar_widgets.tsx +++ b/apps/client/src/widgets/launch_bar/launch_bar_widgets.tsx @@ -36,6 +36,7 @@ export function LaunchBarDropdownButton({ children, icon, ...props }: Pick} titlePosition={isHorizontalLayout ? "bottom" : "right"} + titleOptions={{ animation: false }} {...props} >{children} ) diff --git a/apps/client/src/widgets/react/ActionButton.tsx b/apps/client/src/widgets/react/ActionButton.tsx index a37f34514..ba5430f38 100644 --- a/apps/client/src/widgets/react/ActionButton.tsx +++ b/apps/client/src/widgets/react/ActionButton.tsx @@ -23,7 +23,8 @@ export default function ActionButton({ text, icon, className, triggerCommand, ti useStaticTooltip(buttonRef, { title: keyboardShortcut?.length ? `${text} (${keyboardShortcut?.join(",")})` : text, placement: titlePosition ?? "bottom", - fallbackPlacements: [ titlePosition ?? "bottom" ] + fallbackPlacements: [ titlePosition ?? "bottom" ], + animation: false }); useEffect(() => { diff --git a/apps/client/src/widgets/react/Dropdown.tsx b/apps/client/src/widgets/react/Dropdown.tsx index bbf757a21..288885681 100644 --- a/apps/client/src/widgets/react/Dropdown.tsx +++ b/apps/client/src/widgets/react/Dropdown.tsx @@ -1,4 +1,4 @@ -import { Dropdown as BootstrapDropdown } from "bootstrap"; +import { Dropdown as BootstrapDropdown, Tooltip } from "bootstrap"; import { ComponentChildren, HTMLAttributes } from "preact"; import { CSSProperties, HTMLProps } from "preact/compat"; import { MutableRef, useCallback, useEffect, useRef, useState } from "preact/hooks"; @@ -29,14 +29,16 @@ export interface DropdownProps extends Pick, "id" | "c dropdownOptions?: Partial; dropdownRef?: MutableRef; titlePosition?: "top" | "right" | "bottom" | "left"; + titleOptions?: Partial; } -export default function Dropdown({ id, className, buttonClassName, isStatic, children, title, text, dropdownContainerStyle, dropdownContainerClassName, hideToggleArrow, iconAction, disabled, noSelectButtonStyle, noDropdownListStyle, forceShown, onShown: externalOnShown, onHidden: externalOnHidden, dropdownOptions, buttonProps, dropdownRef, titlePosition }: DropdownProps) { +export default function Dropdown({ id, className, buttonClassName, isStatic, children, title, text, dropdownContainerStyle, dropdownContainerClassName, hideToggleArrow, iconAction, disabled, noSelectButtonStyle, noDropdownListStyle, forceShown, onShown: externalOnShown, onHidden: externalOnHidden, dropdownOptions, buttonProps, dropdownRef, titlePosition, titleOptions }: DropdownProps) { const containerRef = useRef(null); const triggerRef = useRef(null); useStaticTooltip(triggerRef, { + ...titleOptions, placement: titlePosition ?? "bottom", - fallbackPlacements: [ titlePosition ?? "bottom" ] + fallbackPlacements: [ titlePosition ?? "bottom" ], }); const [ shown, setShown ] = useState(false);