Primitive

Section

Semantic <section> wrapper with ks-semantic class. Provides accessibility landmark. Used by sm-cart drawer + sm-endcap card.

Responsive Preview — viewport @media queries

Mobile · 375 px

Tablet · 768 px

Desktop · 1280 px

Container Tier (SM widget responsive system)

Container width

Live Preview (chrome-mode, container-tier knobs)

Section landmark Content goes here

DSL usage

Section {
  VStack {
    Text("Content goes here")
  }
}

Attributes

Name	Type	Default	Description
`role`	SemanticRole	`section`	section \| article \| aside \| main