openAgent

1import { RGBA, TextAttributes } from "@opentui/core"
2import { For, type JSX } from "solid-js"
3import { tint, useTheme } from "../context/theme"
4import { logo } from "../logo"
5 
6export function Logo() {
7  const { theme } = useTheme()
8 
9  const renderLine = (line: string, fg: RGBA, bold: boolean): JSX.Element[] => {
10    const shadow = tint(theme.background, fg, 0.25)
11    const attrs = bold ? TextAttributes.BOLD : undefined
12    return Array.from(line).map((char) => {
13      if (char === "_") {
14        return (
15          <text fg={fg} bg={shadow} attributes={attrs} selectable={false}>
16            {" "}
17          </text>
18        )
19      }
20      if (char === "^") {
21        return (
22          <text fg={fg} bg={shadow} attributes={attrs} selectable={false}>
23            ▀
24          </text>
25        )
26      }
27      if (char === "~") {
28        return (
29          <text fg={shadow} attributes={attrs} selectable={false}>
30            ▀
31          </text>
32        )
33      }
34      if (char === ",") {
35        return (
36          <text fg={shadow} attributes={attrs} selectable={false}>
37            ▄
38          </text>
39        )
40      }
41      return (
42        <text fg={fg} attributes={attrs} selectable={false}>
43          {char}
44        </text>
45      )
46    })
47  }
48 
49  return (
50    <box>
51      <For each={logo.left}>
52        {(line, index) => (
53          <box flexDirection="row" gap={1}>
54            <box flexDirection="row">{renderLine(line, theme.textMuted, false)}</box>
55            <box flexDirection="row">{renderLine(logo.right[index()], theme.text, true)}</box>
56          </box>
57        )}
58      </For>
59    </box>
60  )
61}
62