Generates the header and region of an accordion section.
The component supports a sliding animation by setting the
attribute of the region on two occasions if a transition for
height is defined for the region.
When the region is to be expanded, the component calculates the
(expected) height of the region and sets its style's
height to that
value. When the transition has ended, the explicit
height value is
removed again, thus allowing the section to adjust to the size of its
content if that content changes.
When the region is to be collapsed, the component calculates the
current height of the region and assigns the result to the
height for one animation frame. Together with a CSS rule
height: 0 if the region is hidden, this triggers
a transition from the calculated height to 0.
During either transition, the attribute
data-transitioning is set
on the region.
Note that adding padding to the section breaks the transition. Therefore,
div is generated as child of the section that contains the
slot content. Use this
div to add any padding.