Skip to content

Implement <ComboBox> tag (egui::ComboBox) #24

@ZhukMax

Description

@ZhukMax

Add a declarative <ComboBox> with <Item> children. The widget binds to a selected value, renders the currently selected text, and emits onChange when a new item is chosen. Supports literals and expressions for item values.

  • Cover a core selection pattern in egui with a clean, template-first API.
  • Enable typical “settings” and “form” UIs without imperative glue code.
  • Align with existing EFx input semantics (controlled value + events).

Scope

  • New tags: <ComboBox> and <Item>.
  • Controlled selection: value={expr} (owned or copyable type that implements PartialEq + Clone).
  • Rendering of current selection via selected_text or inferred from the selected item.
  • Optional attributes: id, width, placeholder, enabled, tooltip.

Proposed API (sketch)

// Template
efx!(ui, r#"
<ComboBox id="theme" width="180" value={model.theme} onChange={|v| model.theme = v}>
  <Item value="Light">Light</Item>
  <Item value="Dark">Dark</Item>
  <Item value="System">System</Item>
</ComboBox>
"#);

// Mapping (conceptual)
egui::ComboBox::from_id_source(id)
  .width(width)
  .selected_text(selected_text_or_value)
  .show_ui(ui, |ui| {
      // For each <Item>:
      // ui.selectable_value(&mut value, item_value, item_label);
  });

Tasks

  • Implement AST nodes for <ComboBox> and <Item>, with value parsing (string, number, enum-like via Display/ToString).
  • Codegen: bind value={expr}; emit selectable_value entries for each <Item>.
  • onChange support: detect change vs previous value and call closure with new value.
  • Attributes: id, width, placeholder, enabled, tooltip.
  • Diagnostics: missing value, duplicate <Item value=...>, unsupported types → actionable errors.
  • Examples: simple theme selector; enum-backed selector.
  • trybuild UI tests for invalid structures and type mismatches.
  • Ensure examples build for wasm32-unknown-unknown (no runtime).

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