snapshot of https://github.com/excalidraw/excalidraw.git (master, 2026-09-16; blobs > 131072B omitted)

packages/excalidraw/components/dropdownMenu/DropdownMenuSubContent.tsx

@@ -0,0 +1,71 @@
+import clsx from "clsx";
+
+import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
+
+import { useCallback, useState } from "react";
+
+import { useEditorInterface } from "../App";
+import { Island } from "../Island";
+import Stack from "../Stack";
+
+const BASE_ALIGN_OFFSET = -4;
+const BASE_SIDE_OFFSET = 4;
+
+const DropdownMenuSubContent = ({
+  children,
+  className,
+}: {
+  children?: React.ReactNode;
+  className?: string;
+}) => {
+  const editorInterface = useEditorInterface();
+
+  const classNames = clsx(`dropdown-menu dropdown-submenu ${className}`, {
+    "dropdown-menu--mobile": editorInterface.formFactor === "phone",
+  }).trim();
+
+  const callbacksRef = useCallback((node: HTMLDivElement | null) => {
+    if (node) {
+      const parentContainer = node.closest(".dropdown-menu-container");
+      const parentRect = parentContainer?.getBoundingClientRect();
+      if (parentRect) {
+        const menuWidth = node.getBoundingClientRect().width;
+
+        const viewportWidth = window.innerWidth;
+        const spaceRemaining = viewportWidth - parentRect.right;
+        if (spaceRemaining < menuWidth + 20) {
+          setSideOffset(spaceRemaining - menuWidth + BASE_ALIGN_OFFSET);
+          setAlignOffset(BASE_ALIGN_OFFSET + 8);
+        }
+      }
+    }
+  }, []);
+
+  const [sideOffset, setSideOffset] = useState(BASE_SIDE_OFFSET);
+  const [alignOffset, setAlignOffset] = useState(BASE_ALIGN_OFFSET);
+
+  return (
+    <DropdownMenuPrimitive.SubContent
+      className={classNames}
+      sideOffset={sideOffset}
+      alignOffset={alignOffset}
+      collisionPadding={8}
+      ref={callbacksRef}
+    >
+      {editorInterface.formFactor === "phone" ? (
+        <Stack.Col className="dropdown-menu-container">{children}</Stack.Col>
+      ) : (
+        <Island
+          className="dropdown-menu-container"
+          padding={2}
+          style={{ zIndex: 1 }}
+        >
+          {children}
+        </Island>
+      )}
+    </DropdownMenuPrimitive.SubContent>
+  );
+};
+
+export default DropdownMenuSubContent;
+DropdownMenuSubContent.displayName = "DropdownMenuSubContent";