Hello World CLI

// cli.ts
#!/usr/bin/env bun
import { createCLI } from '@bunli/core'
import greetCommand from './commands/greet.js'

const cli = await createCLI()

cli.command(greetCommand)
await cli.run()

// commands/greet.tsx
import { defineCommand, option } from '@bunli/core'
import { useRuntime } from '@bunli/runtime/app'
import { ProgressBar, useKeyboard } from '@bunli/tui'
import { useEffect, useState } from 'react'
import { z } from 'zod'

function GreetProgress({
  name,
  loud,
  times
}: {
  name: string
  loud: boolean
  times: number
}) {
  const [progress, setProgress] = useState(0)
  const runtime = useRuntime()

  const closeTui = () => {
    runtime.exit()
  }

  useKeyboard((key) => {
    if (key.name === 'q' || key.name === 'escape') {
      closeTui()
    }
  })

  useEffect(() => {
    const interval = setInterval(() => {
      setProgress((current) => {
        if (current >= 100) return 100
        return current + 5
      })
    }, 80)

    return () => clearInterval(interval)
  }, [])

  useEffect(() => {
    if (progress < 100) return
    const timeout = setTimeout(() => closeTui(), 400)
    return () => clearTimeout(timeout)
  }, [progress, runtime])

  const greeting = `Hello, ${name}!`
  const message = loud ? greeting.toUpperCase() : greeting

  return (
    <ProgressBar
      value={progress}
      label={`${message} x${times}  (press q to quit, auto-exits at 100%)`}
      color={loud ? '#f97316' : '#22c55e'}
    />
  )
}

const greetCommand = defineCommand({
  name: 'greet' as const,
  description: 'A minimal greeting CLI',
  options: {
    name: option(
      z.string().default('world'),
      { short: 'n', description: 'Who to greet' }
    ),
    loud: option(
      z.coerce.boolean().default(false),
      { short: 'l', description: 'Shout the greeting' }
    ),
    times: option(
      z.coerce.number().int().positive().default(1),
      { short: 't', description: 'Number of times to greet' }
    )
  },
  render: ({ flags }) => (
    <GreetProgress
      name={String(flags.name)}
      loud={Boolean(flags.loud)}
      times={Number(flags.times)}
    />
  ),
  handler: async ({ flags, colors }) => {
    const greeting = `Hello, ${flags.name}!`
    const message = flags.loud ? greeting.toUpperCase() : greeting

    for (let i = 0; i < flags.times; i++) {
      console.log(colors.cyan(message))
    }
  }
})

export default greetCommand

# Navigate to the example
cd examples/hello-world

# Install dependencies
bun install

# Run in development mode (uses bunli dev)
bun run dev

# Run greet command
bun run dev -- greet --name Alice

# Or run directly
bun cli.ts greet --name Alice

hello-world/
├── cli.ts              # Main CLI entry point
├── commands/
│   └── greet.tsx       # Greet command with TUI render
├── bunli.config.ts     # Build configuration
├── package.json        # Dependencies and scripts
├── tsconfig.json       # TypeScript configuration
└── README.md          # Example documentation

render: ({ flags }) => (
  <GreetProgress
    name={String(flags.name)}
    loud={Boolean(flags.loud)}
    times={Number(flags.times)}
  />
)

const greetCommand = defineCommand({
  name: 'greet' as const,
  description: 'A minimal greeting CLI',
  render: ({ flags }) => <TuiView flags={flags} />,
  handler: async ({ flags, colors }) => {
    // Non-interactive fallback
    console.log(colors.green(`Hello, ${flags.name}!`))
  }
})

options: {
  name: option(
    z.string().default('world'),
    { short: 'n', description: 'Who to greet' }
  ),
  loud: option(
    z.coerce.boolean().default(false),
    { short: 'l', description: 'Shout the greeting' }
  ),
  times: option(
    z.coerce.number().int().positive().default(1),
    { short: 't', description: 'Number of times to greet' }
  )
}

import { ProgressBar, useKeyboard } from '@bunli/tui'
import { useRuntime } from '@bunli/runtime/app'

// Progress bar with keyboard handling
function GreetProgress({ name, loud, times }) {
  const runtime = useRuntime()
  useKeyboard((key) => {
    if (key.name === 'q') runtime.exit()
  })

  return (
    <ProgressBar
      value={progress}
      label={`Hello, ${name}! x${times}`}
      color={loud ? '#f97316' : '#22c55e'}
    />
  )
}

{
  "name": "@bunli-examples/hello-world",
  "version": "1.0.0",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "bunli dev",
    "build": "bunli build",
    "cli": "bun cli.ts"
  },
  "dependencies": {
    "@bunli/core": "workspace:^",
    "@bunli/runtime": "workspace:^",
    "@bunli/tui": "workspace:^",
    "react": "catalog:",
    "zod": "catalog:"
  }
}