A title connected to content. The component has two states. When folded, only the title is visible. Upon click on the title the content unfolds down. Another click on the title folds it back up.

[%<div-fold>
  <h2></h2>
  <div></div>
</div-fold>%]
[%<div-fold folded>
  <h2></h2>
  <div></div>
</div-fold>%]

The %div-fold% element needs two children. The first one, the _title_, will *always be visible* and is rendered with a triangle before. The second child, the _content_, *toggles visibility* when the first one is clicked. When the title contains children, which should ignore the click, e.g. input elements, they need to have an attribute %df-ignore%.