Module protocol 

The wire protocol shared between the JS reconciler and the Bevy side.

Everything here derives serde so deno_core’s serde_v8 can convert directly between the plain JS objects the reconciler builds and these Rust types — no JSON strings on the hot path. Ops only ever flow JS -> Rust, so they need Deserialize only; UiEvent flows Rust -> JS and is Serialize.

Wire strings are decoded once, here at the serde boundary — never re-parsed on apply. The unit-bearing types (Length/Angle/Time/ FontSize) parse into their own wire types, and the enum-like style fields (display/align*/flex*/grid tracks/…) decode directly into the bevy_ui/bevy_text values they drive, via field-level deserialize_with (which sidesteps the orphan rule), so applying a style in [crate::ui_map] is a plain field copy. A malformed string must not fail the whole batch (one typo would abort the entire commit and trigger a reload), so every deserializer falls back to the bevy default and emits a tracing::warn! naming the bad value (tracing reaches the same log sink bevy_log drains).

Re-exports

pub use crate::canvas::DrawCmd;

Modules

style_groups

Bit flags naming the groups of work [crate::ui_map::apply_style] (and the update reconciler) derive from a Style. Each Style field belongs to the group(s) whose output reads it (see [with_style_fields]); a delta update ORs the groups of its touched fields into a StyleDirty mask so the apply path can skip every group the delta provably didn’t affect.

Structs

Angle

An angle, parsed from the wire as a number (read as degrees, the CSS convention) or a unit string ("45deg", "1.5rad", "0.25turn", "100grad"). Stored internally as radians — the unit Bevy’s gradient and transform APIs want.

AngularStop

A single color stop for a conic gradient. angle is the stop’s angle in degrees (absent → auto-spaced); hint as in GradientStop.

AtlasSpec

A uniform sprite-sheet grid plus the selected cell. Mirrors TextureAtlasLayout::from_grid (tile size, columns, rows, optional padding / offset, all in source-texture pixels) + TextureAtlas.index. Bevy-free; turned into a cached TextureAtlasLayout asset in ui_map.

BorderColorSpec

Border color: a single CSS color applied to all four sides, or a { top, right, bottom, left } object setting sides individually. Omitted sides decode to None (painted transparent — bevy’s BorderColor default).

BoxShadowSpec

A single drop shadow.

ConicGradientSpec

FilterSpec

A CSS-like filter: each field is one filter function, mirroring CSS naming. Every field is optional; unset means identity (no effect). Amounts follow the CSS convention: brightness/contrast/saturate are multipliers (1.0 = identity), grayscale/sepia/invert are 0.0..=1.0 blends (0 = identity), blur is a radius (a Length in px), and hueRotate is an Angle. The functions are applied in a fixed canonical order (blur → brightness → contrast → saturate → grayscale → sepia → invert → hueRotate), not the declared order, so listing the same function twice is not supported. See [crate::filter].

GradientStop

A single color stop for a linear/radial gradient. position is where the color sits along the gradient line (a Length); absent → auto-spaced. hint is the 0.0..=1.0 interpolation midpoint between this stop and the next (default 0.5).

LinearGradientSpec

OutlineSpec

Outline drawn around (outside) the node’s border box.

Props

Props for a host element. Event handlers never cross the boundary — the reconciler replaces them with booleans (e.g. onClick: true) and keeps the actual function in a JS-side map. Visual styling lives entirely in Style; the fields here are content/attribute level.

PropsDirty

Which parts of a Props a delta update touched; drives which of the reconciler’s apply_* helpers run. Style granularity lives in StyleDirty; the other flags are per prop group.

RadialGradientSpec

Rect

Four sides (or corners), each a Length. Accepts a number, a CSS shorthand string, or a { top, right, bottom, left } object on the wire.

SliceSpec

9-slice scaling parameters, mirroring bevy_sprite::TextureSlicer.

SourceRect

A source sub-rect in texture pixels: top-left (x, y) plus width/height. Converted to a bevy_math::Rect (min/max corners) in ui_map.

Style

A CSS-like style object mapped onto bevy_ui::Node and its sibling visual components. Every field is optional; unset fields keep Bevy’s defaults.

StyleDirty

Which style_groups a delta update touched. ALL (every bit set) is the full-reapply mask used by non-delta paths.

TextShadowSpec

A single text drop shadow. offsetX/offsetY are displacement in logical pixels (absent → bevy’s default of 4.0); color defaults to bevy’s translucent black when unset.

TiledSpec

"tiled" scaling: the whole image repeats once stretched beyond stretch_value.

Time

A time/duration, parsed from the wire as a number (read as milliseconds, the JS-facing unit) or a unit string ("200ms", "0.2s"). Stored as seconds — the unit the animations engine and the transition driver consume.

Transform

A static 2D transform mirroring the animated transform channels. Every field is optional; unset channels stay at identity (no translation, unit scale, no rotation). scale is uniform; scaleX/scaleY override a single axis.

UiEvent

An interaction event sent from Bevy back into JS, where the reconciler dispatches it to the matching React handler.

UpdateEvents

The “act now” props of an update, split from the retained state: pushed into the live widget once and never stored, so an unrelated later delta can’t replay them (re-push a controlled value, re-clone a canvas display list). Absent fields mean “no event”, exactly like the pre-delta protocol.

Enums

BoxShadowList

A boxShadow value: one shadow or a stacked list (CSS box-shadow: a, b, …).

FontSize

A font size mirroring bevy_text::FontSize, parsed from the wire as a number (logical pixels) or a unit string ("24px", "100vw"/vh/vmin/vmax, "1.5rem"). rem is relative to bevy’s RemSize resource (default 20px). (CSS em has no bevy_text equivalent, so it is not accepted.)

GradientList

A backgroundGradient/borderGradient value: one gradient or a layered list.

GradientSpec

One gradient, discriminated by its type field on the wire.

ImageMode

How an image fits its node. A bare string ("auto"/"stretch") maps to the trivial bevy_ui modes; the type-tagged object forms map to bevy’s 9-slice ("sliced") and "tiled" scaling. Bevy-free; converted to NodeImageMode in ui_map.

ImageModeSpec

The object forms of ImageMode, discriminated by their type field.

Length

A length value mirroring bevy_ui::Val, parsed from the wire form (a number is logical pixels; a string carries an explicit unit).

LetterSpacingSpec

Letter spacing for a <text>. A bare number is logical pixels; a string carries a unit ("2px", "0.1rem"/"0.1em" for a font-size multiple, or "normal"); { "rem": n } is a multiple of the font size (legacy object form).

LineHeightSpec

Line height for a <text>. A bare number is a multiple of the font size (RelativeToFont); a string carries a unit ("20px" absolute, "1.5" / "1.5em" a multiple); { "px": n } is an absolute pixel height (legacy object form).

Op

A single mutation produced by the React reconciler during a commit. The reconciler batches a Vec<Op> per commit and flushes it across the boundary in one call.

Outbound

Everything that flows Bevy -> JS over the single outbound channel. Internally tagged (t) so serde_v8 produces a plain JS object the JS event loop can switch on. Each variant serializes to a map, as internal tagging requires.

RadialShapeSpec

The size/shape of a radial gradient. Either a keyword ("closestSide" | "farthestSide" | "closestCorner" | "farthestCorner", default "closestCorner") or an explicit { circle } / { ellipse }.

ResponseResult

The outcome of a React -> Bevy request. Internally tagged (status) so JS reads result.status === "ok". The error is a message, surfaced to JS as a rejected promise — the typed success value is the only thing in the schema.

SliceBorder

9-slice border insets: a single number (uniform) or per-side, in source-texture pixels.

SliceScale

How a 9-slice section scales when resized: "stretch" (the keyword) or { tile }, where tile is the repeat stretch_value.

Constants

ROOT_ID

Type Aliases

ColorSpace

Color space the gradient interpolates in ("oklab" (default), "oklch", "oklchLong", "srgb", "linearRgb", "hsl", "hslLong", "hsv", "hsvLong").

GradientPosition

Radial/conic gradient center, given as a named anchor ("center", "top", "topLeft", …). Arbitrary Val-offset centers are not yet supported.

NodeId

Stable identity for a node, assigned by the JS reconciler. 0 is reserved for the root container (the Bevy UI root entity).