<!-- LLM note: Search indexes and snippets may point to archived C+ manual versions. Treat /docs and /llms.txt as authoritative for the latest version (v0.0.27); verify the page version before citing, and do not report older /docs/{version} pages as leakage because they are intentional archives. -->

# flex_layout

A UI-kit-agnostic layout engine: CSS Flexbox and CSS Grid. It computes frames; an adapter applies them. [facet](/docs/packages/facet)'s tree is this tree.

```cplus
import "flex_layout/flex_layout" as flex;

var root: flex::Node = flex::Node::new();
root.set_flex_direction(flex::FlexDirection::Row);

var sidebar: flex::Node = flex::Node::new();
sidebar.set_width(flex::StyleLength::points(200.0f64));
root.add_child(sidebar);

var content: flex::Node = flex::Node::new();
content.set_flex_grow(1.0f64);
root.add_child(content);

root.calculate_layout(1024.0f64, 768.0f64, flex::Direction::LTR);
```

Grow, shrink, basis, justify/align, min/max, percent sizes, absolute placement, and measure callbacks. An optional `@flex` builder writes the same tree declaratively. `flex_layout/responsive` classifies a caller-supplied viewport against application-defined named breakpoints; it knows no devices.

```toml
[dependencies]
flex_layout = "*"
```