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