gui-anything

GUI-Anything for Codex

Use this skill when the user wants Codex to act like the GUI-Anything builder.

If this skill is being used from inside the GUI-Anything repository, read ../gui-anything-plugin/HARNESS.md before implementation. That file is the full methodology source of truth. If it is not available, follow the condensed rules below.

Inputs

Accept either:

• A local source path such as ./calculator or /path/to/software
• A GitHub repository URL

Derive the software name from the local directory name after cloning if needed.

Modes

Build

Use when the user wants a new harness.

Produce this structure:

<software>/
└── agent-harness/
    ├── <SOFTWARE>.md
    ├── index.html
    ├── package.json
    ├── vite.config.ts
    ├── tsconfig.json
    └── gui_anything/
        └── <software>/
            ├── README.md
            ├── gui-schema.json
            ├── theme.json
            ├── src/
            │   ├── App.tsx
            │   ├── main.tsx
            │   ├── components/
            │   │   ├── A2UIRenderer.tsx
            │   │   ├── ActionPanel.tsx
            │   │   ├── PreviewPane.tsx
            │   │   └── StatusBar.tsx
            │   └── styles/global.css
            ├── agent-harness/
            │   ├── mcp-tools.json
            │   └── screenshot.py
            ├── utils/
            │   ├── <software>_backend.py
            │   └── a2ui_skin.py
            └── tests/
                └── TEST.md

Implement a React + Tauri v2 GUI with:

• A2UI schema driving all components
• MCP tools for every action (using __ separator)
• Dark theme with CSS custom properties
• Cross-platform support (Web, Desktop, Mobile)

Refine

Use when the harness already exists.

First inventory current actions and tests, then do gap analysis against the target software. Prefer:

• high-impact missing actions
• easy wrappers around existing backend APIs
• additions that compose well with existing action groups

Do not remove existing actions unless the user explicitly asks for a breaking change.