Module canvas 

The canvas host element: an arbitrary anti-aliased vector drawing surface.

A <canvas> is a normal styled UI node carrying an ImageNode whose texture this module paints. Semantics are web-faithful: the surface is a retained pixel buffer that paint accumulates onto. React-side drawing calls (ctx.moveTo/lineTo/fill/clearRect/…) record DrawCmds that cross the bridge — either as the declarative draw prop (clear + replay) or as imperative draw ops from a persistent canvas handle (append) — and land in the CanvasSurface’s pending queue. Each frame, update_canvas_surfaces drains the queue onto the retained pixmap at the node’s laid-out pixel size.

Like an HTML canvas whose width/height is set, a layout resize clears the surface (the pixmap is recreated transparent and the raster state resets); the core crate emits a "resize" UI event so the app — or the runtime’s automatic replay of a declarative painter — redraws. Fill/stroke styles, line width, and the current path persist across drawing sessions until such a reset, mirroring CanvasRenderingContext2D.

Rasterization is CPU-side (via tiny-skia), so it is fully decoupled from Bevy’s render internals — the canvas is “an image we paint into”, reusing the existing ImageNode plumbing. The rasterizer is isolated in apply_cmds; a future GPU backend (e.g. bevy_vello) could replace it without touching the protocol, the reconciler, or the JS side.

Structs

CanvasSurface

The drawing state of a canvas element: a retained premultiplied pixel buffer, the persistent raster state, and the queue of commands recorded since the last paint. Paint accumulates — a batch draws on top of what is already there — except when replace is set (the declarative draw prop: clear + replay) or the laid-out size changes (clear-on-resize).

Enums

DrawCmd

One vector drawing command in a canvas element’s display list. Mirrors a subset of the HTML CanvasRenderingContext2D path API; coordinates are in logical (CSS) pixels matching the node’s layout size, top-left origin — the rasterizer scales them to physical pixels by the device pixel ratio. Bevy-free, decoded on the Rust side and replayed into the rasterizer by update_canvas_surfaces.

Constants

MAX_DIM

Largest backing-texture dimension we allocate, in physical pixels. A guard against a degenerate layout asking for an enormous buffer.

Functions

blank_canvas_image

A 1×1 transparent image to back a freshly-spawned canvas until its first rasterization (which happens once the node has a laid-out size). Kept in both worlds so update_canvas_surfaces can mutate the CPU copy and have it re-upload.

clamp_physical_size

Round + clamp a laid-out physical size (a ComputedNode.size) to the rasterizable range. A 0 component means “not laid out yet”. Shared with the core crate’s resize-event emitter so the size reported to JS always matches the actual buffer.

parse_css_color

Parse a CSS color string into a straight-alpha Srgba. Supports:

update_canvas_surfaces

Paint every canvas with pending work (queued commands, a replace, or a layout resize — which clears, per HTML canvas semantics) and upload the result into the backing image. Reads the node’s size from ComputedNode (already in physical pixels, so the result is crisp on HiDPI).