Skip to content

Implement <ProgressBar> tag (egui::ProgressBar) #30

Description

@ZhukMax

Add a declarative <ProgressBar> for displaying task progress. The widget takes a normalized value in [0.0 … 1.0], optional text, and common UX options like percentage display, width hint, disabled state, and tooltip.

  • Covers a ubiquitous “in-progress” UI pattern for downloads, imports, long-running jobs.
  • Keeps templates concise and consistent with EFx’s attribute model.
  • Plays well with live updates in native and wasm32-unknown-unknown builds.

Scope

  • Tag: <ProgressBar>
  • Required: value={number_expr} (float in 0..=1; clamped at render if out of range).
  • Optional attributes:
    text="...", showPercentage=bool, desiredWidth=f32, enabled=bool, tooltip="...", id="...".
  • Events: none (display-only), but the Response should allow hover tooltips.
  • Children: none (text is via text="...").

Non-goals (here): indeterminate/animated barber-pole, custom colors/skins.


Proposed API (sketch)

Template

efx!(ui, r#"
<ProgressBar value={job.progress} text="Importing…" showPercentage="true" desiredWidth="240"/>
"#);

Conceptual mapping to egui

let v = (value as f32).clamp(0.0, 1.0);
let mut pb = egui::ProgressBar::new(v);
if let Some(t) = text           { pb = pb.text(t); }
if show_percentage              { pb = pb.show_percentage(); }
if let Some(w) = desired_width  { pb = pb.desired_width(w); }

let resp = if enabled { ui.add(pb) } else { ui.add_enabled(false, pb) };
if let Some(tip) = tooltip { resp.on_hover_text(tip); }

Tasks

  • AST & parsing

    • Add <ProgressBar> node with attributes: value, text, showPercentage, desiredWidth, enabled, tooltip, id.
    • Reject unexpected children; error if both text attribute and children are supplied (children not allowed).
  • Codegen

    • Read value={expr} (float-like), clamp to [0.0, 1.0] at render time.
    • Map text, showPercentage, desiredWidth, enabled, tooltip, id to the egui builder and Response.
  • Diagnostics

    • Missing value → clear compile error with expected signature.
    • Non-numeric value → type error with hint.
    • Children present → error: <ProgressBar> doesn’t take children; use text="...".
    • Unknown attributes → list allowed attributes.
  • Examples & docs

    • examples/progress_bar.rs: simulated task updating progress over time; with/without percentage.
    • Add snippet to docs/cookbook.md and entry to docs/tags.md.
  • Tests

    • trybuild UI tests: missing value, wrong type, children supplied, unknown attrs.
    • Ensure example builds for wasm32-unknown-unknown (no runtime launch).

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions