1import { ColorScheme } from "../themes/common/colorScheme"
2import { withOpacity } from "../utils/color"
3import { background, border, foreground, text } from "./components"
4
5export default function search(colorScheme: ColorScheme) {
6 let layer = colorScheme.highest
7
8 // Search input
9 const editor = {
10 background: background(layer),
11 cornerRadius: 8,
12 minWidth: 200,
13 maxWidth: 500,
14 placeholderText: text(layer, "mono", "disabled"),
15 selection: colorScheme.players[0],
16 text: text(layer, "mono", "default"),
17 border: border(layer),
18 margin: {
19 right: 12,
20 },
21 padding: {
22 top: 3,
23 bottom: 3,
24 left: 12,
25 right: 8,
26 },
27 }
28
29 const includeExcludeEditor = {
30 ...editor,
31 minWidth: 100,
32 maxWidth: 250,
33 };
34
35 return {
36 // TODO: Add an activeMatchBackground on the rust side to differentiate between active and inactive
37 matchBackground: withOpacity(foreground(layer, "accent"), 0.4),
38 optionButton: {
39 ...text(layer, "mono", "on"),
40 background: background(layer, "on"),
41 cornerRadius: 6,
42 border: border(layer, "on"),
43 margin: {
44 right: 4,
45 },
46 padding: {
47 bottom: 2,
48 left: 10,
49 right: 10,
50 top: 2,
51 },
52 active: {
53 ...text(layer, "mono", "on", "inverted"),
54 background: background(layer, "on", "inverted"),
55 border: border(layer, "on", "inverted"),
56 },
57 clicked: {
58 ...text(layer, "mono", "on", "pressed"),
59 background: background(layer, "on", "pressed"),
60 border: border(layer, "on", "pressed"),
61 },
62 hover: {
63 ...text(layer, "mono", "on", "hovered"),
64 background: background(layer, "on", "hovered"),
65 border: border(layer, "on", "hovered"),
66 },
67 },
68 editor,
69 invalidEditor: {
70 ...editor,
71 border: border(layer, "negative"),
72 },
73 includeExcludeEditor,
74 invalidIncludeExcludeEditor: {
75 ...includeExcludeEditor,
76 border: border(layer, "negative"),
77 },
78 matchIndex: {
79 ...text(layer, "mono", "variant"),
80 padding: {
81 left: 6,
82 },
83 },
84 optionButtonGroup: {
85 padding: {
86 left: 12,
87 right: 12,
88 },
89 },
90 includeExcludeInputs: {
91 ...text(layer, "mono", "variant"),
92 padding: {
93 right: 6,
94 },
95 },
96 resultsStatus: {
97 ...text(layer, "mono", "on"),
98 size: 18,
99 },
100 dismissButton: {
101 color: foreground(layer, "variant"),
102 iconWidth: 12,
103 buttonWidth: 14,
104 padding: {
105 left: 10,
106 right: 10,
107 },
108 hover: {
109 color: foreground(layer, "hovered"),
110 },
111 },
112 }
113}