mic_component.js

const recordButton = document.getElementById("recordButton");
const stopButton = document.getElementById("stopButton");
const audioChunks = [];

let mediaRecorder;

navigator.mediaDevices.getUserMedia({ audio: true })
  .then(function(stream) {
    mediaRecorder = new MediaRecorder(stream);

    recordButton.onclick = function() {
      mediaRecorder.start();
      console.log("Recording started...");
    };

    stopButton.onclick = function() {
      mediaRecorder.stop();
      console.log("Recording stopped...");
    };

    mediaRecorder.ondataavailable = function(e) {
      audioChunks.push(e.data);
    };

    mediaRecorder.onstop = function(e) {
      const audioBlob = new Blob(audioChunks, { type: "audio/wav" });
      const reader = new FileReader();
      reader.readAsDataURL(audioBlob);
      reader.onloadend = function() {
        const base64data = reader.result.split(',')[1];
        Streamlit.setComponentValue(base64data);
      };
    };
  });