# yappologistic/cui architecture

> Architecture diagram of the GitHub repository yappologistic/cui, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-12). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/yappologistic/cui
- Repository: https://github.com/yappologistic/cui

## Overview

CUI is an immediate-mode C99 UI library: an application describes its interface each frame, CUI handles layout and input, then produces draw data for a renderer and window or browser surface. Its broad component catalog includes data, charts, planning, code, developer tools, and conversation features. The graph separates the public component API, specialized component domains, shared internals, native runtime, and browser showcase. Relationships for unsampled subsystems are included only where the README documents capabilities; their internal calls are not inferred.

Main entry points: [`include/cui/cui.h`](https://github.com/yappologistic/cui/blob/master/include/cui/cui.h) (Components API), [`web/host/web_host.c`](https://github.com/yappologistic/cui/blob/master/web/host/web_host.c) (WebAssembly host), [`web/site/js/app.js`](https://github.com/yappologistic/cui/blob/master/web/site/js/app.js) (Web gallery app), [`include/cui/cui_render.h`](https://github.com/yappologistic/cui/blob/master/include/cui/cui_render.h) (Renderer API)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_api["UI API"]
  node_components["Components API<br/>[cui.h]"]
  node_appapi["App API<br/>[cui_app.h]"]
  node_renderapi["Renderer API<br/>[cui_render.h]"]
end

subgraph group_domains["Component domains"]
  node_actions["Actions and controls<br/>[cui_actions.c]"]
  node_text["Text and editing<br/>[cui_textedit.c]"]
  node_data["Data views<br/>[cui_treetable.c]"]
  node_charts["Charts and viz<br/>[cui_viz.c]"]
  node_planning["Planning tools<br/>[cui_planning.c]"]
  node_devtools["Developer tools<br/>[cui_devtools.c]"]
  node_conversation["Conversation and AI<br/>[cui_ai.c]"]
  node_flame["Flame graph<br/>[cui_flame.c]"]
end

subgraph group_engine["UI engine"]
  node_internals["Shared UI internals<br/>[cui_internal.h]"]
  node_fonts["Embedded fonts<br/>[cui_font_data.c]"]
  node_core["Context and frames<br/>[cui_core.c]"]
  node_sw["Software renderer<br/>[cui_render_sw.c]"]
  node_gl["OpenGL renderer<br/>[cui_render_gl.c]"]
end

subgraph group_native["Native runtime"]
  node_nativeapp["App frame loop<br/>[cui_app.c]"]
  node_platform["Window backends<br/>[cui_platform.h]"]
end

subgraph group_browser["Browser runtime"]
  node_webhost["WebAssembly host<br/>[web_host.c]"]
  node_webheader["Web host interface<br/>[web_host.h]"]
  node_site["Web gallery app<br/>[app.js]"]
  node_preview["Live previews<br/>[preview.js]"]
  node_runtime["Wasm loader<br/>[runtime.js]"]
  node_webgl["WebGL renderer<br/>[gl.js]"]
  node_dither["Dither artwork<br/>[dither.js]"]
end

node_developer(("C app developer"))

node_developer -->|"creates app"| node_appapi
node_developer -->|"describes UI"| node_components
node_appapi -->|"runs frames"| node_nativeapp
node_nativeapp -->|"uses backend"| node_platform
node_nativeapp -.->|"frames UI"| node_core
node_components -->|"offers controls"| node_actions
node_components -->|"offers editing"| node_text
node_components -->|"offers data views"| node_data
node_components -->|"offers charts"| node_charts
node_components -->|"offers planning"| node_planning
node_components -->|"offers dev tools"| node_devtools
node_components -->|"offers chat"| node_conversation
node_devtools -->|"includes flame graph"| node_flame
node_components -.->|"uses shared engine"| node_internals
node_fonts -->|"provides font data"| node_internals
node_core -.->|"uses internals"| node_internals
node_core -->|"produces draw data"| node_renderapi
node_renderapi -->|"supports software rendering"| node_sw
node_renderapi -->|"supports OpenGL rendering"| node_gl
node_webhost -->|"uses interface"| node_webheader
node_webhost -->|"renders pixels"| node_sw
node_site -->|"mounts previews"| node_preview
node_site -->|"loads modules"| node_runtime
node_site -->|"uses artwork"| node_dither
node_preview -->|"loads modules"| node_runtime
node_preview -->|"renders with"| node_webgl
node_webhost -->|"exports pixels to"| node_runtime

click node_components "https://github.com/yappologistic/cui/blob/master/include/cui/cui.h"
click node_appapi "https://github.com/yappologistic/cui/blob/master/include/cui/cui_app.h"
click node_renderapi "https://github.com/yappologistic/cui/blob/master/include/cui/cui_render.h"
click node_actions "https://github.com/yappologistic/cui/blob/master/src/cui_actions.c"
click node_text "https://github.com/yappologistic/cui/blob/master/src/cui_textedit.c"
click node_data "https://github.com/yappologistic/cui/blob/master/src/cui_treetable.c"
click node_charts "https://github.com/yappologistic/cui/blob/master/src/cui_viz.c"
click node_planning "https://github.com/yappologistic/cui/blob/master/src/cui_planning.c"
click node_devtools "https://github.com/yappologistic/cui/blob/master/src/cui_devtools.c"
click node_conversation "https://github.com/yappologistic/cui/blob/master/src/cui_ai.c"
click node_internals "https://github.com/yappologistic/cui/blob/master/src/cui_internal.h"
click node_fonts "https://github.com/yappologistic/cui/blob/master/src/cui_font_data.c"
click node_flame "https://github.com/yappologistic/cui/blob/master/src/cui_flame.c"
click node_core "https://github.com/yappologistic/cui/blob/master/src/cui_core.c"
click node_nativeapp "https://github.com/yappologistic/cui/blob/master/src/platform/cui_app.c"
click node_platform "https://github.com/yappologistic/cui/blob/master/src/platform/cui_platform.h"
click node_sw "https://github.com/yappologistic/cui/blob/master/src/render/cui_render_sw.c"
click node_gl "https://github.com/yappologistic/cui/blob/master/src/render/cui_render_gl.c"
click node_webhost "https://github.com/yappologistic/cui/blob/master/web/host/web_host.c"
click node_webheader "https://github.com/yappologistic/cui/blob/master/web/host/web_host.h"
click node_site "https://github.com/yappologistic/cui/blob/master/web/site/js/app.js"
click node_preview "https://github.com/yappologistic/cui/blob/master/web/site/js/preview.js"
click node_runtime "https://github.com/yappologistic/cui/blob/master/web/site/js/runtime.js"
click node_webgl "https://github.com/yappologistic/cui/blob/master/web/site/js/gl.js"
click node_dither "https://github.com/yappologistic/cui/blob/master/web/site/js/dither.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_components,node_appapi,node_renderapi toneBlue
class node_actions,node_text,node_data,node_charts,node_planning,node_devtools,node_conversation,node_flame toneAmber
class node_internals,node_fonts,node_core,node_sw,node_gl toneMint
class node_nativeapp,node_platform toneRose
class node_webhost,node_webheader,node_site,node_preview,node_runtime,node_webgl,node_dither,node_developer toneIndigo
```

## Components

### UI API

- [Components API](https://github.com/yappologistic/cui/blob/master/include/cui/cui.h): `include/cui/cui.h`
- [App API](https://github.com/yappologistic/cui/blob/master/include/cui/cui_app.h): `include/cui/cui_app.h`
- [Renderer API](https://github.com/yappologistic/cui/blob/master/include/cui/cui_render.h): `include/cui/cui_render.h`

### Component domains

- [Actions and controls](https://github.com/yappologistic/cui/blob/master/src/cui_actions.c): `src/cui_actions.c`
- [Text and editing](https://github.com/yappologistic/cui/blob/master/src/cui_textedit.c): `src/cui_textedit.c`
- [Data views](https://github.com/yappologistic/cui/blob/master/src/cui_treetable.c): `src/cui_treetable.c`
- [Charts and viz](https://github.com/yappologistic/cui/blob/master/src/cui_viz.c): `src/cui_viz.c`
- [Planning tools](https://github.com/yappologistic/cui/blob/master/src/cui_planning.c): `src/cui_planning.c`
- [Developer tools](https://github.com/yappologistic/cui/blob/master/src/cui_devtools.c): `src/cui_devtools.c`
- [Conversation and AI](https://github.com/yappologistic/cui/blob/master/src/cui_ai.c): `src/cui_ai.c`
- [Flame graph](https://github.com/yappologistic/cui/blob/master/src/cui_flame.c): `src/cui_flame.c`

### UI engine

- [Shared UI internals](https://github.com/yappologistic/cui/blob/master/src/cui_internal.h): `src/cui_internal.h`
- [Embedded fonts](https://github.com/yappologistic/cui/blob/master/src/cui_font_data.c): `src/cui_font_data.c`
- [Context and frames](https://github.com/yappologistic/cui/blob/master/src/cui_core.c): `src/cui_core.c`
- [Software renderer](https://github.com/yappologistic/cui/blob/master/src/render/cui_render_sw.c): `src/render/cui_render_sw.c`
- [OpenGL renderer](https://github.com/yappologistic/cui/blob/master/src/render/cui_render_gl.c): `src/render/cui_render_gl.c`

### Native runtime

- [App frame loop](https://github.com/yappologistic/cui/blob/master/src/platform/cui_app.c): `src/platform/cui_app.c`
- [Window backends](https://github.com/yappologistic/cui/blob/master/src/platform/cui_platform.h): `src/platform/cui_platform.h`

### Browser runtime

- [WebAssembly host](https://github.com/yappologistic/cui/blob/master/web/host/web_host.c): `web/host/web_host.c`
- [Web host interface](https://github.com/yappologistic/cui/blob/master/web/host/web_host.h): `web/host/web_host.h`
- [Web gallery app](https://github.com/yappologistic/cui/blob/master/web/site/js/app.js): `web/site/js/app.js`
- [Live previews](https://github.com/yappologistic/cui/blob/master/web/site/js/preview.js): `web/site/js/preview.js`
- [Wasm loader](https://github.com/yappologistic/cui/blob/master/web/site/js/runtime.js): `web/site/js/runtime.js`
- [WebGL renderer](https://github.com/yappologistic/cui/blob/master/web/site/js/gl.js): `web/site/js/gl.js`
- [Dither artwork](https://github.com/yappologistic/cui/blob/master/web/site/js/dither.js): `web/site/js/dither.js`

### Other components

- **C app developer**

## Connections

- C app developer → App API: creates app
- C app developer → Components API: describes UI
- App API → App frame loop: runs frames
- App frame loop → Window backends: uses backend (evidence: `src/platform/cui_app.c`)
- App frame loop → Context and frames: frames UI
- Components API → Actions and controls: offers controls
- Components API → Text and editing: offers editing
- Components API → Data views: offers data views
- Components API → Charts and viz: offers charts
- Components API → Planning tools: offers planning
- Components API → Developer tools: offers dev tools
- Components API → Conversation and AI: offers chat
- Developer tools → Flame graph: includes flame graph
- Components API → Shared UI internals: uses shared engine (evidence: `src/cui_internal.h`)
- Embedded fonts → Shared UI internals: provides font data (evidence: `src/cui_font_data.c`)
- Context and frames → Shared UI internals: uses internals
- Context and frames → Renderer API: produces draw data
- Renderer API → Software renderer: supports software rendering (evidence: `include/cui/cui_render.h`)
- Renderer API → OpenGL renderer: supports OpenGL rendering (evidence: `include/cui/cui_render.h`)
- WebAssembly host → Web host interface: uses interface (evidence: `web/host/web_host.c`)
- WebAssembly host → Software renderer: renders pixels (evidence: `web/host/web_host.c`)
- Web gallery app → Live previews: mounts previews (evidence: `web/site/js/app.js`)
- Web gallery app → Wasm loader: loads modules (evidence: `web/site/js/app.js`)
- Web gallery app → Dither artwork: uses artwork (evidence: `web/site/js/app.js`)
- Live previews → Wasm loader: loads modules (evidence: `web/site/js/preview.js`)
- Live previews → WebGL renderer: renders with (evidence: `web/site/js/preview.js`)
- WebAssembly host → Wasm loader: exports pixels to (evidence: `web/host/web_host.c`)