Tweak dropdown alignment.

This commit is contained in:
barnabasmolnar 2023-07-25 13:52:32 +02:00
parent d967123383
commit 8ff1ac8097
3 changed files with 7 additions and 3 deletions

View File

@ -363,6 +363,7 @@ export const ShapesSwitcher = ({
onClickOutside={() => setIsExtraToolsMenuOpen(false)} onClickOutside={() => setIsExtraToolsMenuOpen(false)}
onSelect={() => setIsExtraToolsMenuOpen(false)} onSelect={() => setIsExtraToolsMenuOpen(false)}
className="App-toolbar__extra-tools-dropdown" className="App-toolbar__extra-tools-dropdown"
align="end"
> >
<DropdownMenu.Item <DropdownMenu.Item
onSelect={() => { onSelect={() => {

View File

@ -199,6 +199,7 @@ export const LibraryDropdownMenuButton: React.FC<{
onClickOutside={() => setIsLibraryMenuOpen(false)} onClickOutside={() => setIsLibraryMenuOpen(false)}
onSelect={() => setIsLibraryMenuOpen(false)} onSelect={() => setIsLibraryMenuOpen(false)}
className="library-menu" className="library-menu"
align="end"
> >
{!itemsSelected && ( {!itemsSelected && (
<DropdownMenu.Item <DropdownMenu.Item

View File

@ -14,7 +14,8 @@ const MenuContent = ({
className = "", className = "",
onSelect, onSelect,
style, style,
sideOffset, sideOffset = 4,
align = "start",
}: { }: {
children?: React.ReactNode; children?: React.ReactNode;
onClickOutside?: () => void; onClickOutside?: () => void;
@ -25,6 +26,7 @@ const MenuContent = ({
onSelect?: (event: Event) => void; onSelect?: (event: Event) => void;
style?: React.CSSProperties; style?: React.CSSProperties;
sideOffset?: number; sideOffset?: number;
align?: "start" | "center" | "end";
}) => { }) => {
const device = useDevice(); const device = useDevice();
const menuRef = useRef<HTMLDivElement>(null); const menuRef = useRef<HTMLDivElement>(null);
@ -45,8 +47,8 @@ const MenuContent = ({
style={style} style={style}
data-testid="dropdown-menu" data-testid="dropdown-menu"
side="bottom" side="bottom"
sideOffset={sideOffset ?? 4} sideOffset={sideOffset}
align="start" align={align}
> >
{/* the zIndex ensures this menu has higher stacking order, {/* the zIndex ensures this menu has higher stacking order,
see https://github.com/excalidraw/excalidraw/pull/1445 */} see https://github.com/excalidraw/excalidraw/pull/1445 */}