Skip to content

Work / Trunk / Wiki / Surfaces

components-properties

Surfacecanonicalverified 2026-10-21

SURFACE.WEB.COMPONENTS-EDIT.COMPONENTS-PROPERTIES

Summary

The Properties section of a component in Edit, and a layer bound to one.

Raw wireframe

  • .context/designs/web/components-edit/components-properties.html

Why it is drawn this way

Properties are the component's API, at the top of the Design tab. State and Size are fixed and every component has them. Then the author's: Variant (Expanded), Text (Title, Total), Instance swap (Icon), Slot (Content). Each row says its kind and its default.

+ adds one of each type: Variant, Text, Boolean, Instance swap, Slot, and Interaction states (Hover · Pressed · Disabled, built in). Boolean opens components-new-property.

A layer is bound from its own field. Every field of the picked layer has a ◇ beside it; a bound field shows the property's name in its place, with × to unbind. Here the Content frame is the Content slot. The bound property is highlighted in the list, so the binding is said in the field and shown in the list, not written twice.

Layers show the bindings in chips, so the whole API can be read off the tree.

Related

Sources