replace dropdown component

packages/tldraw/apps/tldraw-logseq/package.json

@@ -11,7 +11,6 @@
   },
   "devDependencies": {
     "@radix-ui/react-context-menu": "^2.1.0",
-    "@radix-ui/react-dropdown-menu": "^2.0.1",
     "@radix-ui/react-separator": "^1.0.1",
     "@radix-ui/react-slider": "^1.1.0",
     "@radix-ui/react-switch": "^1.0.1",

packages/tldraw/apps/tldraw-logseq/src/components/ZoomMenu/ZoomMenu.tsx

@@ -1,9 +1,9 @@
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'
 import { useApp } from '@tldraw/react'
 import { KeyboardShortcut } from '../KeyboardShortcut'
-import { MOD_KEY } from '@tldraw/core'
 import { observer } from 'mobx-react-lite'
-import * as React from 'react'
+
+// @ts-ignore
+const LSUI = window.LSUI
 
 export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
   const app = useApp()
@@ -12,59 +12,53 @@ export const ZoomMenu = observer(function ZoomMenu(): JSX.Element {
   }
 
   return (
-    <DropdownMenuPrimitive.Root>
-      <DropdownMenuPrimitive.Trigger className="tl-button text-sm px-2 important" id="tl-zoom">
+    <LSUI.DropdownMenu>
+      <LSUI.DropdownMenuTrigger className="tl-button text-sm px-2 important" id="tl-zoom">
         {(app.viewport.camera.zoom * 100).toFixed(0) + '%'}
-      </DropdownMenuPrimitive.Trigger>
-      <DropdownMenuPrimitive.Content
+      </LSUI.DropdownMenuTrigger>
+      <LSUI.DropdownMenuContent
         onCloseAutoFocus={e => e.preventDefault()}
-        className="tl-menu"
         id="zoomPopup"
         sideOffset={12}
       >
-        <DropdownMenuPrimitive.Item
-          className="tl-menu-item"
+        <LSUI.DropdownMenuItem
           onSelect={preventEvent}
           onClick={app.api.zoomToFit}
         >
           Zoom to drawing
           <KeyboardShortcut action="whiteboard/zoom-to-fit" />
-        </DropdownMenuPrimitive.Item>
-        <DropdownMenuPrimitive.Item
-          className="tl-menu-item"
+        </LSUI.DropdownMenuItem>
+        <LSUI.DropdownMenuItem
           onSelect={preventEvent}
           onClick={app.api.zoomToSelection}
           disabled={app.selectedShapesArray.length === 0}
         >
           Zoom to fit selection
           <KeyboardShortcut action="whiteboard/zoom-to-selection" />
-        </DropdownMenuPrimitive.Item>
-        <DropdownMenuPrimitive.Item
-          className="tl-menu-item"
+        </LSUI.DropdownMenuItem>
+        <LSUI.DropdownMenuItem
           onSelect={preventEvent}
           onClick={app.api.zoomIn}
         >
           Zoom in
           <KeyboardShortcut action="whiteboard/zoom-in" />
-        </DropdownMenuPrimitive.Item>
-        <DropdownMenuPrimitive.Item
-          className="tl-menu-item"
+        </LSUI.DropdownMenuItem>
+        <LSUI.DropdownMenuItem
           onSelect={preventEvent}
           onClick={app.api.zoomOut}
         >
           Zoom out
           <KeyboardShortcut action="whiteboard/zoom-out" />
-        </DropdownMenuPrimitive.Item>
-        <DropdownMenuPrimitive.Item
-          className="tl-menu-item"
+        </LSUI.DropdownMenuItem>
+        <LSUI.DropdownMenuItem
           onSelect={preventEvent}
           onClick={app.api.resetZoom}
         >
           Reset zoom
           <KeyboardShortcut action="whiteboard/reset-zoom" />
-        </DropdownMenuPrimitive.Item>
-      </DropdownMenuPrimitive.Content>
-    </DropdownMenuPrimitive.Root>
+        </LSUI.DropdownMenuItem>
+      </LSUI.DropdownMenuContent>
+    </LSUI.DropdownMenu>
   )
 })
 

packages/tldraw/yarn.lock

@@ -683,20 +683,6 @@
     "@radix-ui/react-use-callback-ref" "1.0.0"
     "@radix-ui/react-use-escape-keydown" "1.0.2"
 
-"@radix-ui/react-dropdown-menu@^2.0.1":
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-dropdown-menu/-/react-dropdown-menu-2.0.1.tgz#dbc90676df7fb313d6b1eb204fdb434dbb724d15"
-  integrity sha512-WDZqmwsNuxdBMkvgB85UeSPAT0wSBd+ojxtzX7lU7uYYh47gacCj6Spo0l9+X4TMe3JA1BBMN9c7OhIMaQeKbg==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "1.0.0"
-    "@radix-ui/react-compose-refs" "1.0.0"
-    "@radix-ui/react-context" "1.0.0"
-    "@radix-ui/react-id" "1.0.0"
-    "@radix-ui/react-menu" "2.0.1"
-    "@radix-ui/react-primitive" "1.0.1"
-    "@radix-ui/react-use-controllable-state" "1.0.0"
-
 "@radix-ui/[email protected]":
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-guards/-/react-focus-guards-1.0.0.tgz#339c1c69c41628c1a5e655f15f7020bf11aa01fa"