.w-accordion__item(:class="itemClasses" :aria-expanded="accordionItem._expanded ? 'true' : 'false'")
.w-accordion__item-title(
@click="!accordionItem._disabled && toggleItem(accordionItem, $event)"
@pointerdown="onAccordionTitlePointerDown"
@focus="$emit('focus', (accordionItem))"
@keypress.enter="!accordionItem._disabled && toggleItem(accordionItem, $event)"
:tabindex="!accordionItem._disabled && 0"
:class="accordionTitleClasses")
//- Expand icon on left.
w-button.w-accordion__expand-icon(
v-if="options.expandIcon && !options.expandIconRight"
:icon="(accordionItem._expanded && options.collapseIcon) || options.expandIcon"
:icon-props="options.expandIconProps"
:disabled="accordionItem._disabled || null"
:tabindex="-1"
text
@keypress.stop
@click.stop="!accordionItem._disabled && toggleItem(accordionItem, $event)"
:class="{ 'w-accordion__expand-icon--expanded': accordionItem._expanded, 'w-accordion__expand-icon--rotate90': options.expandIconRotate90 }")
//- Title.
slot(
name="title"
:item="getOriginalItem(accordionItem)"
:expanded="accordionItem._expanded"
:index="accordionItem._index + 1")
.grow(v-html="accordionItem[options.itemTitleKey]")
//- Expand icon on right.
w-button.w-accordion__expand-icon(
v-if="options.expandIcon && options.expandIconRight"
:icon="(accordionItem._expanded && options.collapseIcon) || options.expandIcon"
text
@keypress.stop
@click.stop="!accordionItem._disabled && toggleItem(accordionItem, $event)"
:class="{ 'w-accordion__expand-icon--expanded': accordionItem._expanded, 'w-accordion__expand-icon--rotate90': options.expandIconRotate90 }")
//- Content.
//- keepInDom: content stays mounted; v-show toggles visibility (keep-alive is inactive, like w-tabs).
w-transition-expand(
v-if="options.keepInDom"
y
@after-leave="onEndOfCollapse(accordionItem)"
:duration="options.duration")
accordion-content(
v-show="accordionItem._expanded"
:item="accordionItem"
:class="contentClasses")
slot(
v-if="$slots.content"
name="content"
:item="getOriginalItem(accordionItem)"
:expanded="accordionItem._expanded"
:index="accordionItem._index + 1")
div(v-html="accordionItem[options.itemContentKey]")
slot(
v-else
name="default"
:item="getOriginalItem(accordionItem)"
:expanded="accordionItem._expanded"
:index="accordionItem._index + 1")
div(v-html="accordionItem[options.itemContentKey]")
w-transition-expand(
v-else
y
@after-leave="onEndOfCollapse(accordionItem)"
:duration="options.duration")
keep-alive(:exclude="options.keepAlive ? '' : 'accordion-content'")
accordion-content(
v-if="accordionItem._expanded"
:key="accordionItem._cuid"
:item="accordionItem"
:class="contentClasses")
slot(
v-if="$slots.content"
name="content"
:item="getOriginalItem(accordionItem)"
:expanded="accordionItem._expanded"
:index="accordionItem._index + 1")
div(v-html="accordionItem[options.itemContentKey]")
slot(
v-else
name="default"
:item="getOriginalItem(accordionItem)"
:expanded="accordionItem._expanded"
:index="accordionItem._index + 1")
div(v-html="accordionItem[options.itemContentKey]")