contactFinder.ts

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