1import Theme from "../themes/common/theme";
 2import { backgroundColor, border, borderColor, popoverShadow, text } from "./components";
 3
 4export default function contextMenu(theme: Theme) {
 5  return {
 6    background: backgroundColor(theme, 300, "base"),
 7    cornerRadius: 6,
 8    padding: 6,
 9    shadow: popoverShadow(theme),
10    border: border(theme, "primary"),
11    keystrokeMargin: 30,
12    item: {
13      padding: { left: 4, right: 4, top: 2, bottom: 2 },
14      cornerRadius: 6,
15      label: text(theme, "sans", "secondary", { size: "sm" }),
16      keystroke: {
17        ...text(theme, "sans", "muted", { size: "sm", weight: "bold" }),
18        padding: { left: 3, right: 3 }
19      },
20      hover: {
21        background: backgroundColor(theme, 300, "hovered"),
22        text: text(theme, "sans", "primary", { size: "sm" }),
23      },
24      active: {
25        background: backgroundColor(theme, 300, "active"),
26        text: text(theme, "sans", "primary", { size: "sm" }),
27      },
28      activeHover: {
29        background: backgroundColor(theme, 300, "hovered"),
30        text: text(theme, "sans", "active", { size: "sm" }),
31      }
32    },
33    separator: {
34      background: borderColor(theme, "primary"),
35      margin: { top: 2, bottom: 2 }
36    },
37  }
38}