ZacharyZhang-NY
49ed1f8405
CI / crate (push) Failing after 2s
CI / site (push) Successful in 30s
CI / platforms (ubuntu-24.04) (push) Failing after 1m48s
CI / platforms (macos-15-intel) (push) Canceled after 0s
CI / platforms (ubuntu-24.04-arm) (push) Canceled after 0s
CI / platforms (windows-11-arm) (push) Canceled after 0s
CI / platforms (windows-latest) (push) Failing after 15s
Links, the header's Gitea mark, the catalog's archive download and the showcase pin workflow (Gitea's API and commit status) move off GitHub; pinned at 6973834, which restores TokenLedger.
70 lines
3.0 KiB
Markdown
70 lines
3.0 KiB
Markdown
# Ely GPUI Component
|
|
|
|
A component library for [GPUI](https://www.gpui.rs), the Rust UI framework behind Zed.
|
|
Every component ships in light and dark. The palette is warm and quiet. Color carries meaning, not decoration.
|
|
|
|
Every component runs live at https://elygpui.com, compiled to WebAssembly.
|
|
|
|
Status: early. `TASKS.md` tracks every component, chapter by chapter. To help, see `CONTRIBUTING.md`.
|
|
|
|
## Use
|
|
|
|
```toml
|
|
[dependencies]
|
|
ely-gpui-component = { git = "https://git.zacharyzhang.com/ZacharyZhang-NY/Ely-GPUI-Components" }
|
|
gpui = { package = "gpui-pre", version = "=0.3.8" }
|
|
gpui_platform = { package = "gpui-pre-platform", version = "=0.3.8", features = ["font-kit"] }
|
|
```
|
|
|
|
```rust
|
|
use ely_gpui_component::{Assets, theme::{Mode, Theme}};
|
|
use gpui::App;
|
|
|
|
fn main() {
|
|
gpui_platform::application().with_assets(Assets).run(|cx: &mut App| {
|
|
ely_gpui_component::init(cx).expect("Ely failed to start");
|
|
Theme::set_mode(Mode::Dark, cx);
|
|
});
|
|
}
|
|
```
|
|
|
|
`init` registers the fonts and the theme. It returns an error if the application's asset source cannot load one of Ely's files.
|
|
|
|
## With GPUI Kit
|
|
|
|
Ely runs beside Longbridge's [GPUI Kit](https://gpui-kit.com) in one window, on the GPUI snapshot Kit 0.7.1 pins. Pass `Assets::before(gpui_kit::assets::Assets)` as the one asset source, call both `init`s, open the window with `gpui_kit::open_window`, and wrap the view in Ely's root `FocusScope`. The [guide](https://elygpui.com/docs/gpui-kit) covers themes, focus and the inspector; `compat/kit` holds a whole app and the tests behind each claim.
|
|
|
|
## Gallery
|
|
|
|
```sh
|
|
cargo run --example gallery
|
|
cargo run --example gallery -- --page buttons
|
|
cargo run --example gallery -- --capture shots # macOS: PNG of every page, light and dark
|
|
ELY_GALLERY_ASSETS=https://example.com/gallery/assets/ scripts/web.sh dist # for the browser
|
|
```
|
|
|
|
In a browser, `?page=buttons&story=icon-button&theme=dark` draws one section alone; `examples/gallery/stories.json` lists them all.
|
|
|
|
## Website
|
|
|
|
```sh
|
|
cd frontend
|
|
pnpm install
|
|
ELY_GALLERY_ASSETS=https://<site>/gallery/assets/ pnpm gallery # the wasm gallery, into public/gallery
|
|
pnpm dev # or: pnpm build && pnpm preview; both fetch the showcase at showcase.lock's commit
|
|
ELY_SHOWCASE=../../Ely-GPUI-Showcases pnpm dev # the showcase from a local checkout
|
|
node scripts/og.mjs # with pnpm preview up: public/og.png from the hero
|
|
node scripts/favicon.mjs # public/favicon.svg, apple-touch-icon.png and ../logo.png from the mark
|
|
pnpm deploy # Cloudflare, through wrangler
|
|
```
|
|
|
|
## Build notes
|
|
|
|
- gpui compiles its Metal shaders at runtime here (`runtime_shaders`, on by default), so a full Xcode install is not required. gpui_platform needs `font-kit`, or macOS draws no text.
|
|
- CI tests the crate and builds the gallery on macOS, Windows and Linux, arm64 and x86_64. The capture tool needs macOS.
|
|
|
|
## License
|
|
|
|
MIT. Lucide icons: ISC. Inter, JetBrains Mono, IBM Plex Sans and the gallery's Noto Sans Hebrew: SIL Open Font License 1.1.
|
|
The gallery photos in `examples/gallery/assets` were generated for this project with gpt-image-2.
|