> ## Documentation Index
> Fetch the complete documentation index at: https://docs.gitascii.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Terminal Info Widget

> Neofetch-style terminal info card with dot-leader alignments and developer metadata

# Terminal Info Widget (`terminal-info`)

The Terminal Info widget renders a comprehensive, Unix `neofetch`-style console card with ASCII border dividers, section titles, dot leaders (`...`), and developer metadata (uptime, location, company, languages, stats, and social channels).

## Configuration Schema

```typescript theme={null}
export interface TerminalInfoConfig {
  // Section Visibility
  showMainSection?: boolean      // Default: true
  showContactSection?: boolean   // Default: true
  showStatsSection?: boolean     // Default: true
  dotLeaders?: boolean           // Default: true (renders dotted alignment guides)

  // Main Section Fields
  showUptime?: boolean           // Default: true
  showLocation?: boolean         // Default: true
  showCompany?: boolean          // Default: true
  showLanguages?: boolean        // Default: true
  showJoined?: boolean           // Default: false
  showStatus?: boolean           // Default: false
  showPronouns?: boolean         // Default: false
  showTimezone?: boolean         // Default: false
  showAchievements?: boolean     // Default: false
  showHighlights?: boolean       // Default: false

  // Contact Fields
  showWebsite?: boolean          // Default: true
  showGithub?: boolean           // Default: true
  showTwitter?: boolean          // Default: false
  showEmail?: boolean            // Default: false
  showOrgs?: boolean             // Default: false

  // Stats Fields
  showRepos?: boolean            // Default: true
  showStars?: boolean            // Default: true
  showCommits?: boolean          // Default: true
  showFollowers?: boolean        // Default: true
  showFollowing?: boolean        // Default: false
  showGists?: boolean            // Default: false

  // Color Tokens
  headerColor?: string           // Default: '#58a6ff'
  labelColor?: string            // Default: '#ffa657'
  dotColor?: string              // Default: '#484f58'
  valueColor?: string            // Default: '#c9d1d9'
  statsValColor?: string         // Default: '#79c0ff'
  dividerColor?: string          // Default: '#3d444d'
}
```

***

## Real Code Example

```typescript theme={null}
import { renderWidgetSvg, WidgetInstance } from '@/engine'

const terminalInfoWidget: WidgetInstance = {
  instanceId: 'term_info_01',
  widgetId: 'terminal-info',
  name: 'Terminal Info',
  position: { x: 0, y: 106 },
  size: { width: 800, height: 280 },
  config: {
    showMainSection: true,
    showContactSection: true,
    showStatsSection: true,
    dotLeaders: true,
    headerColor: '#58a6ff',
    labelColor: '#ffa657',
    valueColor: '#c9d1d9',
  },
  locked: false,
  visible: true,
  zIndex: 3,
}

const svgOutput = renderWidgetSvg(terminalInfoWidget, profileData, globalStyles)
```