Layouts

Introduction

Layout components from almasix.orbit.schemas nest inside any schema — forms, infolists, and custom pages. Prefer Section for titled panels, Tabs / Wizard for progressive disclosure, and Grid / Flex / Group / Split for alignment without extra chrome.

app/orbit/schemas/layout_compose.py

from almasix.orbit.schemas import Flex, Group, Split, Section, Fieldset
from almasix.orbit.forms import TextInput

Section.make("profile").heading("Profile").collapsible().schema([
    Flex.make().from_breakpoint("md").schema([
        TextInput.make("first_name"),
        TextInput.make("last_name"),
    ]),
    Group.make().columns(2).schema([
        TextInput.make("city"),
        TextInput.make("country"),
    ]),
    Split.make().from_("lg").schema([
        Fieldset.make().label("Contact").schema([TextInput.make("email")]),
        Fieldset.make().label("Notes").schema([TextInput.make("notes")]),
    ]),
])

Shared layout APIs

Every layout inherits from Layout:

Method	Role
.schema	Nested child components
.dense	Tighter spacing (or-dense)
.gap	True (default), False (none), or a named gap token string
.defer_loading	Emit data-defer for async chrome

app/orbit/schemas/layout_shared.py

Grid.make().dense().gap(False).columns(2).schema([...])
Flex.make().gap("sm").from_breakpoint("md").schema([...])

Component map

Component	Role
Grid	Responsive columns, dense / gap, grid container
Flex	Flex row with breakpoint stacking
Group	Fuse children (optional columns)
Split	Side-by-side panes that stack
Section	Heading, icon, compact / aside, collapsible
Fieldset	Native fieldset + legend; optional bare mode
Tabs	Icons, badges, persist
Wizard	Nav, continue / back, skip

More layout shots