picker.ts

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