plugin-gentleman 1.0.6 → 1.0.8

package/README.md

@@ -86,18 +86,19 @@ opencode plugin ./plugin-gentleman-<version>.tgz --global
 
 **Sidebar:**
 - Full Mustachi face with eyes and mustache
-- Animated eyes that occasionally look around *(when animations enabled)*
+- Animated blink, random look-around in 8 directions *(when animations enabled)*
 - Tongue and motivational phrases during busy states *(when animations enabled)*
+- Periodic expressive cycle every 45-60s to showcase animations *(when animations enabled)*
 
 ### The Mustachi Mascot
 
 **Mustachi** is the official mascot of the Gentleman Programming community — not something invented just for this plugin, but a character beloved by the community and now integrated into your coding environment.
 
 The ASCII representation features:
-- **Eyes** that occasionally look in different directions *(sidebar only)*
-- **Mustache** rendered in theme colors *(both home and sidebar)*
-- **Tongue** that appears during busy/loading states *(sidebar only)*
-- **Motivational phrases** in Rioplatense Spanish style *(sidebar only)*
+- **Eyes** that blink and look in 8 directions (center, up, down, left, right, and 4 diagonals) *(sidebar only)*
+- **Mustache** rendered in grayscale gradient on home screen, semantic zone colors in sidebar
+- **Tongue** that appears during busy states or periodic expressive cycles *(sidebar only)*
+- **Motivational phrases** in Rioplatense Spanish style — 2-3 random phrases rotating every 3s *(sidebar only)*
 
 **Example phrases during busy states:**
 - *"Ponete las pilas, hermano..."*
@@ -111,19 +112,33 @@ The ASCII representation features:
 
 **Low complexity, low frequency** — subtle and non-intrusive:
 
-**Eye Direction** *(when `animations: true`)*
-- Every ~4 seconds, eyes may look in a random direction
-- 20% chance of movement per interval
-- Returns to neutral position most of the time
+**Blink** *(when `animations: true`)*
+- Natural eyelid motion: open → half → closed → half → open
+- Progressive top-to-bottom animation (80-100ms per frame)
+- ~35% chance every 2s (average ~5-6 seconds between blinks)
 
-**Busy State** *(when `animations: true`)*
-- Tongue appears when OpenCode is processing
-- Motivational phrase rotates every 3 seconds
-- Only active during detected busy states
+**Eye Direction** *(when `animations: true`)*
+- Every ~3 seconds, eyes randomly look in one of 8 directions or stay center
+- 60% chance to stay centered, 40% chance to look around
+- Supports: up, down, left, right, and 4 diagonal positions
+- Returns to center frequently for natural feel
+
+**Busy/Expressive State** *(when `animations: true`)*
+- Tongue appears progressively when OpenCode is processing
+- Eyes squint during expressive state
+- 2-3 random motivational phrases rotating every 3 seconds (36+ phrase library)
+- Active during detected busy states OR periodic expressive cycles
+
+**Expressive Cycle Fallback** *(when `animations: true`)*
+- First cycle: 30-45s after load
+- Subsequent cycles: every 45-60s
+- Duration: 8 seconds per cycle
+- Ensures tongue + phrases are visible even if runtime busy detection is unreliable
 
 **Disabled** *(when `animations: false`)*
 - Mustachi stays in neutral position
-- No eye movement, tongue, or phrases
+- No blink, no eye movement, no tongue, no phrases
+- Completely static face
 
 ### Gentleman Theme
 
@@ -133,10 +148,16 @@ A refined dark color palette:
 - **Accent:** Warm gold (`#E0C15A`)
 - **Text:** Clean white (`#F3F6F9`)
 
-**Mustachi gradient** (3-tone):
-- **Top:** Accent gold
-- **Middle:** Primary blue  
-- **Bottom:** Error pink (`#CB7C94`)
+**Home screen mustache:** 3-tone grayscale gradient for better readability
+- **Top:** Light gray (`#C0C0C0`)
+- **Middle:** Mid gray (`#808080`)
+- **Bottom:** Dark gray (`#505050`)
+
+**Sidebar Mustachi:** Semantic zone colors for visual clarity
+- **Monocle:** Soft silver (`#B8B8B8`)
+- **Eyes:** Mid gray (`#808080`)
+- **Mustache:** Dark gray (`#606060`)
+- **Tongue:** Pink/red (`#FF4466`)
 
 ### Environment Detection
 
@@ -150,7 +171,9 @@ Both are fully configurable and can be hidden.
 
 ## Configuration
 
-All options are configured via plugin tuple syntax in `opencode.json`.
+All options are configured via plugin tuple syntax in `~/.config/opencode/opencode.json`.
+
+**Quick tip:** To disable animations, add `{ "animations": false }` to your plugin config (see examples below).
 
 ### Default Settings
 
@@ -190,6 +213,8 @@ All options are configured via plugin tuple syntax in `opencode.json`.
 
 **Disable Animations:**
 
+If you prefer a completely static Mustachi (no eye movement, no busy-state tongue/phrases):
+
 ```json
 {
   "$schema": "https://opencode.ai/config.json",
@@ -199,7 +224,12 @@ All options are configured via plugin tuple syntax in `opencode.json`.
 }
 ```
 
-Mustachi will remain static with neutral eyes and no busy-state expressions.
+This sets `animations: false`, which:
+- Disables blink animation
+- Keeps eyes in neutral center position (no looking around)
+- Hides tongue and motivational phrases during busy states
+- Disables periodic expressive cycles
+- Mustachi remains completely static
 
 **Logo Only (No Detection):**
 
@@ -240,18 +270,36 @@ The plugin integrates with OpenCode's TUI system through slot registration:
 
 1. **Theme Installation:** Installs `gentleman.json` into OpenCode themes on load
 2. **Theme Activation:** Switches to the gentleman theme *(if `set_theme: true`)*
-3. **Home Logo Slot:** Registers `home_logo` with mustache-only ASCII art
+3. **Home Logo Slot:** Registers `home_logo` with mustache-only ASCII art (grayscale gradient)
 4. **Environment Detection Slot:** Registers `home_bottom` with OS/provider info below the prompt
 5. **Sidebar Slot:** Registers `sidebar_content` with full Mustachi face and animations
-6. **Animation Loop:** Starts interval timers for eye variations and busy-state detection *(if `animations: true`, sidebar only)*
-7. **Busy State Detection:** Attempts to read `api.state.session.running` *(best-effort; may not be exposed by all OpenCode versions)*
+6. **Animation Loops:** Starts independent interval timers for:
+   - Blink animation (~5-6s average interval)
+   - Random eye look-around (~3s interval)
+   - Phrase rotation during expressive states (3s interval)
+   - Periodic expressive cycles (45-60s interval)
+   *(All sidebar-only, when `animations: true`)*
+7. **Busy State Detection:** Attempts to read `api.state.session.running` for reactive busy state *(best-effort; may not be exposed by all OpenCode versions)*
+8. **Expressive Cycle Fallback:** If busy detection is unreliable, periodic cycles ensure animations are visible
 
 ### Technical Stack
 
 - **No Build Step:** Plain TSX transpiled at runtime by OpenCode
-- **Solid.js Reactivity:** Uses `createSignal` and `createEffect` for animations
+- **Solid.js Reactivity:** Uses `createSignal` and `createEffect` for all animations
 - **Safe Detection:** All OS/provider detection wrapped in try-catch blocks
-- **Cleanup:** Uses `onCleanup` to clear intervals when component unmounts
+- **Cleanup:** Uses `onCleanup` to clear all intervals when components unmount
+- **Multi-file Architecture:** Separated concerns for maintainability (see Architecture below)
+
+### Architecture
+
+The plugin is structured as a multi-file module for maintainability and clarity:
+
+- **`tui.tsx`** — Plugin entry point. Handles initialization, theme setup, slot registration, and busy state detection.
+- **`components.tsx`** — All UI components (`HomeLogo`, `SidebarMustachi`, `DetectedEnv`). Contains all animation logic with Solid.js signals and effects (blink, look-around, expressive cycle).
+- **`ascii-frames.ts`** — All ASCII art assets: 9 eye position frames, 3 blink frames, squinted eyes, mustache designs, 3 tongue frames, and zone color definitions.
+- **`phrases.ts`** — Library of 36+ motivational phrases (Rioplatense Spanish style) shown during expressive states.
+- **`config.ts`** — Configuration parsing with type-safe defaults and validation helpers.
+- **`detection.ts`** — OS detection (reads `/etc/os-release` on Linux) and provider name mapping.
 
 ---
 
@@ -294,7 +342,12 @@ If you copy `.ts` files to `~/.config/opencode/plugins/` (system plugin):
 ### Package Contents
 
 **Files included in npm package** *(via `files` field in `package.json`)*:
-- `tui.tsx` — main plugin implementation
+- `tui.tsx` — plugin entry point and slot registration
+- `components.tsx` — UI components (HomeLogo, SidebarMustachi, DetectedEnv)
+- `ascii-frames.ts` — all ASCII art frames, eye positions, and color definitions
+- `phrases.ts` — motivational phrases library for busy states
+- `config.ts` — configuration parsing helpers and type definitions
+- `detection.ts` — OS and provider detection utilities
 - `gentleman.json` — theme definition
 - `package.json` — auto-included by npm
 - `README.md` — auto-included by npm
@@ -307,12 +360,18 @@ If you copy `.ts` files to `~/.config/opencode/plugins/` (system plugin):
 
 ## Known Limitations
 
-1. **Busy State Detection:** The plugin attempts to detect busy states via `api.state.session.running`, but this may not be exposed in all OpenCode versions. If unavailable, busy-state animations won't trigger *(eye animations still work in sidebar)*.
+1. **Busy State Detection:** The plugin attempts to detect busy states via `api.state.session.running`, but this may not be exposed in all OpenCode versions. If unavailable, a periodic expressive cycle fallback (every 45-60s) ensures animations remain visible.
 
-2. **Animation Frequency:** Currently set to low frequency (4s for eyes, 3s for phrase rotation). Adjust the intervals in `tui.tsx` if needed.
+2. **Animation Frequency:** Current timing intervals:
+   - Blink: ~5-6 seconds average (35% chance every 2s)
+   - Look-around: 3 seconds (60% center, 40% random direction)
+   - Phrase rotation: 3 seconds during expressive state
+   - Expressive cycle: first at 30-45s, then every 45-60s
+   
+   To adjust, modify the intervals in `components.tsx` (lines 79, 107, 168, 193-198).
 
 3. **Slot Usage:** The plugin uses these OpenCode TUI slots:
-   - `home_logo` — mustache-only ASCII art
+   - `home_logo` — mustache-only ASCII art (grayscale gradient)
    - `home_bottom` — environment detection (OS + providers)
    - `sidebar_content` — full Mustachi face with animations
 
@@ -324,23 +383,39 @@ If you copy `.ts` files to `~/.config/opencode/plugins/` (system plugin):
 
 ### Modifying the Plugin
 
-To work on the plugin:
+The plugin is organized into focused modules for easy customization:
+
+**Adding new content:**
+
+- **Motivational phrases:** Edit `phrases.ts` — add new phrases to the `busyPhrases` array (currently 36+ phrases)
+- **ASCII art frames:** Edit `ascii-frames.ts` — modify eye positions (9 variants), blink frames (3 stages), mustache designs, or tongue frames (3 growth stages)
+- **UI logic:** Edit `components.tsx` — adjust animation timings, add new effects, or tweak component layout
+- **Configuration:** Edit `config.ts` — add new config options with type-safe defaults
+- **Detection logic:** Edit `detection.ts` — add new OS detection patterns or provider mappings
+- **Plugin behavior:** Edit `tui.tsx` — modify slot registration, initialization flow, or busy detection
+
+**Testing locally:**
 
-1. Edit `tui.tsx` (main implementation)
-2. Test locally with `npm link` or `npm pack`
+1. Make your changes in the appropriate file(s)
+2. Test with `npm link` or `npm pack` (see "For Developers" section above)
 3. No build step needed — OpenCode transpiles TSX at runtime
 4. Restart OpenCode to see changes
 
-### Adding New Content
+**Animation timing customization:**
 
-**Eye variations:**
-- Edit the `eyeVariations` array in `tui.tsx` *(affects sidebar only)*
+All animation intervals are in `components.tsx`:
+- **Look-around interval:** Line 79 — currently 3000ms (3s)
+- **Blink interval:** Line 107 — currently 2000ms with 35% chance (~5-6s average)
+- **Blink frame timing:** Lines 91-98 — currently 80-100ms per frame progression
+- **Phrase rotation:** Line 168 — currently 3000ms (3s) during expressive state
+- **Expressive cycle timing:** Lines 193-198 — first cycle at 30-45s, then every 45-60s
+- **Expressive cycle duration:** Line 189 — currently 8000ms (8s)
 
-**Busy phrases:**
-- Edit the `busyPhrases` array in `tui.tsx` *(affects sidebar only)*
+**Color customization:**
 
-**Animation timings:**
-- Adjust `setInterval` durations in the `SidebarMustachi` component
+- **Zone colors (sidebar):** Edit `zoneColors` object in `ascii-frames.ts` (monocle, eyes, mustache, tongue)
+- **Home grayscale gradient:** Edit `HomeLogo` component in `components.tsx` (lines 22-24)
+- **Theme colors:** Edit `gentleman.json` for the full color palette
 
 ---
 

package/ascii-frames.ts

@@ -0,0 +1,163 @@
+// ASCII art frames and animation data
+
+// Premium Mustachi ASCII art - structured by semantic zones
+// Each eye state is a complete frame to avoid partial replacements
+
+// Eye frames - neutral state with different pupil positions
+// All lines are padded to 27 chars for perfect alignment with mustache
+
+export const eyeNeutralCenter = [
+  "     █████       █████     ",  // 27 chars
+  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars
+  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars - pupils center
+  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars - pupils center
+  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars
+]
+
+export const eyeNeutralUp = [
+  "     █████       █████     ",  // 27 chars
+  "   ██████░██   ██░░░░░██   ",  // 27 chars - pupils up
+  "  ██░█████░██ ██░░░░░░░██  ",  // 27 chars - pupils up
+  "  ██░░░░░░░██ ██░░░░░░░██  ",  // 27 chars
+  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars
+]
+
+export const eyeNeutralDown = [
+  "     █████       █████     ",  // 27 chars
+  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars
+  "  ██░░░░░░░██ ██░░░░░░░██  ",  // 27 chars
+  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars - pupils down
+  "██ ██████░░██   ██░░░░░██ ██",  // 27 chars - pupils down
+]
+
+export const eyeNeutralLeft = [
+  "     █████       █████     ",  // 27 chars
+  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars
+  "  ██████░░░██ ██░░░░░░░██  ",  // 27 chars - pupils left
+  "  ██████░░░██ ██░░░░░░░██  ",  // 27 chars - pupils left
+  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars
+]
+
+export const eyeNeutralRight = [
+  "     █████       █████     ",  // 27 chars
+  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars
+  "  ██░░░██████ ██░░░░░░░██  ",  // 27 chars - pupils right
+  "  ██░░░██████ ██░░░░░░░██  ",  // 27 chars - pupils right
+  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars
+]
+
+export const eyeNeutralUpLeft = [
+  "     █████       █████     ",  // 27 chars
+  "   ███████░██  ██░░░░░██   ",  // 27 chars - up-left diagonal
+  "  ████████░██ ██░░░░░░░██  ",  // 27 chars - up-left diagonal
+  "  ██░░░░░░░██ ██░░░░░░░██  ",  // 27 chars
+  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars
+]
+
+export const eyeNeutralUpRight = [
+  "     █████       █████     ",  // 27 chars
+  "   ██░███████  ██░░░░░██   ",  // 27 chars - up-right diagonal
+  "  ██░████████ ██░░░░░░░██  ",  // 27 chars - up-right diagonal
+  "  ██░░░░░░░██ ██░░░░░░░██  ",  // 27 chars
+  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars
+]
+
+export const eyeNeutralDownLeft = [
+  "     █████       █████     ",  // 27 chars
+  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars
+  "  ██░░░░░░░██ ██░░░░░░░██  ",  // 27 chars
+  "  ███████░░██ ██░░░░░░░██  ",  // 27 chars - down-left diagonal
+  "██ ████████░█   ██░░░░░██ ██",  // 27 chars - down-left diagonal
+]
+
+export const eyeNeutralDownRight = [
+  "     █████       █████     ",  // 27 chars
+  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars
+  "  ██░░░░░░░██ ██░░░░░░░██  ",  // 27 chars
+  "  ██░░░███████ ██░░░░░░░██  ",  // 27 chars - down-right diagonal
+  "██ ██░████████  ██░░░░░██ ██",  // 27 chars - down-right diagonal
+]
+
+// Squinted eyes version for busy/expressive state
+export const eyeSquinted = [
+  "     █████       █████     ",  // 27 chars
+  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars
+  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars
+  "   █████████   █████████   ",  // 27 chars
+  "██  █████         █████  ██",  // 27 chars
+]
+
+// Blink frames - half closed (upper eyelid descending from top)
+export const eyeBlinkHalf = [
+  "     █████       █████     ",  // 27 chars - monocle border top unchanged
+  "   █████████   ██████████  ",  // 27 chars - upper eyelid descends halfway
+  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars - pupils still visible
+  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars - pupils still visible
+  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars - bottom unchanged
+]
+
+// Blink frames - fully closed (upper eyelid fully descended)
+export const eyeBlinkClosed = [
+  "     █████       █████     ",  // 27 chars - monocle border top unchanged
+  "   █████████   ██████████  ",  // 27 chars - upper eyelid down
+  "   █████████   ██████████  ",  // 27 chars - eyes fully closed
+  "   █████████   █████████   ",  // 27 chars - bottom transition
+  "██  █████         █████  ██",  // 27 chars - bottom unchanged
+]
+
+// Mustache section (all lines padded to 27 chars for alignment)
+export const mustachiMustacheSection = [
+  "████████████   ████████████",  // 27 chars - perfectly symmetric
+  "███████████████████████████",  // 27 chars - perfectly symmetric
+  " █████████████████████████ ",  // 27 chars - perfectly symmetric
+  "  ▓█████████████████████▓  ",  // 27 chars - perfectly symmetric
+  "    ▓█████████████████▓    ",  // 27 chars - perfectly symmetric
+]
+
+// Tongue animation frames (progressive) - compact design
+export const tongueFrames = [
+  [],  // no tongue
+  ["             ███", "              █"],  // tongue out
+]
+
+// Mustache-only ASCII art for home logo (original massive solid block design)
+export const mustachiMustacheOnly = [
+  "",
+  "               ████████                 ████████",
+  "             ████████████             ████████████",
+  "    ██      ████████████████       ████████████████      ██",
+  "   ████    ████████████████████ ████████████████████    ████",
+  "  ██████  ███████████████████████████████████████████  ██████",
+  "  ███████████████████████████████████████████████████████████",
+  "  ███████████████████████████████████████████████████████████",
+  "  ███████████████████████████████████████████████████████████",
+  "   █████████████████████████████████████████████████████████",
+  "    ███████████████████████████████████████████████████████",
+  "      ▓▓█████████████████████     █████████████████████▓▓",
+  "        ▓▓▓███████████████           ███████████████▓▓▓",
+  "           ▓▓▓█████████                 █████████▓▓▓",
+  "              ▓▓▓▓▓▓▓                     ▓▓▓▓▓▓▓",
+  "",
+]
+
+// Pupil position mapping for look-around animation
+// All possible eye directions for random transitions
+export const pupilPositionFrames = [
+  eyeNeutralCenter,     // center (most common)
+  eyeNeutralUp,         // up
+  eyeNeutralDown,       // down
+  eyeNeutralLeft,       // left
+  eyeNeutralRight,      // right
+  eyeNeutralUpLeft,     // up-left diagonal
+  eyeNeutralUpRight,    // up-right diagonal
+  eyeNeutralDownLeft,   // down-left diagonal
+  eyeNeutralDownRight,  // down-right diagonal
+]
+
+// Semantic zone colors for better visual hierarchy
+export const zoneColors = {
+  monocle: "#B8B8B8",    // Subtle steel/silver for monocle border (distinct from eye color)
+  eyes: "#808080",        // Mid gray for eyes
+  mustache: "#606060",    // Darker gray for mustache
+  tongue: "#FF4466",      // Pink/Red for tongue
+}

package/components.tsx

@@ -0,0 +1,269 @@
+// @ts-nocheck
+/** @jsxImportSource @opentui/solid */
+import type { TuiThemeCurrent } from "@opencode-ai/plugin/tui"
+import { createSignal, onCleanup, createEffect } from "solid-js"
+import type { Cfg } from "./config"
+import { getOSName, getProviders } from "./detection"
+import {
+  pupilPositionFrames,
+  eyeSquinted,
+  eyeBlinkHalf,
+  eyeBlinkClosed,
+  mustachiMustacheSection,
+  tongueFrames,
+  mustachiMustacheOnly,
+  zoneColors,
+} from "./ascii-frames"
+import { busyPhrases } from "./phrases"
+
+// Home logo: Mustache-only (simple and prominent) with grayscale gradient
+export const HomeLogo = (props: { theme: TuiThemeCurrent }) => {
+  // Grayscale palette for better TUI readability
+  const lightGray = "#C0C0C0"   // Light gray for highlights
+  const midGray = "#808080"      // Mid gray for main body
+  const darkGray = "#505050"     // Dark gray for shadows
+
+  return (
+    <box flexDirection="column" alignItems="center">
+      {/* Mustache with grayscale gradient for depth */}
+      {mustachiMustacheOnly.map((line, idx) => {
+        const totalLines = mustachiMustacheOnly.length
+        let color = midGray
+        if (idx < totalLines / 3) {
+          color = lightGray  // Top highlight
+        } else if (idx >= (2 * totalLines) / 3) {
+          color = darkGray   // Bottom shadow
+        }
+        return <text fg={color}>{line.padEnd(61, " ")}</text>
+      })}
+
+      {/* OpenCode branding */}
+      <box flexDirection="row" gap={0} marginTop={1}>
+        <text fg={props.theme.textMuted} dimColor={true}>╭ </text>
+        <text fg={props.theme.primary} bold={true}> O p e n C o d e </text>
+        <text fg={props.theme.textMuted} dimColor={true}> ╮</text>
+      </box>
+
+      <text> </text>
+    </box>
+  )
+}
+
+// Sidebar: Full Mustachi face with progressive animations (semantic zone colors)
+export const SidebarMustachi = (props: { theme: TuiThemeCurrent; config: Cfg; isBusy?: boolean }) => {
+  const [pupilIndex, setPupilIndex] = createSignal(0)
+  const [blinkFrame, setBlinkFrame] = createSignal(0)
+  const [tongueFrame, setTongueFrame] = createSignal(0)
+  const [busyPhrase, setBusyPhrase] = createSignal("")
+  const [expressiveCycle, setExpressiveCycle] = createSignal(false)
+
+  // Animation: pupil movement (look around) - random transitions, not a sequence
+  createEffect(() => {
+    if (!props.config.animations || props.isBusy || expressiveCycle()) {
+      setPupilIndex(0)
+      return
+    }
+
+    const interval = setInterval(() => {
+      // Random eye movement - not sequential
+      // 60% chance to stay at center, 40% to move randomly
+      if (Math.random() < 0.6) {
+        setPupilIndex(0)  // center
+      } else {
+        // Pick a random direction (skip center at index 0)
+        const randomDir = 1 + Math.floor(Math.random() * (pupilPositionFrames.length - 1))
+        setPupilIndex(randomDir)
+      }
+    }, 3000)
+
+    onCleanup(() => clearInterval(interval))
+  })
+
+  // Animation: blink - occasional, progressive top-to-bottom motion
+  createEffect(() => {
+    if (!props.config.animations) return
+
+    const blinkSequence = async () => {
+      // Open -> half -> closed -> half -> open (normal eyelid motion)
+      setBlinkFrame(0)
+      await new Promise(r => setTimeout(r, 100))
+      setBlinkFrame(1)
+      await new Promise(r => setTimeout(r, 80))
+      setBlinkFrame(2)
+      await new Promise(r => setTimeout(r, 80))
+      setBlinkFrame(1)
+      await new Promise(r => setTimeout(r, 80))
+      setBlinkFrame(0)
+    }
+
+    const interval = setInterval(() => {
+      // Blink more frequently to feel alive (~every 5-6 seconds)
+      // 35% chance every 2s = average 5.7s between blinks
+      if (Math.random() < 0.35) {
+        blinkSequence()
+      }
+    }, 2000)
+
+    onCleanup(() => clearInterval(interval))
+  })
+
+  // Busy/expressive state animation: tongue + single rotating phrase
+  // If isBusy is reliably reactive, use it; otherwise demonstrate expressiveness periodically
+  createEffect(() => {
+    if (!props.config.animations) {
+      setTongueFrame(0)
+      setBusyPhrase("")
+      setExpressiveCycle(false)
+      return
+    }
+
+    const shouldShowExpression = props.isBusy || expressiveCycle()
+
+    if (!shouldShowExpression) {
+      setTongueFrame(0)
+      setBusyPhrase("")
+      return
+    }
+
+    // Show tongue progressively when entering expressive state
+    let currentFrame = 0
+    let tongueTimeoutId: NodeJS.Timeout | undefined
+    const growTongue = () => {
+      if (currentFrame < tongueFrames.length - 1) {
+        currentFrame++
+        setTongueFrame(currentFrame)
+      }
+    }
+    tongueTimeoutId = setTimeout(growTongue, 200)
+
+    // Pick a random phrase and rotate through the library
+    const pickRandomPhrase = () => {
+      const randomIndex = Math.floor(Math.random() * busyPhrases.length)
+      return busyPhrases[randomIndex]
+    }
+
+    setBusyPhrase(pickRandomPhrase())
+
+    const interval = setInterval(() => {
+      setBusyPhrase(pickRandomPhrase())
+    }, 3000)
+
+    onCleanup(() => {
+      clearInterval(interval)
+      if (tongueTimeoutId !== undefined) {
+        clearTimeout(tongueTimeoutId)
+      }
+    })
+  })
+
+  // Fallback: Periodic expressive cycle (conservative - every ~45-60 seconds for ~8s)
+  // This ensures tongue + phrases are visibly demonstrated even if runtime busy state is unreliable
+  createEffect(() => {
+    if (!props.config.animations || props.isBusy) return
+
+    const triggerExpressiveCycle = () => {
+      setExpressiveCycle(true)
+
+      // End expressive cycle after 8 seconds
+      setTimeout(() => {
+        setExpressiveCycle(false)
+      }, 8000)
+    }
+
+    // First cycle after 30-45s, then every 45-60s
+    const firstDelay = 30000 + Math.random() * 15000
+    const firstTimeout = setTimeout(triggerExpressiveCycle, firstDelay)
+
+    const interval = setInterval(() => {
+      triggerExpressiveCycle()
+    }, 45000 + Math.random() * 15000)
+
+    onCleanup(() => {
+      clearTimeout(firstTimeout)
+      clearInterval(interval)
+    })
+  })
+
+  // Build the complete Mustachi face
+  const buildFace = () => {
+    const lines: { content: string; zone: string }[] = []
+
+    // Select eye frame based on state
+    let eyeFrame = pupilPositionFrames[pupilIndex()]
+
+    // Apply squint if busy/expressive
+    if (props.isBusy || expressiveCycle()) {
+      eyeFrame = eyeSquinted
+    }
+
+    // Apply blink animation if active
+    if (blinkFrame() === 1) {
+      eyeFrame = eyeBlinkHalf
+    } else if (blinkFrame() === 2) {
+      eyeFrame = eyeBlinkClosed
+    }
+
+    // Add eyes with zone metadata
+    eyeFrame.forEach((line, idx) => {
+      // Lines 0-1 are monocle border, lines 2-4 are eye interior
+      const zone = idx < 2 ? "monocle" : "eyes"
+      lines.push({ content: line, zone })
+    })
+
+    // Add mustache section
+    mustachiMustacheSection.forEach(line => {
+      lines.push({ content: line, zone: "mustache" })
+    })
+
+    // Add tongue if expressive (mark as tongue zone for pink color)
+    if ((props.isBusy || expressiveCycle()) && tongueFrame() > 0) {
+      const tongueLines = tongueFrames[tongueFrame()]
+      tongueLines.forEach(line => {
+        lines.push({ content: line, zone: "tongue" })
+      })
+    }
+
+    return lines
+  }
+
+  return (
+    <box flexDirection="column" alignItems="center">
+      {/* Full Mustachi face with semantic zone colors */}
+      {buildFace().map(({ content, zone }) => {
+        const color = zoneColors[zone as keyof typeof zoneColors] || zoneColors.mustache
+        const paddedLine = content.padEnd(27, " ")
+        return <text fg={color}>{paddedLine}</text>
+      })}
+
+      {/* Display single busy phrase if loading */}
+      {busyPhrase() && (
+        <text fg={props.theme.warning}>{busyPhrase()}</text>
+      )}
+
+      <text> </text>
+    </box>
+  )
+}
+
+export const DetectedEnv = (props: {
+  theme: TuiThemeCurrent
+  providers: ReadonlyArray<{ id: string; name: string }> | undefined
+  config: Cfg
+}) => {
+  if (!props.config.show_detected) return null
+
+  const os = props.config.show_os ? getOSName() : null
+  const providers = props.config.show_providers ? getProviders(props.providers) : null
+
+  // Don't render if nothing to show
+  if (!os && !providers) return null
+
+  return (
+    <box flexDirection="row" gap={1}>
+      <text fg={props.theme.textMuted}>Detected:</text>
+      {os && <text fg={props.theme.text}>{os}</text>}
+      {os && providers && <text fg={props.theme.textMuted}>·</text>}
+      {providers && <text fg={props.theme.text}>{providers}</text>}
+    </box>
+  )
+}

package/config.ts

@@ -0,0 +1,39 @@
+// Configuration types and parsing helpers
+
+export type Cfg = {
+  enabled: boolean
+  theme: string
+  set_theme: boolean
+  show_detected: boolean
+  show_os: boolean
+  show_providers: boolean
+  animations: boolean
+}
+
+const rec = (value: unknown) => {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return
+  return Object.fromEntries(Object.entries(value))
+}
+
+const pick = (value: unknown, fallback: string) => {
+  if (typeof value !== "string") return fallback
+  if (!value.trim()) return fallback
+  return value
+}
+
+const bool = (value: unknown, fallback: boolean) => {
+  if (typeof value !== "boolean") return fallback
+  return value
+}
+
+export const cfg = (opts: Record<string, unknown> | undefined): Cfg => {
+  return {
+    enabled: bool(opts?.enabled, true),
+    theme: pick(opts?.theme, "gentleman"),
+    set_theme: bool(opts?.set_theme, true),
+    show_detected: bool(opts?.show_detected, true),
+    show_os: bool(opts?.show_os, true),
+    show_providers: bool(opts?.show_providers, true),
+    animations: bool(opts?.animations, true),
+  }
+}

package/detection.ts

@@ -0,0 +1,61 @@
+// OS and provider detection utilities
+
+import { readFileSync } from "node:fs"
+
+// Helper to detect OS name
+export const getOSName = (): string => {
+  try {
+    const platform = typeof process !== "undefined" ? process.platform : "unknown"
+    switch (platform) {
+      case "linux":
+        try {
+          const osRelease = readFileSync("/etc/os-release", "utf8")
+          const match = osRelease.match(/^NAME="?([^"\n]+)"?/m)
+          if (match) return match[1]
+        } catch {
+        }
+        return "Linux"
+      case "darwin":
+        return "macOS"
+      case "win32":
+        return "Windows"
+      default:
+        return platform
+    }
+  } catch {
+    return "Unknown"
+  }
+}
+
+// Map provider IDs to friendly display names
+const providerDisplayNames: Record<string, string> = {
+  "openai": "OpenAI",
+  "google": "Google",
+  "github-copilot": "Copilot",
+  "opencode-go": "OpenCode GO",
+  "anthropic": "Claude",
+  "deepseek": "DeepSeek",
+  "openrouter": "OpenRouter",
+  "mistral": "Mistral",
+  "groq": "Groq",
+  "cohere": "Cohere",
+  "together": "Together",
+  "perplexity": "Perplexity",
+}
+
+// Helper to detect active providers from OpenCode state
+export const getProviders = (providers: ReadonlyArray<{ id: string; name: string }> | undefined): string => {
+  if (!providers || providers.length === 0) {
+    return "No providers configured"
+  }
+
+  // Map provider IDs to friendly names and deduplicate
+  const names = new Set<string>()
+  for (const provider of providers) {
+    const displayName = providerDisplayNames[provider.id] || provider.name || provider.id
+    names.add(displayName)
+  }
+
+  // Return compact comma-separated list
+  return Array.from(names).sort().join(", ")
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "plugin-gentleman",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "description": "OpenCode TUI plugin featuring Mustachi - an animated ASCII mascot with eyes, mustache, and optional motivational phrases during busy states",
   "type": "module",
   "exports": {
@@ -20,6 +20,11 @@
   },
   "files": [
     "tui.tsx",
+    "config.ts",
+    "detection.ts",
+    "ascii-frames.ts",
+    "phrases.ts",
+    "components.tsx",
     "gentleman.json"
   ],
   "engines": {

package/phrases.ts

@@ -0,0 +1,58 @@
+// Motivational phrases for busy/loading state
+// Add new phrases here to expand the library
+
+export const busyPhrases = [
+  // Original classics
+  "Ponete las pilas, hermano...",
+  "Dale que va, dale que va...",
+  "Ya casi, ya casi...",
+  "Ahí vamos, loco...",
+  "Un toque más y listo...",
+  "Aguantá que estoy pensando...",
+  "Momento, momento...",
+  "Ya te lo traigo, tranqui...",
+  
+  // New additions for variety
+  "Dame un segundo, campeón...",
+  "Trabajando en eso, maestro...",
+  "Ya salimos, paciencia...",
+  "Dejame terminar esto...",
+  "Casi listo, bancame...",
+  "Estoy en eso, tranquilo...",
+  "Un cachito más, hermano...",
+  "Procesando, no desesperes...",
+  "Ya falta poco, dale...",
+  "Lo estoy cocinando...",
+  "Mirá que estoy pensando...",
+  "Tranqui, ya lo tengo...",
+  "Un ratito más, loco...",
+  "Dejame concentrar...",
+  "Vamos vamos, sin apuro...",
+  "Que no se note el esfuerzo...",
+  "Ahí va, ahí va...",
+  "Procesando con elegancia...",
+  "Un toque más de paciencia...",
+  "Ya te resuelvo esto...",
+  "Estoy en la zona, esperá...",
+  "Dale tiempo al tiempo...",
+  "Tranquilo, todo bajo control...",
+  "Un segundo de concentración...",
+  "Mirá cómo se hace esto...",
+  
+  // Dev jokes (Argentina + Spain friendly)
+  "¿Qué le dice un bit a otro? Nos vemos en el bus",
+  "Hay 10 tipos de personas: las que entienden binario y las que no",
+  "¿Por qué los programadores confunden Halloween con Navidad? Porque Oct 31 = Dec 25",
+  "Mi código no tiene bugs, desarrolla características inesperadas",
+  "Un SQL entra a un bar, ve dos tablas y pregunta: ¿Puedo unirme?",
+  "¿Cuál es el animal favorito de un programador? El bug",
+  "No es un bug, es una funcionalidad no documentada",
+  "Hay dos cosas difíciles en programación: naming y cache invalidation",
+  "¿Qué hace un programador en la playa? Hace surf... por la web",
+  "Código que funciona en mi máquina™",
+  "99 little bugs in the code, 99 bugs to fix... take one down, patch it around, 127 little bugs in the code",
+  "¿Por qué los programadores prefieren el modo oscuro? Porque la luz atrae bugs",
+  "Debugging: ser el detective en una novela de crimen donde también sos el asesino",
+  "¡Todo compila! (pero no hace lo que debería)",
+  "Si depurar es quitar bugs, programar debe ser ponerlos",
+]

package/tui.tsx

@@ -1,473 +1,17 @@
 // @ts-nocheck
 /** @jsxImportSource @opentui/solid */
-import { readFileSync } from "node:fs"
-import type { TuiPlugin, TuiPluginModule, TuiThemeCurrent } from "@opencode-ai/plugin/tui"
-import { createSignal, onCleanup, createEffect } from "solid-js"
+import type { TuiPlugin, TuiPluginModule } from "@opencode-ai/plugin/tui"
+import { createSignal, createEffect } from "solid-js"
+import { cfg, type Cfg } from "./config"
+import { HomeLogo, SidebarMustachi, DetectedEnv } from "./components"
 
 const id = "gentleman"
 
-// Premium Mustachi ASCII art - structured by semantic zones
-// Each eye state is a complete frame to avoid partial replacements
-
-// Eye frames - neutral state with different pupil positions
-// All lines are padded to 27 chars for perfect alignment with mustache
-const eyeNeutralCenter = [
-  "     █████       █████     ",  // 27 chars (was 22)
-  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars (was 24)
-  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars (was 25)
-  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars (was 25)
-  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars (unchanged)
-]
-
-const eyeNeutralLeft = [
-  "     █████       █████     ",  // 27 chars (was 22)
-  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars (was 24)
-  "  ██████░░░██ ██░░░░░░░██  ",  // 27 chars (was 25)
-  "  ██████░░░██ ██░░░░░░░██  ",  // 27 chars (was 25)
-  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars (unchanged)
-]
-
-const eyeNeutralRight = [
-  "     █████       █████     ",  // 27 chars (was 22)
-  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars (was 24)
-  "  ██░░░██████ ██░░░░░░░██  ",  // 27 chars (was 25)
-  "  ██░░░██████ ██░░░░░░░██  ",  // 27 chars (was 25)
-  "██ ██░░░░░██   ██░░░░░██ ██",  // 27 chars (unchanged)
-]
-
-// Squinted eyes version for busy/expressive state
-const eyeSquinted = [
-  "     █████       █████     ",  // 27 chars (was 22)
-  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars (was 24)
-  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars (was 25)
-  "   █████████   █████████   ",  // 27 chars (was 24)
-  "██  █████         █████  ██",  // 27 chars (unchanged)
-]
-
-// Blink frames - half closed
-const eyeBlinkHalf = [
-  "     █████       █████     ",  // 27 chars (was 22)
-  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars (was 24)
-  "  ██░░███░░██ ██░░░░░░░██  ",  // 27 chars (was 25)
-  "   █████████   █████████   ",  // 27 chars (was 24)
-  "██  █████         █████  ██",  // 27 chars (unchanged)
-]
-
-// Blink frames - fully closed
-const eyeBlinkClosed = [
-  "     █████       █████     ",  // 27 chars (was 22)
-  "   ██░░░░░██   ██░░░░░██   ",  // 27 chars (was 24)
-  "   █████████   █████████   ",  // 27 chars (was 24)
-  "   █████████   █████████   ",  // 27 chars (was 24)
-  "██  █████         █████  ██",  // 27 chars (unchanged)
-]
-
-// Mustache section (all lines padded to 27 chars for alignment)
-const mustachiMustacheSection = [
-  "██████████         ████████",  // 27 chars (unchanged)
-  "████████████     ██████████",  // 27 chars (unchanged)
-  " █████████████████████████ ",  // 27 chars (was 26)
-  "  ▓██████████   ██████████▓",  // 27 chars (unchanged)
-  "    ▓██████       ██████▓  ",  // 27 chars (was 25)
-]
-
-// Tongue animation frames (progressive) - compact design
-const tongueFrames = [
-  [],  // no tongue
-  ["             ███", "              █"],  // tongue out
-]
-
-// Mustache-only ASCII art for home logo (original massive solid block design)
-const mustachiMustacheOnly = [
-  "",
-  "               ████████                 ████████",
-  "             ████████████             ████████████",
-  "    ██      ████████████████       ████████████████      ██",
-  "   ████    ████████████████████ ████████████████████    ████",
-  "  ██████  ███████████████████████████████████████████  ██████",
-  "  ███████████████████████████████████████████████████████████",
-  "  ███████████████████████████████████████████████████████████",
-  "  ███████████████████████████████████████████████████████████",
-  "   █████████████████████████████████████████████████████████",
-  "    ███████████████████████████████████████████████████████",
-  "      ▓▓█████████████████████     █████████████████████▓▓",
-  "        ▓▓▓███████████████           ███████████████▓▓▓",
-  "           ▓▓▓█████████                 █████████▓▓▓",
-  "              ▓▓▓▓▓▓▓                     ▓▓▓▓▓▓▓",
-  "",
-]
-
-// Pupil position mapping for look-around animation
-const pupilPositionFrames = [
-  eyeNeutralCenter,  // center
-  eyeNeutralLeft,    // looking left
-  eyeNeutralRight,   // looking right
-  eyeNeutralCenter,  // back to center
-]
-
-// Busy/loading state with tongue and motivational phrases
-const busyPhrases = [
-  "Ponete las pilas, hermano...",
-  "Dale que va, dale que va...",
-  "Ya casi, ya casi...",
-  "Ahí vamos, loco...",
-  "Un toque más y listo...",
-  "Aguantá que estoy pensando...",
-  "Momento, momento...",
-  "Ya te lo traigo, tranqui...",
-]
-
-type Cfg = {
-  enabled: boolean
-  theme: string
-  set_theme: boolean
-  show_detected: boolean
-  show_os: boolean
-  show_providers: boolean
-  animations: boolean
-}
-
-type Api = Parameters<TuiPlugin>[0]
-
 const rec = (value: unknown) => {
   if (!value || typeof value !== "object" || Array.isArray(value)) return
   return Object.fromEntries(Object.entries(value))
 }
 
-const pick = (value: unknown, fallback: string) => {
-  if (typeof value !== "string") return fallback
-  if (!value.trim()) return fallback
-  return value
-}
-
-const bool = (value: unknown, fallback: boolean) => {
-  if (typeof value !== "boolean") return fallback
-  return value
-}
-
-const cfg = (opts: Record<string, unknown> | undefined): Cfg => {
-  return {
-    enabled: bool(opts?.enabled, true),
-    theme: pick(opts?.theme, "gentleman"),
-    set_theme: bool(opts?.set_theme, true),
-    show_detected: bool(opts?.show_detected, true),
-    show_os: bool(opts?.show_os, true),
-    show_providers: bool(opts?.show_providers, true),
-    animations: bool(opts?.animations, true),
-  }
-}
-
-// Helper to detect OS name
-const getOSName = (): string => {
-  try {
-    const platform = typeof process !== "undefined" ? process.platform : "unknown"
-    switch (platform) {
-      case "linux":
-        try {
-          const osRelease = readFileSync("/etc/os-release", "utf8")
-          const match = osRelease.match(/^NAME="?([^"\n]+)"?/m)
-          if (match) return match[1]
-        } catch {
-        }
-        return "Linux"
-      case "darwin":
-        return "macOS"
-      case "win32":
-        return "Windows"
-      default:
-        return platform
-    }
-  } catch {
-    return "Unknown"
-  }
-}
-
-// Map provider IDs to friendly display names
-const providerDisplayNames: Record<string, string> = {
-  "openai": "OpenAI",
-  "google": "Google",
-  "github-copilot": "Copilot",
-  "opencode-go": "OpenCode GO",
-  "anthropic": "Claude",
-  "deepseek": "DeepSeek",
-  "openrouter": "OpenRouter",
-  "mistral": "Mistral",
-  "groq": "Groq",
-  "cohere": "Cohere",
-  "together": "Together",
-  "perplexity": "Perplexity",
-}
-
-// Helper to detect active providers from OpenCode state
-const getProviders = (providers: ReadonlyArray<{ id: string; name: string }> | undefined): string => {
-  if (!providers || providers.length === 0) {
-    return "No providers configured"
-  }
-  
-  // Map provider IDs to friendly names and deduplicate
-  const names = new Set<string>()
-  for (const provider of providers) {
-    const displayName = providerDisplayNames[provider.id] || provider.name || provider.id
-    names.add(displayName)
-  }
-  
-  // Return compact comma-separated list
-  return Array.from(names).sort().join(", ")
-}
-
-// Home logo: Mustache-only (simple and prominent) with grayscale gradient
-const HomeLogo = (props: { theme: TuiThemeCurrent }) => {
-  // Grayscale palette for better TUI readability
-  const lightGray = "#C0C0C0"   // Light gray for highlights
-  const midGray = "#808080"      // Mid gray for main body
-  const darkGray = "#505050"     // Dark gray for shadows
-  
-  return (
-    <box flexDirection="column" alignItems="center">
-      {/* Mustache with grayscale gradient for depth */}
-      {mustachiMustacheOnly.map((line, idx) => {
-        const totalLines = mustachiMustacheOnly.length
-        let color = midGray
-        if (idx < totalLines / 3) {
-          color = lightGray  // Top highlight
-        } else if (idx >= (2 * totalLines) / 3) {
-          color = darkGray   // Bottom shadow
-        }
-        return <text fg={color}>{line.padEnd(61, " ")}</text>
-      })}
-      
-      {/* OpenCode branding */}
-      <box flexDirection="row" gap={0} marginTop={1}>
-        <text fg={props.theme.textMuted} dimColor={true}>╭ </text>
-        <text fg={props.theme.primary} bold={true}> O p e n C o d e </text>
-        <text fg={props.theme.textMuted} dimColor={true}> ╮</text>
-      </box>
-      
-      <text> </text>
-    </box>
-  )
-}
-
-// Sidebar: Full Mustachi face with progressive animations (semantic zone colors)
-const SidebarMustachi = (props: { theme: TuiThemeCurrent; config: Cfg; isBusy?: boolean }) => {
-  const [pupilIndex, setPupilIndex] = createSignal(0)
-  const [blinkFrame, setBlinkFrame] = createSignal(0)
-  const [tongueFrame, setTongueFrame] = createSignal(0)
-  const [busyPhrase, setBusyPhrase] = createSignal("")
-  const [expressiveCycle, setExpressiveCycle] = createSignal(false)
-  
-  // Animation: pupil movement (look around) - low frequency, progressive
-  createEffect(() => {
-    if (!props.config.animations || props.isBusy || expressiveCycle()) {
-      setPupilIndex(0)
-      return
-    }
-    
-    const interval = setInterval(() => {
-      // Cycle through pupil positions progressively
-      setPupilIndex((prev) => {
-        // 80% chance to stay at center, 20% to move
-        if (Math.random() < 0.8) return 0
-        return (prev + 1) % pupilPositionFrames.length
-      })
-    }, 3000)
-    
-    onCleanup(() => clearInterval(interval))
-  })
-  
-  // Animation: blink - occasional, progressive
-  createEffect(() => {
-    if (!props.config.animations) return
-    
-    const blinkSequence = async () => {
-      // Open -> half -> closed -> half -> open
-      setBlinkFrame(0)
-      await new Promise(r => setTimeout(r, 150))
-      setBlinkFrame(1)
-      await new Promise(r => setTimeout(r, 100))
-      setBlinkFrame(2)
-      await new Promise(r => setTimeout(r, 100))
-      setBlinkFrame(1)
-      await new Promise(r => setTimeout(r, 100))
-      setBlinkFrame(0)
-    }
-    
-    const interval = setInterval(() => {
-      // Blink occasionally (15% chance every 4s)
-      if (Math.random() < 0.15) {
-        blinkSequence()
-      }
-    }, 4000)
-    
-    onCleanup(() => clearInterval(interval))
-  })
-  
-  // Busy/expressive state animation: tongue + phrases
-  // If isBusy is reliably reactive, use it; otherwise demonstrate expressiveness periodically
-  createEffect(() => {
-    if (!props.config.animations) {
-      setTongueFrame(0)
-      setBusyPhrase("")
-      setExpressiveCycle(false)
-      return
-    }
-    
-    const shouldShowExpression = props.isBusy || expressiveCycle()
-    
-    if (!shouldShowExpression) {
-      setTongueFrame(0)
-      setBusyPhrase("")
-      return
-    }
-    
-    // Show tongue progressively when entering expressive state
-    let currentFrame = 0
-    let tongueTimeoutId: NodeJS.Timeout | undefined
-    const growTongue = () => {
-      if (currentFrame < tongueFrames.length - 1) {
-        currentFrame++
-        setTongueFrame(currentFrame)
-      }
-    }
-    tongueTimeoutId = setTimeout(growTongue, 200)
-    
-    // Rotate busy phrases
-    let phraseIdx = Math.floor(Math.random() * busyPhrases.length)
-    setBusyPhrase(busyPhrases[phraseIdx])
-    
-    const interval = setInterval(() => {
-      phraseIdx = (phraseIdx + 1) % busyPhrases.length
-      setBusyPhrase(busyPhrases[phraseIdx])
-    }, 3000)
-    
-    onCleanup(() => {
-      clearInterval(interval)
-      if (tongueTimeoutId !== undefined) {
-        clearTimeout(tongueTimeoutId)
-      }
-    })
-  })
-  
-  // Fallback: Periodic expressive cycle (conservative - every 45-60s for ~8s)
-  // This ensures tongue + phrases are visibly demonstrated even if runtime busy state is unreliable
-  createEffect(() => {
-    if (!props.config.animations || props.isBusy) return
-    
-    const triggerExpressiveCycle = () => {
-      setExpressiveCycle(true)
-      
-      // End expressive cycle after 8 seconds
-      setTimeout(() => {
-        setExpressiveCycle(false)
-      }, 8000)
-    }
-    
-    // First cycle after 30-45s, then every 45-60s
-    const firstDelay = 30000 + Math.random() * 15000
-    const firstTimeout = setTimeout(triggerExpressiveCycle, firstDelay)
-    
-    const interval = setInterval(() => {
-      triggerExpressiveCycle()
-    }, 45000 + Math.random() * 15000)
-    
-    onCleanup(() => {
-      clearTimeout(firstTimeout)
-      clearInterval(interval)
-    })
-  })
-  
-  // Build the complete Mustachi face
-  const buildFace = () => {
-    const lines: { content: string; zone: string }[] = []
-    
-    // Select eye frame based on state
-    let eyeFrame = pupilPositionFrames[pupilIndex()]
-    
-    // Apply squint if busy/expressive
-    if (props.isBusy || expressiveCycle()) {
-      eyeFrame = eyeSquinted
-    }
-    
-    // Apply blink animation if active
-    if (blinkFrame() === 1) {
-      eyeFrame = eyeBlinkHalf
-    } else if (blinkFrame() === 2) {
-      eyeFrame = eyeBlinkClosed
-    }
-    
-    // Add eyes with zone metadata
-    eyeFrame.forEach((line, idx) => {
-      // Lines 0-1 are monocle border, lines 2-4 are eye interior
-      const zone = idx < 2 ? "monocle" : "eyes"
-      lines.push({ content: line, zone })
-    })
-    
-    // Add mustache section
-    mustachiMustacheSection.forEach(line => {
-      lines.push({ content: line, zone: "mustache" })
-    })
-    
-    // Add tongue if expressive (mark as tongue zone for pink color)
-    if ((props.isBusy || expressiveCycle()) && tongueFrame() > 0) {
-      const tongueLines = tongueFrames[tongueFrame()]
-      tongueLines.forEach(line => {
-        lines.push({ content: line, zone: "tongue" })
-      })
-    }
-    
-    return lines
-  }
-  
-  // Semantic zone colors for better visual hierarchy
-  const zoneColors = {
-    monocle: "#A0A0A0",    // Lighter gray for monocle border
-    eyes: "#808080",        // Mid gray for eyes
-    mustache: "#606060",    // Darker gray for mustache
-    tongue: "#FF4466",      // Pink/Red for tongue
-  }
-  
-  return (
-    <box flexDirection="column" alignItems="center">
-      {/* Full Mustachi face with semantic zone colors */}
-      {buildFace().map(({ content, zone }) => {
-        const color = zoneColors[zone as keyof typeof zoneColors] || zoneColors.mustache
-        const paddedLine = content.padEnd(27, " ")
-        return <text fg={color}>{paddedLine}</text>
-      })}
-      
-      {/* Busy phrase if loading */}
-      {busyPhrase() && (
-        <text fg={props.theme.warning}>{busyPhrase()}</text>
-      )}
-      
-      <text> </text>
-    </box>
-  )
-}
-
-const DetectedEnv = (props: { 
-  theme: TuiThemeCurrent
-  providers: ReadonlyArray<{ id: string; name: string }> | undefined
-  config: Cfg
-}) => {
-  if (!props.config.show_detected) return null
-  
-  const os = props.config.show_os ? getOSName() : null
-  const providers = props.config.show_providers ? getProviders(props.providers) : null
-  
-  // Don't render if nothing to show
-  if (!os && !providers) return null
-  
-  return (
-    <box flexDirection="row" gap={1}>
-      <text fg={props.theme.textMuted}>Detected:</text>
-      {os && <text fg={props.theme.text}>{os}</text>}
-      {os && providers && <text fg={props.theme.textMuted}>·</text>}
-      {providers && <text fg={props.theme.text}>{providers}</text>}
-    </box>
-  )
-}
-
 const tui: TuiPlugin = async (api, options) => {
   const boot = cfg(rec(options))
   if (!boot.enabled) return