Clui Cc Claude Overlay

// Send a prompt to the active tab's claude processwindow.clui.sendPrompt(tabId: string, text: string): Promise<void>
// Approve or deny a pending tool-use permissionwindow.clui.resolvePermission(requestId: string, approved: boolean): Promise<void>
// Create a new tab (spawns a new claude -p process)window.clui.createTab(): Promise<{ tabId: string }>
// Resume a past session by idwindow.clui.resumeSession(tabId: string, sessionId: string): Promise<void>
// Subscribe to normalized events from a tabwindow.clui.onTabEvent(tabId: string, callback: (event: NormalizedEvent) => void): () => void
// Get conversation history listwindow.clui.getHistory(): Promise<SessionMeta[]>

import { useEffect, useState } from 'react'
export function useClaudeTab() {  const [tabId, setTabId] = useState<string | null>(null)  const [messages, setMessages] = useState<NormalizedEvent[]>([])
  useEffect(() => {    window.clui.createTab().then(({ tabId }) => {      setTabId(tabId)
      const unsubscribe = window.clui.onTabEvent(tabId, (event) => {        setMessages((prev) => [...prev, event])      })
      return unsubscribe    })  }, [])
  const send = (text: string) => {    if (!tabId) return    window.clui.sendPrompt(tabId, text)  }
  return { messages, send }}

async function resumeLastSession() {  const history = await window.clui.getHistory()  if (history.length === 0) return
  const { tabId } = await window.clui.createTab()  const lastSession = history[0] // most recent first  await window.clui.resumeSession(tabId, lastSession.sessionId)}

// Renderer: listen for permission requestswindow.clui.onTabEvent(tabId, async (event) => {  if (event.type !== 'permission_request') return
  const { requestId, toolName, toolInput } = event
  // Show your approval UI, then:  const approved = await showApprovalDialog({ toolName, toolInput })  await window.clui.resolvePermission(requestId, approved)})

// Main process: PermissionServer registers a hook with claude -p// The hook endpoint receives POST requests from Claude Code like:// { "tool": "bash", "input": { "command": "rm -rf dist/" }, "session_id": "..." }// It holds the request until the renderer resolves it.

// Triggered from InputBar component via IPCwindow.clui.startVoiceInput(): Promise<void>window.clui.stopVoiceInput(): Promise<{ transcript: string }>

// Fetch available skills (cached 5 min, fetched from raw.githubusercontent.com)const skills = await window.clui.marketplace.list()// [{ id, name, description, repoUrl, version }, ...]
// Install a skill (downloads tarball from api.github.com)await window.clui.marketplace.install(skillId: string)
// List installed skillsconst installed = await window.clui.marketplace.listInstalled()

// src/renderer/theme.ts — dual palette with CSS custom properties// Toggle via the UI or programmatically:window.clui.setTheme('dark' | 'light' | 'system')

// ~/.clui/skills/my-skill/skill.jsmodule.exports = {  name: 'my-skill',  version: '1.0.0',  description: 'Does something useful',
  // Called when the skill is activated by a matching prompt  async onPrompt(context) {    const { prompt, tabId, clui } = context    if (!prompt.includes('my trigger')) return false   // pass through
    await clui.sendMessage(tabId, `Handled by my-skill: ${prompt}`)    return true  // consumed — don't forward to claude  },}