1import picker from "./picker"
2import { ColorScheme } from "../theme/color_scheme"
3import { background, border, foreground, text } from "./components"
4
5export default function contact_finder(theme: ColorScheme): any {
6 const side_margin = 6
7 const contact_button = {
8 background: background(theme.middle, "variant"),
9 color: foreground(theme.middle, "variant"),
10 icon_width: 8,
11 button_width: 16,
12 corner_radius: 8,
13 }
14
15 const picker_style = picker(theme)
16 const picker_input = {
17 background: background(theme.middle, "on"),
18 corner_radius: 6,
19 text: text(theme.middle, "mono"),
20 placeholder_text: text(theme.middle, "mono", "on", "disabled", {
21 size: "xs",
22 }),
23 selection: theme.players[0],
24 border: border(theme.middle),
25 padding: {
26 bottom: 4,
27 left: 8,
28 right: 8,
29 top: 4,
30 },
31 margin: {
32 left: side_margin,
33 right: side_margin,
34 },
35 }
36
37 return {
38 picker: {
39 empty_container: {},
40 item: {
41 ...picker_style.item,
42 margin: { left: side_margin, right: side_margin },
43 },
44 no_matches: picker_style.no_matches,
45 input_editor: picker_input,
46 empty_input_editor: picker_input,
47 },
48 row_height: 28,
49 contact_avatar: {
50 corner_radius: 10,
51 width: 18,
52 },
53 contact_username: {
54 padding: {
55 left: 8,
56 },
57 },
58 contact_button: {
59 ...contact_button,
60 hover: {
61 background: background(theme.middle, "variant", "hovered"),
62 },
63 },
64 disabled_contact_button: {
65 ...contact_button,
66 background: background(theme.middle, "disabled"),
67 color: foreground(theme.middle, "disabled"),
68 },
69 }
70}