1import { ColorScheme } from "../theme/colorScheme"
 2import { background, border, borderColor, text } from "./components"
 3
 4export default function contextMenu(colorScheme: ColorScheme) {
 5    let layer = colorScheme.middle
 6    return {
 7        background: background(layer),
 8        cornerRadius: 10,
 9        padding: 4,
10        shadow: colorScheme.popoverShadow,
11        border: border(layer),
12        keystrokeMargin: 30,
13        item: {
14            iconSpacing: 8,
15            iconWidth: 14,
16            padding: { left: 6, right: 6, top: 2, bottom: 2 },
17            cornerRadius: 6,
18            label: text(layer, "sans", { size: "sm" }),
19            keystroke: {
20                ...text(layer, "sans", "variant", {
21                    size: "sm",
22                    weight: "bold",
23                }),
24                padding: { left: 3, right: 3 },
25            },
26            hover: {
27                background: background(layer, "hovered"),
28                label: text(layer, "sans", "hovered", { size: "sm" }),
29                keystroke: {
30                    ...text(layer, "sans", "hovered", {
31                        size: "sm",
32                        weight: "bold",
33                    }),
34                    padding: { left: 3, right: 3 },
35                },
36            },
37            active: {
38                background: background(layer, "active"),
39            },
40            activeHover: {
41                background: background(layer, "active"),
42            },
43        },
44        separator: {
45            background: borderColor(layer),
46            margin: { top: 2, bottom: 2 },
47        },
48    }
49}