Box

Type identifier: box Category: Experience Blocks

Description

Container block used for layout composition and optional semantic HTML mapping. It accepts the shared properties and can contain nested children blocks.

Schema Summary

The Box block has these fields, in addition to the shared properties:

type: "box" (required)
htmlElement (optional)
htmlElementConfig (optional; supports details.defaultOpen only)
children (optional; array of blocks)
states (optional array of state override entries)

Properties

Property	Type	Required	Notes
`id`	`string`	Yes	Shared block identifier.
`type`	`"box"`	Yes	Block discriminator.
`name`	`string`	No	Optional block name.
`htmlElement`	`string` (enum)	No	Semantic/container element override. One of `main`, `section`, `article`, `details`, `summary`, `figure`, `figcaption`, `time`, `output`, `progress`, `meter`, `ol`, `ul`, `li`, `menu`, `table`, `thead`, `tbody`, `tfoot`, `tr`, `th`, `td`, `caption`, `col`, `colgroup`.
`htmlElementConfig`	`{ details?: { defaultOpen?: boolean } }`	No	Config for supported semantic elements.
`children`	Array of blocks	No	Nested blocks of any experience block type.
`states`	Array of states	No	Optional state-specific overrides.

The Box block also supports shared style/layout/data props (border/background/shadow, spacing, flex/grid/layout, typography, query/forEach/entityContext, transform/transition, and raw style).

States

State entries use:

id: one of hover, active, focus, enabled, readonly, visited, selected, disabled or custom ^s[a-f0-9]{6}$
name?
activation?.when (datumReference or datumCondition)
overrides: partial box fields excluding id, name, states