Crate aurora_leptos 

Aurora Dark — Colliery’s Leptos design system

Published on crates.io as colliery-io-aurora (org-prefixed to avoid claiming generic names); the library itself is imported as aurora_leptos.

A general dark design system for Leptos, reused across Colliery projects. It is the core that control-plane apps (cloacina included) are built from — everything below is first-class core, not an optional add-on:

• Components (components) — the full Mantine-primitive + Aurora surface: layout (Box/Group/Stack/SimpleGrid/Grid/AppShell), inputs (Button/TextInput/ Textarea/PasswordInput/NumberInput/Select/Switch/SegmentedControl/CopyButton/ ActionIcon), data + overlay (Table/Tooltip/Modal/Menu/Alert/Loader), and the Aurora pieces (Pill/StatusBadge/Dot/Panel/PageHeader/Chip/Loading/Empty/ ErrorState).
• Widgets (widgets) — generic data-display building blocks: Meter, Banner, StateCounts, HealthPill, BuildStatusBadge, NodeReadiness, InputTable, StaleInputsBanner, plus the Input model and format_ago/is_stale/freshness_pct helpers. Apps supply their own state labels/colors as data — no built-in vocab or branding.
• Graph (graph) — generic graph/DAG drawing primitives: GraphNode, GraphEdge, a dependency-free layered layout, and an SVG Graph component.
• Tokens + pure logic (tokens) — semantic palette, status_color, pill_bg, and ApiError error classification. Framework-agnostic Rust.

Genuinely app-specific surfaces (e.g. cloacina’s DAG/graph + node views) are built downstream from these primitives, not shipped here.

Stylesheet

The CSS ships inside this crate. Two ways to load it (see the workspace README for full snippets):

• Runtime: render AuroraStyles once at the app root (or inject the AURORA_CSS const). Simplest; possible first-paint flash.
• Linked stylesheet (no flash): materialise it as a file and <link> it. With cargo-leptos (builds before bundling), call write_css from build.rs. With trunk (validates assets before building), generate it in a pre_build hook via the leptos-free aurora-css bin.

use aurora_leptos::{components::*, tokens::token};
view! { <Button>"Run"</Button> <Pill color=token::ICE>"tag"</Pill> }

Re-exports

pub use tokens::*;

pub use components::*;

pub use graph::*;

pub use widgets::*;

Modules

components

Aurora Dark components — core Leptos primitives.

graph

Generic graph / DAG drawing primitives.

tokens

Aurora Dark semantic tokens + defensive classifiers — generic, pure logic with no framework dependency. This is the general core shared by every Colliery project; the higher-level state vocab (graph-health/reactor terms) lives alongside the data-display widgets in the widgets module.

widgets

Aurora Dark widgets — generic, higher-level data-display building blocks that control-plane UIs compose from the core primitives.

Constants

AURORA_CSS

The full Aurora Dark stylesheet (IBM Plex @font-face + tokens + component chrome), concatenated at compile time.

COMPONENTS_CSS

Just the component chrome (depends on the token custom properties).

FONTS_CSS

Just the IBM Plex @font-face declarations.

TOKENS_CSS

Just the design tokens (CSS custom properties + scales).

Functions

AuroraStyles

write_css

Writes the full stylesheet to dir/aurora.css and returns the path. Leptos-free — call it from build.rs (cargo-leptos) or via the aurora-css bin in a trunk pre_build hook to ship Aurora Dark as a normal, render-blocking stylesheet. Use default-features = false so leptos isn’t built for the host.