gpui-kit README

The project's README from github.com/longbridge/gpui-kit. As one markdown file: README.md.

GPUI Kit logo
GPUI Kit

English | 简体中文

Build Status Docs Crates.io

Build fantastic, high-performance desktop apps with Rust and GPUI.

GPUI Kit is a comprehensive Rust desktop application framework. It combines a production-ready UI system with application-grade data, layout, and editing capabilities, all built on a reusable foundation of behavior, state, and infrastructure, and opens the finished application to JavaScript extensions.

Documentation: https://gpui-kit.com

gpui-kit             The one crate applications depend on
├── gpui-base        Unstyled behavior, state, and infrastructure
└── gpui-component   GPUI Component: the complete styled UI system

gpui-kit pins the matching GPUI release and re-exports GPUI, base, component, and assets, so a Rust application lists a single dependency. JavaScript extension hosts add gpui-shell separately; gpui-component-shell supplies the styled catalog.

See the executable application recipe and AI-assisted development acceptance checks for a tested starting point and verification commands.

Features

Framework Architecture

Three layers. One ecosystem.

Use gpui-component to keep the application coherent with one complete visual and interaction system. Use gpui-base when your product needs to create and own that system itself. Use gpui-shell when the application should be extensible in JavaScript after it ships.

gpui-component gpui-base gpui-shell
Complete, styled components Unstyled behavior and infrastructure JavaScript runtime hosted by Rust
Productive defaults with theming Full control over structure and visual design Capabilities granted one at a time
Best for building applications Best for building design systems Best for plugins and scripted applications
                             APPLICATION
                                  │
              ┌───────────────────┼───────────────────┐
              │                   │                   │
              ▼                   ▼                   ▼
    ┌──────────────────┐ ┌──────────────────┐ ┌──────────────────┐
    │  gpui-component  │ │ Your Design      │ │    gpui-shell    │
    │    Styled UI     │ │ System           │ │  JS extensions   │
    └────────┬─────────┘ └────────┬─────────┘ └────────┬─────────┘
             │                    │                    │
             └────────────────────┼────────────────────┘
                                  ▼
                        ┌──────────────────┐
                        │    gpui-base     │
                        │ Behavior · State │
                        │ Infrastructure   │
                        └────────┬─────────┘
                                 ▼
                               GPUI

Behavior belongs to the foundation. Presentation belongs to the application.

Use gpui-component when you want polished controls ready to ship. Build on gpui-base when your application should own its component source, layout, styling, and motion while reusing difficult interaction behavior. Add gpui-shell when contributors should extend the product without a fork or a release.

The layering follows the same separation that makes the shadcn ecosystem flexible:

GPUI Kit ecosystem Web ecosystem
GPUI HTML + Tailwind CSS
gpui-base Base UI
gpui-component shadcn's styled component layer

Explore the architecture →

Showcase

GPUI Kit has powered Longbridge Pro from day one. The framework is extracted from the demands of a publicly shipped commercial desktop application rather than designed in isolation.

GPUI provides the rendering foundation. Longbridge provides the production foundation.

Image

Usage

[dependencies]
gpui-kit = "0.6"

gpui-kit always brings in GPUI and gpui-base; gpui-component and the default icon set are on by default. Turn default features off to keep only the layers you use. The gpui-component features (inspector, decimal, tree-sitter, and each tree-sitter-<language>) are available under the same names.

Basic Example

use gpui_kit::component::button::*;
use gpui_kit::component::*;
use gpui_kit::*;

pub struct HelloWorld;
impl Render for HelloWorld {
    fn render(&mut self, _: &mut Window, _: &mut Context<Self>) -> impl IntoElement {
        div()
            .v_flex()
            .gap_2()
            .size_full()
            .items_center()
            .justify_center()
            .child("Hello, World!")
            .child(
                Button::new("ok")
                    .primary()
                    .label("Let's Go!")
                    .on_click(|_, _, _| println!("Clicked!")),
            )
    }
}

fn main() {
    gpui_kit::application().run(move |cx| {
        // This must be called before using any GPUI Component features.
        gpui_kit::init(cx);

        cx.spawn(async move |cx| {
            cx.open_window(WindowOptions::default(), |window, cx| {
                let view = cx.new(|_| HelloWorld);
                // This first level on the window, should be a Root.
                cx.new(|cx| Root::new(view, window, cx))
            })
            .expect("Failed to open window");
        })
        .detach();
    });
}

Icons

The default assets feature bundles the Lucide icon set as gpui-kit-assets; pass it to the application with gpui_kit::application().with_assets(gpui_kit::assets::Assets). To ship your own icons instead, leave that feature out and name the SVG files as defined in IconName.

Skills for AI Coding Agents

Install the GPUI Kit skills for your AI coding agent (Cursor, Claude Code, Gemini CLI, Codex, etc.):

npx skills add longbridge/gpui-kit
Skill Description
gpui-kit Setup, component catalog, usage patterns, GPUI mechanics (elements, entities, async, focus, actions, tests), and the Coding Guides.
gpui-kit-design-guides The Design Guides: layout, spacing, hierarchy, interaction states, overlays, and interface copy.

Development

Desktop Gallery (Story)

The story crate is a gallery application that showcases all available components. Run it with:

cargo run

Examples

Some larger examples reuse the story gallery components and run as standalone packages:

# Dock layout system (panels, split views, tabs)
cargo run -p example-dock

# Markdown rendering
cargo run -p example-markdown

# HTML rendering
cargo run -p example-html

The examples directory also contains standalone examples, each focused on a single feature. Each example is a separate crate, run them with cargo run -p <name>:

# Code editor with LSP support and syntax highlighting
cargo run -p example-editor

# Basic hello world
cargo run -p hello_world

# System monitor (real-time charts with CPU/memory data)
cargo run -p system_monitor

# Window title customization
cargo run -p window_title

Check out CONTRIBUTING.md for more details.

Compare to others

See the comparison with Iced, egui and Qt 6 on the site.

License

Apache-2.0

gpui-kit (longbridge/gpui-kit)

Searching Database…

Что это такое?GPUI Kit — это фреймворк на Rust для создания кроссплатформенных десктопных приложений на основе GPUI (UI-движка от Zed Industries). Он объединяет библиотеку стилизованных компонентов, слой поведения без оформления и слой расширений, который открывает приложение для JavaScript.
Это одна библиотека или несколько слоёв, из которых нужно выбирать?Это многослойная структура: gpui-base предоставляет поведение взаимодействия без оформления, gpui-component — готовые стилизованные элементы управления на его основе, а gpui-shell позволяет участникам расширять продукт без форка. Вы сами выбираете, от каких слоёв зависит ваше приложение.
Как добавить её в проект на Rust?Добавьте gpui-kit как зависимость Cargo. По умолчанию подтягиваются GPUI, gpui-base, gpui-component и встроенный набор иконок Lucide. Чтобы оставить только нужные слои, можно отключить функции по умолчанию.
Нужно ли уже знать Rust и GPUI?Да, это фреймворк, построенный непосредственно на GPUI, поэтому нужны рабочие знания Rust и Cargo, а также понимание элементов GPUI, сущностей (entities), асинхронной модели, фокуса и действий (actions).
Можно ли заменить встроенный набор иконок своим?Да, уберите функцию assets по умолчанию и укажите свои SVG-файлы с именами, соответствующими идентификаторам из IconName, вместо встроенного набора Lucide.
Какие ИИ-агенты для написания кода имеют официальные навыки для этого?GPUI Kit поставляет устанавливаемые навыки для Cursor, Claude Code, Gemini CLI и Codex. Они охватывают настройку, каталог компонентов, механику GPUI и руководства по дизайну.
Проверен ли этот фреймворк в реальном продукте?Да, GPUI Kit с первого дня работает в Longbridge Pro — действующем коммерческом десктопном торговом приложении. Поэтому он создавался на основе реальных производственных потребностей, а не в отрыве от практики.
Чем он отличается от других GUI-фреймворков для Rust?В документации проекта есть прямое сравнение с Iced, egui и Qt 6.
Откуда берётся внешний вид компонентов?Стилизация компонентов основана на shadcn/ui (частично на Reui), а набор иконок по умолчанию — это иконки Lucide.
Creator
longbridge
Size
37.2 MB
Stars
18K
Age
2y
Commits · 90 Days