[makspll]

Elements take every layout property of bevy_ui's Node under its own name, plus colours, text style and images, instead of a closed list of 11 properties.

ui.node({
    flex_direction = "row", align_items = "center", justify_content = "space_between",
    padding = { 4, 8 }, margin = { left = 2 }, border = 1, border_color = "#ffffff", border_radius = 6,
    max_width = "50%", overflow = "clip", z_index = 2,
}, {
    ui.image({ image = "icons/sword.png", width = 32, height = 32 }),
    ui.text({ text = "Sword", font_size = 18, color = "#ffcc00" }),
})

• layout (style.rs): a table of Node fields (style_fields!), each set from a plain value through FromProp, checked by the compiler against the field's type. No reflection or string matching when a property is applied, names are looked up once per element in a map.
  • sizes: a number of pixels, "50%", "10px", "5vw", "5vh", "auto"
  • sides (margin, padding, border): one size, { vertical, horizontal }, { top, right, bottom, left } or { left = .. }
  • enums: the variant's name, "space_between". Listed in the error when wrong
  • nil resets a property to its default
• border_color, z_index, font_size, color, image (a path, loaded by the asset server; ui.image is a node with one)
• colours are hex strings or { red, green, blue [, alpha] }
• ui.describe reports the layout, font size, colours and whether there is an image, for tests

Not included: grid tracks and placement (grid_template_rows etc.), which need their own value syntax.

Stacked on #726. Tested in Lua and Rune.

[semanticdiff-com]

Review changes with  

Changed Files

File	Status
crates/bevy_mod_scripting_reactive_ui/src/runtime.rs	78% smaller
assets/tests/reactive_ui/inventory/inventory.lua	30% smaller
crates/bevy_mod_scripting_reactive_ui/src/element.rs	1% smaller
assets/tests/reactive_ui/inventory_rune/inventory.rn	Unsupported file format
crates/bevy_mod_scripting_reactive_ui/Cargo.toml	Unsupported file format
crates/bevy_mod_scripting_reactive_ui/src/lib.rs	0% smaller
crates/bevy_mod_scripting_reactive_ui/src/style.rs	0% smaller
crates/testing_crates/script_integration_test_harness/Cargo.toml	Unsupported file format
crates/testing_crates/script_integration_test_harness/src/lib.rs	0% smaller

[github-actions]

Bencher Report

Project	Bevy Scripting
Branch	agent/reactive-ui-style
Testbed	linux-gha

⚠️ WARNING: Truncated view!

The full continuous benchmarking report exceeds the maximum length allowed on this platform.

⚠️ WARNING: No Threshold found!

Without a Threshold, no Alerts will ever be generated.

🐰 View full continuous benchmarking report in Bencher