1import Theme from "../themes/common/theme";
 2import { backgroundColor, border, borderColor, shadow, 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: shadow(theme),
10    border: border(theme, "primary"),
11    item: {
12      padding: { left: 4, right: 4, top: 2, bottom: 2 },
13      cornerRadius: 6,
14      label: text(theme, "sans", "secondary", { size: "sm" }),
15      keystroke: {
16        margin: { left: 60 },
17        ...text(theme, "sans", "muted", { size: "sm", weight: "bold" })
18      },
19      hover: {
20        background: backgroundColor(theme, 300, "hovered"),
21        text: text(theme, "sans", "primary", { size: "sm" }),
22      },
23      active: {
24        background: backgroundColor(theme, 300, "active"),
25        text: text(theme, "sans", "primary", { size: "sm" }),
26      },
27      activeHover: {
28        background: backgroundColor(theme, 300, "hovered"),
29        text: text(theme, "sans", "active", { size: "sm" }),
30      }
31    },
32    separator: {
33      background: borderColor(theme, "primary"),
34      margin: { top: 2, bottom: 2 }
35    },
36  }
37}