shortcuts for zoom and breakpoints menu

app/designer/features/topbar/menu/menu.tsx

@@ -20,6 +20,9 @@ import {
   TrashIcon,
   ClipboardCopyIcon,
   CopyIcon,
+  ZoomInIcon,
+  ZoomOutIcon,
+  DevicesIcon,
 } from "~/shared/icons";
 import type { Config } from "~/config";
 import { ShortcutHint } from "./shortcut-hint";
@@ -135,6 +138,43 @@ export const Menu = ({ config, publish }: MenuProps) => {
           <ShortcutHint value={["backspace"]} />
         </DropdownMenuItem>
         <DropdownMenuSeparator />
+        <DropdownMenuItem
+          css={menuItemCss}
+          onSelect={() => {
+            publish({ type: "openBreakpointsMenu" });
+          }}
+        >
+          <DevicesIcon />
+          <Text css={textCss}>Breakpoints</Text>
+          <ShortcutHint value={["cmd", "b"]} />
+        </DropdownMenuItem>
+        <DropdownMenuItem
+          css={menuItemCss}
+          onSelect={() => {
+            publish({
+              type: "zoom",
+              payload: "zoomIn",
+            });
+          }}
+        >
+          <ZoomInIcon />
+          <Text css={textCss}>Zoom in</Text>
+          <ShortcutHint value={["cmd", "="]} />
+        </DropdownMenuItem>
+        <DropdownMenuItem
+          css={menuItemCss}
+          onSelect={() => {
+            publish({
+              type: "zoom",
+              payload: "zoomOut",
+            });
+          }}
+        >
+          <ZoomOutIcon />
+          <Text css={textCss}>Zoom out</Text>
+          <ShortcutHint value={["cmd", "-"]} />
+        </DropdownMenuItem>
+        <DropdownMenuSeparator />
         <DropdownMenuItem
           css={menuItemCss}
           onSelect={() => {

app/shared/design-system/index.ts

@@ -45,16 +45,7 @@ export {
   PopoverClose,
 } from "./components/popover";
 export { Heading } from "./components/heading";
-export {
-  DropdownMenu,
-  DropdownMenuCheckboxItem,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuGroup,
-  DropdownMenuTrigger,
-  DropdownMenuArrow,
-  DropdownMenuSeparator,
-} from "./components/dropdown-menu";
+export * from "./components/dropdown-menu";
 export { MenuContent, MenuItem, Menu, MenuAnchor } from "./components/menu";
 export { Paragraph } from "./components/paragraph";
 export { Link } from "./components/link";