1 viewer
Back to Components
Component · Layout

Container

Constrained grouping primitive with no intrinsic meaning.

Category
Layout
Slots
3
States
0
Writer
Shared
cre8.primitive.container

Preview

Live renderShared SSR + WASM writers

Contained Group

Content bounded by a structural container with responsive padding.

<Container>
  <Text text="Contained Group" variant="h3" />
  <Text
    text="Content bounded by a structural container with responsive padding."
    variant="p"
  />
</Container>

Anatomy

The named parts of the rendered markup. Recipes style these hooks, and every renderer keeps them stable.

SlotDOM class
root.primitive-container
header.primitive-container__header
title.primitive-container__title
3 rows

States and platforms

The states the contract publishes, the platforms it declares, and the style recipes that dress it.

States
No published states
Platforms
webnativeruntime-node
Recipes
unstyledruntime-console

Renderers

Shared writer
Container renders through the one writer the server and the WASM DOM share, so both emit the same markup.

Every tag in the example above renders through a shared writer.

Declared adapters. A status is the manifest's declaration, not a measured parity result.

TargetRendererStatus
webreactexperimental
runtime-nodeview-nodeready
ssrhtml-semanticready
terminalterminal-layoutplanned
nativenative-adapterexperimental
5 rows

Accessibility

Named containers can expose a lightweight region without depending on recipe styling, while unnamed groups stay structurally quiet.

  • Containers with a visible title or explicit aria-label expose a stable accessible region name.
  • Unnamed containers avoid introducing extra landmark noise unless a caller opts in with role or aria labelling.