# Pi Custom UI & TUI Component System > Split into individual files for easier consumption. ## Table of Contents - [01. The UI Architecture](./01-the-ui-architecture.md) - [02. The Component Interface — Foundation of Everything](./02-the-component-interface-foundation-of-everything.md) - [03. Entry Points — How UI Gets on Screen](./03-entry-points-how-ui-gets-on-screen.md) - [04. Built-in Dialog Methods](./04-built-in-dialog-methods.md) - [05. Persistent UI Elements](./05-persistent-ui-elements.md) - [06. ctx.ui.custom() — Full Custom Components](./06-ctx-ui-custom-full-custom-components.md) - [07. Built-in Components — The Building Blocks](./07-built-in-components-the-building-blocks.md) - [08. High-Level Components from pi-coding-agent](./08-high-level-components-from-pi-coding-agent.md) - [09. Keyboard Input — How to Handle Keys](./09-keyboard-input-how-to-handle-keys.md) - [10. Line Width — The Cardinal Rule](./10-line-width-the-cardinal-rule.md) - [11. Theming — Colors and Styles](./11-theming-colors-and-styles.md) - [12. Overlays — Floating Modals and Panels](./12-overlays-floating-modals-and-panels.md) - [13. Custom Editors — Replacing the Input](./13-custom-editors-replacing-the-input.md) - [14. Tool Rendering — Custom Tool Display](./14-tool-rendering-custom-tool-display.md) - [15. Message Rendering — Custom Message Display](./15-message-rendering-custom-message-display.md) - [16. Performance — Caching and Invalidation](./16-performance-caching-and-invalidation.md) - [17. Theme Changes and Invalidation](./17-theme-changes-and-invalidation.md) - [18. IME Support — The Focusable Interface](./18-ime-support-the-focusable-interface.md) - [19. Building a Complete Component — Step by Step](./19-building-a-complete-component-step-by-step.md) - [20. Real-World Patterns from Examples](./20-real-world-patterns-from-examples.md) - [21. Common Mistakes and How to Avoid Them](./21-common-mistakes-and-how-to-avoid-them.md) - [22. Quick Reference — All UI APIs](./22-quick-reference-all-ui-apis.md) - [23. File Reference — Example Extensions with UI](./23-file-reference-example-extensions-with-ui.md) --- *Split into per-section files for surgical context loading.*