Collapses

= ui.nfg :button, as: :button, collapse: '#required_id1', body: 'Collapse Toggle Button Element'
<button class="btn btn-primary" data-toggle="collapse" data-target="#required_id1" aria-expanded="false" aria-controls="required_id1" role="button" type="button">Collapse Toggle Button Element</button>
Hello collapse, I should not be collapsed by default
= ui.nfg :collapse, id: 'required_id1' do
  Hello collapse, I should not be collapsed by default
<div class="collapse show" id="required_id1">Hello collapse, I should not be collapsed by default
</div>

= ui.nfg :button, collapse: '#required_id2', body: 'Collapse Toggle Link Element'
<a class="btn btn-primary" data-toggle="collapse" href="#required_id2" aria-expanded="false" aria-controls="required_id2" role="button">Collapse Toggle Link Element</a>
Body implemented via options and is collapsed. Collapse is not collapsed by default
= ui.nfg :collapse, id: 'required_id2', body: 'Body implemented via options and is collapsed. Collapse is not collapsed by default', collapsed: true
<div class="collapse" id="required_id2">Body implemented via options and is collapsed. Collapse is not collapsed by default</div>

collapse with heading

Body implemented via options and is collapsed. Collapse is not collapsed by default
= ui.nfg :collapse, id: 'required_id3', body: 'Body implemented via options and is collapsed. Collapse is not collapsed by default', heading: 'Collapse heading link', collapsed: true
<a class="btn pl-0 text-left btn-link btn-block" data-toggle="collapse" href="#required_id3" aria-expanded="false" aria-controls="required_id3" role="button">Collapse heading link<i aria-hidden="true" class="fa fa-caret-down ml-1"></i></a>
<div class="collapse" id="required_id3">Body implemented via options and is collapsed. Collapse is not collapsed by default</div>