contactFinder.ts

 1import picker from "./picker"
 2import { ColorScheme } from "../themes/common/colorScheme"
 3import { background, border, foreground, text } from "./components"
 4
 5export default function contactFinder(colorScheme: ColorScheme) {
 6    let layer = colorScheme.middle
 7
 8    const sideMargin = 6
 9    const contactButton = {
10        background: background(layer, "variant"),
11        color: foreground(layer, "variant"),
12        iconWidth: 8,
13        buttonWidth: 16,
14        cornerRadius: 8,
15    }
16
17    const pickerStyle = picker(colorScheme)
18    const pickerInput = {
19        background: background(layer, "on"),
20        cornerRadius: 6,
21        text: text(layer, "mono"),
22        placeholderText: text(layer, "mono", "on", "disabled", { size: "xs" }),
23        selection: colorScheme.players[0],
24        border: border(layer),
25        padding: {
26            bottom: 4,
27            left: 8,
28            right: 8,
29            top: 4,
30        },
31        margin: {
32            left: sideMargin,
33            right: sideMargin,
34        },
35    }
36
37    return {
38        picker: {
39            emptyContainer: {},
40            item: {
41                ...pickerStyle.item,
42                margin: { left: sideMargin, right: sideMargin },
43            },
44            noMatches: pickerStyle.noMatches,
45            inputEditor: pickerInput,
46            emptyInputEditor: pickerInput,
47        },
48        rowHeight: 28,
49        contactAvatar: {
50            cornerRadius: 10,
51            width: 18,
52        },
53        contactUsername: {
54            padding: {
55                left: 8,
56            },
57        },
58        contactButton: {
59            ...contactButton,
60            hover: {
61                background: background(layer, "variant", "hovered"),
62            },
63        },
64        disabledContactButton: {
65            ...contactButton,
66            background: background(layer, "disabled"),
67            color: foreground(layer, "disabled"),
68        },
69    }
70}