inspector-polish

name	inspector-polish
description	Inspector polish patterns for reflection-driven property editors — right-aligned labels, drag-to-scrub, consistent spacing.
source	auto-skill
extracted_at	2026-06-14T09:27:25.957Z

Inspector Polish Patterns

Context

Titan's reflection-driven inspector (reflect_inspector.rs) renders properties for any #[derive(Reflect)] component. Each field type maps to a "row" widget (drag value, checkbox, text edit, vec2/vec3/quat).

Right-Aligned Labels

Pro tools (Maya, Unity, Unreal) use right-aligned labels for a clean vertical scanning edge. Apply to all inspector row widgets:

fn drag_value_row<T>(ui: &mut egui::Ui, label: &str, value: &mut T, speed: f32) -> InspectorResponse
where T: egui::emath::Numeric {
    let mut acc = InspectorResponse::default();
    ui.horizontal(|ui| {
        // Right-aligned label
        let label_width = ui.available_width() * 0.4;
        ui.allocate_ui_with_layout(
            egui::vec2(label_width, ui.spacing().interact_size.y),
            egui::Layout::right_to_left(egui::Align::Center),
            |ui| {
                ui.label(
                    egui::RichText::new(label)
                        .size(style::type_scale::CAPTION)
                        .color(style::palette::text_secondary()),
                );
            },
        );
        ui.add_space(style::space::SM);
        let r = ui.add(egui::DragValue::new(value).speed(speed));
        acc = InspectorResponse::from_egui(&r);
    });
    acc
}

Apply the same pattern to vec2_row, vec3_row, vec4_row, quat_euler_row, checkbox_row, text_edit_row:

• Single-field widgets: 40% label width
• Multi-field widgets (Vec2/Vec3/Vec4): 20-25% label width

Consistent Spacing

All field rows use:

• style::space::SM (8px) gap between label and control
• style::type_scale::CAPTION (11px) for labels
• style::palette::text_secondary() for label color

Spec Compliance

Per the spec:

• Labels right-aligned, controls left-aligned for clean vertical edge ✓
• Collapsible sections per component type (already done via egui::CollapsingHeader) ✓
• 8px between property rows, 12px between section groups ✓

What Was NOT Done

• Drag-to-scrub on numeric labels — egui's DragValue already supports scrubbing (click-drag on the value). No additional work needed.
• Reset-to-default affordance per property — requires knowledge of component defaults, which the reflection system doesn't expose yet. Deferred.
• Multi-select display (— for mixed values) — requires multi-entity selection support in the inspector, which is a separate feature.