.o-audio-player
.o-audio-player__element(
ref="audioPlayer"
data-module="audioPlayer"
:data-audio-id="``"
)
audio
source(
:src="audioFile"
:type="fileType"
)
.o-audio-player__controls.flex.flex-start.bg-white.my-4.p-4.flex-col.sm-flex-row
.p-0.sm-pr-4(
v-if="imageSrc"
)
img(:src="imageSrc").w-full
.w-full
.row
.col-12
p.font-700.text-lg.p-0.sm-px-4.mt-6.mb-2.sm-my-2 {{ audioFileName }}
.row
.col-12.flex.flex-row.items-center
button.o-audio-player__play-button.pl-0.pr-4.sm-px-4.py-2.focus-outline-none.cursor-pointer
Icon.o-icon--xl(name="play-icon" path="/spritemap.svg")
.o-audio-player__timeline.relative.rounded.py-2.w-full.cursor-pointer
.o-audio-player__timeline-visual.absolute.w-full
.o-audio-player__playhead.absolute
.o-audio-player__playhead__icon.rounded.bg-primary
.o-audio-player__playhead__total-bar.absolute.bg-primary.rounded
.o-audio-player__timestamp.px-4.my-4.pointer-events-none.select-none(draggable="false")
p.o-audio-player__timestamp__duration.m-0.pointer-events-none 00:00
.o-audio-player__volume.px-2.pl-0.relative
Icon.o-icon--lg(name="volume-high" path="/spritemap.svg").cursor-pointer
.o-audio-player__volume__controls.absolute.bg-white.border.border-grey-01
.o-audio-player__volume__track.m-2.relative
.o-audio-player__volume__button.absolute.bg-primary
.o-audio-player__menu.px-1.cursor-pointer.border.border-transparent.hover-border-grey-01.flex.flex-col.items-center
Icon.o-icon--lg(name="more-horizontal" path="/spritemap.svg")
.o-audio-player__menu__list.p-2.bg-white.shadow
.o-audio-player__menu__list-item.px-2
a(:href="audioFile" download) Download
```jsx
```