1import { ColorScheme } from "../themes/common/colorScheme";
 2import {
 3  background,
 4  border,
 5  text,
 6} from "./components";
 7
 8export default function picker(colorScheme: ColorScheme) {
 9  let elevation = colorScheme.highest;
10  let layer = elevation.top;
11  return {
12    background: background(layer),
13    border: border(layer),
14    shadow: elevation.shadow,
15    cornerRadius: 12,
16    padding: {
17      bottom: 4
18    },
19    item: {
20      padding: {
21        bottom: 4,
22        left: 12,
23        right: 12,
24        top: 4,
25      },
26      margin: {
27        top: 1,
28        left: 4,
29        right: 4
30      },
31      cornerRadius: 8,
32      text: text(layer, "sans", "variant"),
33      highlightText: text(layer, "sans", "info", { weight: "bold" }),
34      active: {
35        background: background(layer, "active"),
36        text: text(layer, "sans", "active"),
37        highlightText: text(layer, "sans", "info", "active", { weight: "bold" }),
38      },
39      hover: {
40        background: background(layer, "hovered"),
41      },
42    },
43    empty: {
44      text: text(layer, "sans", "variant"),
45      padding: {
46        bottom: 8,
47        left: 16,
48        right: 16,
49        top: 8,
50      },
51    },
52    inputEditor: {
53      placeholderText: text(layer, "sans", "on", "disabled"),
54      selection: colorScheme.players[0],
55      text: text(layer, "mono", "on"),
56      border: border(layer, { bottom: true }),
57      padding: {
58        bottom: 8,
59        left: 16,
60        right: 16,
61        top: 8,
62      },
63      margin: {
64        bottom: 4
65      }
66    },
67  };
68}