1import { ColorScheme } from "../themes/common/colorScheme"
 2import { text, border, background, foreground } from "./components"
 3import editor from "./editor"
 4
 5export default function assistant(colorScheme: ColorScheme) {
 6    const layer = colorScheme.highest;
 7    return {
 8      container: {
 9        background: editor(colorScheme).background,
10        padding: { left: 12 }
11      },
12      header: {
13        border: border(layer, "default", { bottom: true, top: true }),
14        margin: { bottom: 6, top: 6 },
15        background: editor(colorScheme).background
16      },
17      userSender: {
18        ...text(layer, "sans", "default", { size: "sm", weight: "bold" }),
19      },
20      assistantSender: {
21        ...text(layer, "sans", "accent", { size: "sm", weight: "bold" }),
22      },
23      systemSender: {
24        ...text(layer, "sans", "variant", { size: "sm", weight: "bold" }),
25      },
26      sentAt: {
27        margin: { top: 2, left: 8 },
28        ...text(layer, "sans", "default", { size: "2xs" }),
29      },
30      modelInfoContainer: {
31        margin: { right: 16, top: 4 },
32      },
33      model: {
34        background: background(layer, "on"),
35        border: border(layer, "on", { overlay: true }),
36        padding: 4,
37        cornerRadius: 4,
38        ...text(layer, "sans", "default", { size: "xs" }),
39        hover: {
40          background: background(layer, "on", "hovered"),
41        }
42      },
43      remainingTokens: {
44        background: background(layer, "on"),
45        border: border(layer, "on", { overlay: true }),
46        padding: 4,
47        margin: { left: 4 },
48        cornerRadius: 4,
49        ...text(layer, "sans", "positive", { size: "xs" }),
50      },
51      noRemainingTokens: {
52        background: background(layer, "on"),
53        border: border(layer, "on", { overlay: true }),
54        padding: 4,
55        margin: { left: 4 },
56        cornerRadius: 4,
57        ...text(layer, "sans", "negative", { size: "xs" }),
58      },
59      errorIcon: {
60        margin: { left: 8 },
61        color: foreground(layer, "negative"),
62        width: 12,
63      },
64      apiKeyEditor: {
65          background: background(layer, "on"),
66          cornerRadius: 6,
67          text: text(layer, "mono", "on"),
68          placeholderText: text(layer, "mono", "on", "disabled", {
69              size: "xs",
70          }),
71          selection: colorScheme.players[0],
72          border: border(layer, "on"),
73          padding: {
74              bottom: 4,
75              left: 8,
76              right: 8,
77              top: 4,
78          },
79      },
80      apiKeyPrompt: {
81        padding: 10,
82        ...text(layer, "sans", "default", { size: "xs" }),
83      }
84    }
85}