picker.ts

 1import Theme from "../themes/common/theme";
 2import {
 3  backgroundColor,
 4  border,
 5  player,
 6  modalShadow,
 7  text,
 8} from "./components";
 9
10export default function picker(theme: Theme) {
11  return {
12    background: backgroundColor(theme, 300),
13    cornerRadius: 8,
14    padding: 8,
15    item: {
16      padding: {
17        bottom: 4,
18        left: 12,
19        right: 12,
20        top: 4,
21      },
22      cornerRadius: 8,
23      text: text(theme, "sans", "secondary"),
24      highlightText: text(theme, "sans", "feature", { weight: "bold" }),
25      active: {
26        background: backgroundColor(theme, 300, "active"),
27        text: text(theme, "sans", "active"),
28      },
29      hover: {
30        background: backgroundColor(theme, 300, "hovered"),
31      },
32    },
33    border: border(theme, "primary"),
34    empty: {
35      text: text(theme, "sans", "muted"),
36      padding: {
37        bottom: 4,
38        left: 12,
39        right: 12,
40        top: 8,
41      },
42    },
43    inputEditor: {
44      background: backgroundColor(theme, 500),
45      cornerRadius: 8,
46      placeholderText: text(theme, "sans", "placeholder"),
47      selection: player(theme, 1).selection,
48      text: text(theme, "mono", "primary"),
49      border: border(theme, "secondary"),
50      padding: {
51        bottom: 7,
52        left: 16,
53        right: 16,
54        top: 7,
55      },
56    },
57    shadow: modalShadow(theme),
58  };
59}