An accordion is a vertically stacked set of interactive headings that each reveal an associated section of content.
The accordion component is made up of accordion, which is the root of the component and takes in an accordion.item,
which contains all the contents of the collapsible section.
We use the type prop to determine whether multiple items can be opened at once. The allowed values for this prop are
single and multiple where single will only open one item at a time. The default value for this prop is single.
We use the default_value prop to specify which item should open by default. The value for this prop should be any of the
unique values set by an accordion.item.
We use orientation prop to set the orientation of the accordion to vertical or horizontal. By default, the orientation
will be set to vertical. Note that, the orientation prop won't change the visual orientation but the
functional orientation of the accordion. This means that for vertical orientation, the up and down arrow keys moves focus between the next or previous item,
while for horizontal orientation, the left or right arrow keys moves focus between items.
We use the value prop to specify the controlled value of the accordion item that we want to activate.
This property should be used in conjunction with the on_value_change event argument.