Code Editor for app.py

import streamlit as st
import streamlit.components.v1 as components

st.title("Wavesurfer demo")


# wavesurfer example
components.html(
    """
    <div id="waveform">
    </div>

    <script type="module">
    import WaveSurfer from 'https://cdn.jsdelivr.net/npm/wavesurfer.js@7/dist/wavesurfer.esm.js'

    const wavesurfer = WaveSurfer.create({
      container: '#waveform',
      waveColor: '#4F4A85',
      progressColor: '#383351',
      url: 'https://raw.githubusercontent.com/audio-samples/audio-samples.github.io/refs/heads/master/samples/mp3/music/sample-0.mp3',
    })

    wavesurfer.on('interaction', () => {
      wavesurfer.play()
    })
    </script>
    """,
    height=600,
)