rird 2.1.231 → 2.3.0

package/src/cli/cmd/tui/component/dialog-theme-list.tsx

@@ -0,0 +1,50 @@
+import { DialogSelect, type DialogSelectRef } from "../ui/dialog-select"
+import { useTheme } from "../context/theme"
+import { useDialog } from "../ui/dialog"
+import { onCleanup, onMount } from "solid-js"
+
+export function DialogThemeList() {
+  const theme = useTheme()
+  const options = Object.keys(theme.all())
+    .sort((a, b) => a.localeCompare(b, undefined, { sensitivity: "base" }))
+    .map((value) => ({
+      title: value,
+      value: value,
+    }))
+  const dialog = useDialog()
+  let confirmed = false
+  let ref: DialogSelectRef<string>
+  const initial = theme.selected
+
+  onCleanup(() => {
+    if (!confirmed) theme.set(initial)
+  })
+
+  return (
+    <DialogSelect
+      title="Themes"
+      options={options}
+      current={initial}
+      onMove={(opt) => {
+        theme.set(opt.value)
+      }}
+      onSelect={(opt) => {
+        theme.set(opt.value)
+        confirmed = true
+        dialog.clear()
+      }}
+      ref={(r) => {
+        ref = r
+      }}
+      onFilter={(query) => {
+        if (query.length === 0) {
+          theme.set(initial)
+          return
+        }
+
+        const first = ref.filtered[0]
+        if (first) theme.set(first.value)
+      }}
+    />
+  )
+}

package/src/cli/cmd/tui/component/did-you-know.tsx

@@ -0,0 +1,85 @@
+import { createMemo, createSignal, For } from "solid-js"
+import { useTheme } from "@tui/context/theme"
+import { useKeybind } from "@tui/context/keybind"
+import { TIPS } from "./tips"
+import { EmptyBorder } from "./border"
+
+type TipPart = { text: string; highlight: boolean }
+
+function parseTip(tip: string): TipPart[] {
+  const parts: TipPart[] = []
+  const regex = /\{highlight\}(.*?)\{\/highlight\}/g
+  let lastIndex = 0
+  let match
+
+  while ((match = regex.exec(tip)) !== null) {
+    if (match.index > lastIndex) {
+      parts.push({ text: tip.slice(lastIndex, match.index), highlight: false })
+    }
+    parts.push({ text: match[1], highlight: true })
+    lastIndex = regex.lastIndex
+  }
+
+  if (lastIndex < tip.length) {
+    parts.push({ text: tip.slice(lastIndex), highlight: false })
+  }
+
+  return parts
+}
+
+const [tipIndex, setTipIndex] = createSignal(Math.floor(Math.random() * TIPS.length))
+
+export function randomizeTip() {
+  setTipIndex(Math.floor(Math.random() * TIPS.length))
+}
+
+const BOX_WIDTH = 42
+const TITLE = " 🅘 Did you know? "
+
+export function DidYouKnow() {
+  const { theme } = useTheme()
+  const keybind = useKeybind()
+
+  const tipParts = createMemo(() => parseTip(TIPS[tipIndex()]))
+
+  const dashes = createMemo(() => {
+    // ╭─ + title + ─...─ + ╮ = BOX_WIDTH
+    // 1 + 1 + title.length + dashes + 1 = BOX_WIDTH
+    return Math.max(0, BOX_WIDTH - 2 - TITLE.length - 1)
+  })
+
+  return (
+    <box position="absolute" bottom={3} right={2} width={BOX_WIDTH}>
+      <text>
+        <span style={{ fg: theme.border }}>╭─</span>
+        <span style={{ fg: theme.text }}>{TITLE}</span>
+        <span style={{ fg: theme.border }}>{"─".repeat(dashes())}╮</span>
+      </text>
+      <box
+        border={["left", "right", "bottom"]}
+        borderColor={theme.border}
+        customBorderChars={{
+          ...EmptyBorder,
+          bottomLeft: "╰",
+          bottomRight: "╯",
+          horizontal: "─",
+          vertical: "│",
+        }}
+      >
+        <box paddingLeft={2} paddingRight={2} paddingTop={1} paddingBottom={1}>
+          <text>
+            <For each={tipParts()}>
+              {(part) => <span style={{ fg: part.highlight ? theme.text : theme.textMuted }}>{part.text}</span>}
+            </For>
+          </text>
+        </box>
+      </box>
+      <box flexDirection="row" justifyContent="flex-end">
+        <text>
+          <span style={{ fg: theme.text }}>{keybind.print("tips_toggle")}</span>
+          <span style={{ fg: theme.textMuted }}> hide tips</span>
+        </text>
+      </box>
+    </box>
+  )
+}

package/src/cli/cmd/tui/component/logo.tsx

@@ -0,0 +1,48 @@
+import { TextAttributes } from "@opentui/core"
+import { For } from "solid-js"
+import { useTheme } from "@tui/context/theme"
+import { Flag } from "@/flag/flag"
+
+// RIRD ASCII Art Logo (Unicode box-drawing)
+const RIRD_LOGO = [
+  `\u2588\u2588\u2588\u2588\u2588\u2588\u2557 \u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2588\u2588\u2557 \u2588\u2588\u2588\u2588\u2588\u2588\u2557 `,
+  `\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2551\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557`,
+  `\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u2588\u2588\u2551\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u2588\u2588\u2551  \u2588\u2588\u2551`,
+  `\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2551\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2551  \u2588\u2588\u2551`,
+  `\u2588\u2588\u2551  \u2588\u2588\u2551\u2588\u2588\u2551\u2588\u2588\u2551  \u2588\u2588\u2551\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D`,
+  `\u255A\u2550\u255D  \u255A\u2550\u255D\u255A\u2550\u255D\u255A\u2550\u255D  \u255A\u2550\u255D\u255A\u2550\u2550\u2550\u2550\u2550\u255D `
+]
+
+const RIRD_LOGO_CLASSIC = [ // Renamed
+  `_^^_ ###  #^# #^#_ _^^^ _^^_ ###  #^# `,
+  `#..# ##^# #^# #..# #... #..# #..# #^# `,
+  `^__^ #..# ^^^ ^..^ ^^^^ ^__^ ^^^^ ^^^ `,
+]
+
+export function Logo() {
+  const { theme } = useTheme()
+  if (process.env["RIRD_QUIET"] === "true" || process.env["RIRD_QUIET"] === "true") {
+    return null
+  }
+  const logoData = Flag.OPENCODE_CLASSIC ? RIRD_LOGO_CLASSIC : RIRD_LOGO // Corrected usage
+  const subtitle = Flag.OPENCODE_CLASSIC ? "rird.ai" : "Computer Use Agent - rird.ai"
+
+  return (
+    <box>
+      <For each={logoData}>
+        {(line) => (
+          <box flexDirection="row">
+            <text fg={theme.primary} attributes={TextAttributes.BOLD} selectable={false}>
+              {line}
+            </text>
+          </box>
+        )}
+      </For>
+      <box marginTop={1}>
+        <text fg={theme.textMuted} selectable={false}>
+          {subtitle}
+        </text>
+      </box>
+    </box>
+  )
+}