react-audio-voice-recorder - npm Package Compare versions

Comparing version 1.1.7 to 1.2.0

dist/components/AudioRecordingComponent.d.ts

@@ -14,2 +14,3 @@ import { ReactElement } from "react";
  * @prop `downloadFileExtension` File extension for the audio filed that gets downloaded. Defaults to `mp3`. Allowed values are `mp3`, `wav` and `webm`
+ * @prop `showVisualizer` Displays a waveform visualization for the audio when set to `true`. Defaults to `false`
  * @prop `classes` Is an object with attributes representing classes for different parts of the component
@@ -16,0 +17,0 @@ */

dist/components/interfaces.d.ts

@@ -68,2 +68,6 @@ import { MediaAudioTrackConstraints, recorderControls } from "../hooks/useAudioRecorder";
     /**
+     * Displays a waveform visualization for the audio when set to `true`. Defaults to `false`
+     **/
+    showVisualizer?: boolean;
+    /**
      * Custom classes to changes styles.
@@ -70,0 +74,0 @@ **/

dist/react-audio-voice-recorder.es.js

@@ -1,111 +0,845 @@
-(function(){"use strict";(r=>{try{if(typeof window>"u")return;var e=document.createElement("style");e.appendChild(document.createTextNode(r)),document.head.appendChild(e)}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})(".audio-recorder{background-color:#ebebeb;box-shadow:0 2px 5px #bebebe;border-radius:20px;box-sizing:border-box;color:#000;width:40px;display:flex;align-items:center;transition:all .2s ease-in;-webkit-tap-highlight-color:transparent}.audio-recorder-mic{box-sizing:content-box;cursor:pointer;height:16px;color:#000;padding:12px}.audio-recorder .audio-recorder-mic{border-radius:20px}.audio-recorder.recording .audio-recorder-mic{border-radius:0}.audio-recorder-timer,.audio-recorder-status{color:#000;margin-left:10px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:14px;font-weight:400;line-height:1}.audio-recorder-status{margin-left:15px;display:flex;align-items:baseline;flex-grow:1;animation-name:fading-ar-status;animation-duration:2s;animation-iteration-count:infinite}.audio-recorder-status-dot{background-color:#d00;border-radius:50%;height:10px;width:9px;margin-right:5px}.audio-recorder-options{box-sizing:content-box;height:16px;cursor:pointer;padding:12px 6px 12px 12px}.audio-recorder-options~.audio-recorder-options{padding:12px 12px 12px 6px;border-radius:0 5px 5px 0}.recording{border-radius:12px;width:300px;transition:all .2s ease-out}.display-none{display:none}@keyframes fading-ar-status{0%{opacity:1}50%{opacity:0}to{opacity:1}}")})();
-import L, { useState as j, useCallback as m, useEffect as k } from "react";
-const Q = (I, d) => {
-  const [w, D] = j(!1), [s, t] = j(!1), [M, a] = j(0), [i, o] = j(), [c, g] = j(), [y, S] = j(), z = m(() => {
-    const e = setInterval(() => {
-      a((N) => N + 1);
+(function(){"use strict";(r=>{try{if(typeof window>"u")return;var e=document.createElement("style");e.appendChild(document.createTextNode(r)),document.head.appendChild(e)}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})(".audio-recorder{background-color:#ebebeb;box-shadow:0 2px 5px #bebebe;border-radius:20px;box-sizing:border-box;color:#000;width:40px;display:flex;align-items:center;transition:all .2s ease-in;-webkit-tap-highlight-color:transparent}.audio-recorder-mic{box-sizing:content-box;cursor:pointer;height:16px;color:#000;padding:12px}.audio-recorder .audio-recorder-mic{border-radius:20px}.audio-recorder.recording .audio-recorder-mic{border-radius:0}.audio-recorder-timer,.audio-recorder-status{color:#000;margin-left:10px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:14px;font-weight:400;line-height:1}.audio-recorder-status{margin-left:15px;display:flex;align-items:baseline;flex-grow:1;animation-name:fading-ar-status;animation-duration:2s;animation-iteration-count:infinite}.audio-recorder-status-dot{background-color:#d00;border-radius:50%;height:10px;width:9px;margin-right:5px}.audio-recorder-options{box-sizing:content-box;height:16px;cursor:pointer;padding:12px 6px 12px 12px}.audio-recorder-options~.audio-recorder-options{padding:12px 12px 12px 6px;border-radius:0 5px 5px 0}.recording{border-radius:12px;width:300px;transition:all .2s ease-out}.display-none{display:none}.audio-recorder-visualizer{margin-left:15px;flex-grow:1;align-self:center;display:flex;align-items:center}@keyframes fading-ar-status{0%{opacity:1}50%{opacity:0}to{opacity:1}}")})();
+import O, { useState as x, useCallback as _, useRef as st, useEffect as ye } from "react";
+const lt = (l, d) => {
+  const [b, v] = x(!1), [L, g] = x(!1), [w, n] = x(0), [o, D] = x(), [p, y] = x(), [u, T] = x(), h = _(() => {
+    const E = setInterval(() => {
+      n((k) => k + 1);
     }, 1e3);
-    g(e);
-  }, [a, g]), C = m(() => {
-    c != null && clearInterval(c), g(void 0);
-  }, [c, g]), T = m(() => {
-    c == null && navigator.mediaDevices.getUserMedia({ audio: I != null ? I : !0 }).then((e) => {
-      D(!0);
-      const N = new MediaRecorder(e);
-      o(N), N.start(), z(), N.addEventListener("dataavailable", (A) => {
-        S(A.data), N.stream.getTracks().forEach((n) => n.stop()), o(void 0);
+    y(E);
+  }, [n, y]), z = _(() => {
+    p != null && clearInterval(p), y(void 0);
+  }, [p, y]), R = _(() => {
+    p == null && navigator.mediaDevices.getUserMedia({ audio: l != null ? l : !0 }).then((E) => {
+      v(!0);
+      const k = new MediaRecorder(E);
+      D(k), k.start(), h(), k.addEventListener("dataavailable", (Q) => {
+        T(Q.data), k.stream.getTracks().forEach((Y) => Y.stop()), D(void 0);
       });
-    }).catch((e) => {
-      console.log(e.name, e.message, e.cause), d == null || d(e);
+    }).catch((E) => {
+      console.log(E.name, E.message, E.cause), d == null || d(E);
     });
   }, [
-    c,
+    p,
+    v,
     D,
-    o,
-    z,
-    S,
+    h,
+    T,
     d
-  ]), l = m(() => {
-    i == null || i.stop(), C(), a(0), D(!1), t(!1);
+  ]), M = _(() => {
+    o == null || o.stop(), z(), n(0), v(!1), g(!1);
   }, [
-    i,
-    a,
-    D,
-    t,
-    C
-  ]), r = m(() => {
-    s ? (t(!1), i == null || i.resume(), z()) : (t(!0), C(), i == null || i.pause());
-  }, [i, t, z, C]);
+    o,
+    n,
+    v,
+    g,
+    z
+  ]), m = _(() => {
+    L ? (g(!1), o == null || o.resume(), h()) : (g(!0), z(), o == null || o.pause());
+  }, [o, g, h, z]);
   return {
-    startRecording: T,
-    stopRecording: l,
-    togglePauseResume: r,
-    recordingBlob: y,
-    isRecording: w,
-    isPaused: s,
-    recordingTime: M,
-    mediaRecorder: i
+    startRecording: R,
+    stopRecording: M,
+    togglePauseResume: m,
+    recordingBlob: u,
+    isRecording: b,
+    isPaused: L,
+    recordingTime: w,
+    mediaRecorder: o
   };
-}, B = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgdmlld0JveD0iMCAwIDQ3MCA0NzAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ3MCA0NzA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KCTxnPgoJCTxwYXRoIGQ9Ik0yMzUsMzAyLjI5NmM0Ny4xNzcsMCw4NS40MjMtMzguMjQ1LDg1LjQyMy04NS40MjNWODUuNDIzQzMyMC40MjMsMzguMjQ1LDI4Mi4xNzcsMCwyMzUsMHMtODUuNDIzLDM4LjI0NS04NS40MjMsODUuNDIzCgkJCXYxMzEuNDUxQzE0OS41NzcsMjY0LjA1MSwxODcuODIzLDMwMi4yOTYsMjM1LDMwMi4yOTZ6Ii8+CgkJPHBhdGggZD0iTTM1MC40MjMsMTM2LjE0OHYzMGgxNXY1MC43MjZjMCw3MS45MTUtNTguNTA4LDEzMC40MjMtMTMwLjQyMywxMzAuNDIzcy0xMzAuNDIzLTU4LjUwNy0xMzAuNDIzLTEzMC40MjN2LTUwLjcyNmgxNXYtMzAKCQkJaC00NXY4MC43MjZDNzQuNTc3LDMwMC4yNzMsMTM4LjU1MSwzNjksMjIwLDM3Ni41ODlWNDQwaC05MC40NDR2MzBoMjEwLjg4OXYtMzBIMjUwdi02My40MTEKCQkJYzgxLjQ0OS03LjU4OSwxNDUuNDIzLTc2LjMxNywxNDUuNDIzLTE1OS43MTZ2LTgwLjcyNkgzNTAuNDIzeiIvPgoJPC9nPgo8L3N2Zz4K", Z = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNDcuNjA3IDQ3LjYwNyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDcuNjA3IDQ3LjYwNzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgoJPGc+CgkJPHBhdGggZD0iTTE3Ljk5MSw0MC45NzZjMCwzLjY2Mi0yLjk2OSw2LjYzMS02LjYzMSw2LjYzMWwwLDBjLTMuNjYyLDAtNi42MzEtMi45NjktNi42MzEtNi42MzFWNi42MzFDNC43MjksMi45NjksNy42OTgsMCwxMS4zNiwwCgkJCWwwLDBjMy42NjIsMCw2LjYzMSwyLjk2OSw2LjYzMSw2LjYzMVY0MC45NzZ6Ii8+CgkJPHBhdGggZD0iTTQyLjg3Nyw0MC45NzZjMCwzLjY2Mi0yLjk2OSw2LjYzMS02LjYzMSw2LjYzMWwwLDBjLTMuNjYyLDAtNi42MzEtMi45NjktNi42MzEtNi42MzFWNi42MzEKCQkJQzI5LjYxNiwyLjk2OSwzMi41ODUsMCwzNi4yNDYsMGwwLDBjMy42NjIsMCw2LjYzMSwyLjk2OSw2LjYzMSw2LjYzMVY0MC45NzZ6Ii8+Cgk8L2c+Cjwvc3ZnPgo=", E = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgdmlld0JveD0iMCAwIDQ5NC4xNDggNDk0LjE0OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDk0LjE0OCA0OTQuMTQ4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+Cgk8Zz4KCQk8Zz4KCQkJPHBhdGggZD0iTTQwNS4yODQsMjAxLjE4OEwxMzAuODA0LDEzLjI4QzExOC4xMjgsNC41OTYsMTA1LjM1NiwwLDk0Ljc0LDBDNzQuMjE2LDAsNjEuNTIsMTYuNDcyLDYxLjUyLDQ0LjA0NHY0MDYuMTI0CgkJCQljMCwyNy41NCwxMi42OCw0My45OCwzMy4xNTYsNDMuOThjMTAuNjMyLDAsMjMuMi00LjYsMzUuOTA0LTEzLjMwOGwyNzQuNjA4LTE4Ny45MDRjMTcuNjYtMTIuMTA0LDI3LjQ0LTI4LjM5MiwyNy40NC00NS44ODQKCQkJCUM0MzIuNjMyLDIyOS41NzIsNDIyLjk2NCwyMTMuMjg4LDQwNS4yODQsMjAxLjE4OHoiLz4KCQk8L2c+Cgk8L2c+Cjwvc3ZnPgo=", O = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMThweCIgaGVpZ2h0PSIxOHB4IiB2aWV3Qm94PSIwIDAgMTggMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZmlsbD0iIzAwMDAwMCIgZD0iTTE3Ljg1IDMuMTVsLTIuOTktM0EuNTA4LjUwOCAwIDAgMCAxNC41IDBIMS40QTEuNDE3IDEuNDE3IDAgMCAwIDAgMS40M3YxNS4xNEExLjQxNyAxLjQxNyAwIDAgMCAxLjQgMThoMTUuMmExLjQxNyAxLjQxNyAwIDAgMCAxLjQtMS40M1YzLjVhLjQ3LjQ3IDAgMCAwLS4xNS0uMzV6TTIgNVYzYTEgMSAwIDAgMSAxLTFoOGExIDEgMCAwIDEgMSAxdjJhMSAxIDAgMCAxLTEgMUgzYTEgMSAwIDAgMS0xLTF6bTcgMTFhNCA0IDAgMSAxIDQtNCA0IDQgMCAwIDEtNCA0eiIvPgo8L3N2Zz4K", W = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNDYuNzM0IDQ2LjczNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDYuNzM0IDQ2LjczNDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8Zz4KCTxwYXRoIGQ9Ik00MS4zNDYsMEg1LjM4OEMyLjQxNywwLDAsMi40MTcsMCw1LjM4OHYzNS45NThjMCwyLjk3MSwyLjQxNyw1LjM4OCw1LjM4OCw1LjM4OGgzNS45NThjMi45NzEsMCw1LjM4OC0yLjQxNyw1LjM4OC01LjM4OAoJCVY1LjM4OEM0Ni43MzMsMi40MTcsNDQuMzE2LDAsNDEuMzQ2LDB6Ii8+CjwvZz4KPC9zdmc+Cg==";
-const R = ({
-  onRecordingComplete: I,
+};
+var pe = { exports: {} }, V = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var Re;
+function ft() {
+  if (Re)
+    return V;
+  Re = 1;
+  var l = O, d = Symbol.for("react.element"), b = Symbol.for("react.fragment"), v = Object.prototype.hasOwnProperty, L = l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, g = { key: !0, ref: !0, __self: !0, __source: !0 };
+  function w(n, o, D) {
+    var p, y = {}, u = null, T = null;
+    D !== void 0 && (u = "" + D), o.key !== void 0 && (u = "" + o.key), o.ref !== void 0 && (T = o.ref);
+    for (p in o)
+      v.call(o, p) && !g.hasOwnProperty(p) && (y[p] = o[p]);
+    if (n && n.defaultProps)
+      for (p in o = n.defaultProps, o)
+        y[p] === void 0 && (y[p] = o[p]);
+    return { $$typeof: d, type: n, key: u, ref: T, props: y, _owner: L.current };
+  }
+  return V.Fragment = b, V.jsx = w, V.jsxs = w, V;
+}
+var re = {};
+/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var Pe;
+function yt() {
+  return Pe || (Pe = 1, process.env.NODE_ENV !== "production" && function() {
+    var l = O, d = Symbol.for("react.element"), b = Symbol.for("react.portal"), v = Symbol.for("react.fragment"), L = Symbol.for("react.strict_mode"), g = Symbol.for("react.profiler"), w = Symbol.for("react.provider"), n = Symbol.for("react.context"), o = Symbol.for("react.forward_ref"), D = Symbol.for("react.suspense"), p = Symbol.for("react.suspense_list"), y = Symbol.for("react.memo"), u = Symbol.for("react.lazy"), T = Symbol.for("react.offscreen"), h = Symbol.iterator, z = "@@iterator";
+    function R(e) {
+      if (e === null || typeof e != "object")
+        return null;
+      var t = h && e[h] || e[z];
+      return typeof t == "function" ? t : null;
+    }
+    var M = l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    function m(e) {
+      {
+        for (var t = arguments.length, r = new Array(t > 1 ? t - 1 : 0), a = 1; a < t; a++)
+          r[a - 1] = arguments[a];
+        E("error", e, r);
+      }
+    }
+    function E(e, t, r) {
+      {
+        var a = M.ReactDebugCurrentFrame, s = a.getStackAddendum();
+        s !== "" && (t += "%s", r = r.concat([s]));
+        var f = r.map(function(c) {
+          return String(c);
+        });
+        f.unshift("Warning: " + t), Function.prototype.apply.call(console[e], console, f);
+      }
+    }
+    var k = !1, Q = !1, Y = !1, W = !1, $ = !1, U;
+    U = Symbol.for("react.module.reference");
+    function B(e) {
+      return !!(typeof e == "string" || typeof e == "function" || e === v || e === g || $ || e === L || e === D || e === p || W || e === T || k || Q || Y || typeof e == "object" && e !== null && (e.$$typeof === u || e.$$typeof === y || e.$$typeof === w || e.$$typeof === n || e.$$typeof === o || e.$$typeof === U || e.getModuleId !== void 0));
+    }
+    function ne(e, t, r) {
+      var a = e.displayName;
+      if (a)
+        return a;
+      var s = t.displayName || t.name || "";
+      return s !== "" ? r + "(" + s + ")" : r;
+    }
+    function F(e) {
+      return e.displayName || "Context";
+    }
+    function j(e) {
+      if (e == null)
+        return null;
+      if (typeof e.tag == "number" && m("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof e == "function")
+        return e.displayName || e.name || null;
+      if (typeof e == "string")
+        return e;
+      switch (e) {
+        case v:
+          return "Fragment";
+        case b:
+          return "Portal";
+        case g:
+          return "Profiler";
+        case L:
+          return "StrictMode";
+        case D:
+          return "Suspense";
+        case p:
+          return "SuspenseList";
+      }
+      if (typeof e == "object")
+        switch (e.$$typeof) {
+          case n:
+            var t = e;
+            return F(t) + ".Consumer";
+          case w:
+            var r = e;
+            return F(r._context) + ".Provider";
+          case o:
+            return ne(e, e.render, "ForwardRef");
+          case y:
+            var a = e.displayName || null;
+            return a !== null ? a : j(e.type) || "Memo";
+          case u: {
+            var s = e, f = s._payload, c = s._init;
+            try {
+              return j(c(f));
+            } catch {
+              return null;
+            }
+          }
+        }
+      return null;
+    }
+    var P = Object.assign, G = 0, de, ge, Me, me, De, Ie, ve;
+    function Le() {
+    }
+    Le.__reactDisabledLog = !0;
+    function Qe() {
+      {
+        if (G === 0) {
+          de = console.log, ge = console.info, Me = console.warn, me = console.error, De = console.group, Ie = console.groupCollapsed, ve = console.groupEnd;
+          var e = {
+            configurable: !0,
+            enumerable: !0,
+            value: Le,
+            writable: !0
+          };
+          Object.defineProperties(console, {
+            info: e,
+            log: e,
+            warn: e,
+            error: e,
+            group: e,
+            groupCollapsed: e,
+            groupEnd: e
+          });
+        }
+        G++;
+      }
+    }
+    function Ye() {
+      {
+        if (G--, G === 0) {
+          var e = {
+            configurable: !0,
+            enumerable: !0,
+            writable: !0
+          };
+          Object.defineProperties(console, {
+            log: P({}, e, {
+              value: de
+            }),
+            info: P({}, e, {
+              value: ge
+            }),
+            warn: P({}, e, {
+              value: Me
+            }),
+            error: P({}, e, {
+              value: me
+            }),
+            group: P({}, e, {
+              value: De
+            }),
+            groupCollapsed: P({}, e, {
+              value: Ie
+            }),
+            groupEnd: P({}, e, {
+              value: ve
+            })
+          });
+        }
+        G < 0 && m("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
+      }
+    }
+    var ae = M.ReactCurrentDispatcher, oe;
+    function X(e, t, r) {
+      {
+        if (oe === void 0)
+          try {
+            throw Error();
+          } catch (s) {
+            var a = s.stack.trim().match(/\n( *(at )?)/);
+            oe = a && a[1] || "";
+          }
+        return `
+` + oe + e;
+      }
+    }
+    var ie = !1, K;
+    {
+      var Ze = typeof WeakMap == "function" ? WeakMap : Map;
+      K = new Ze();
+    }
+    function Ne(e, t) {
+      if (!e || ie)
+        return "";
+      {
+        var r = K.get(e);
+        if (r !== void 0)
+          return r;
+      }
+      var a;
+      ie = !0;
+      var s = Error.prepareStackTrace;
+      Error.prepareStackTrace = void 0;
+      var f;
+      f = ae.current, ae.current = null, Qe();
+      try {
+        if (t) {
+          var c = function() {
+            throw Error();
+          };
+          if (Object.defineProperty(c.prototype, "props", {
+            set: function() {
+              throw Error();
+            }
+          }), typeof Reflect == "object" && Reflect.construct) {
+            try {
+              Reflect.construct(c, []);
+            } catch (A) {
+              a = A;
+            }
+            Reflect.construct(e, [], c);
+          } else {
+            try {
+              c.call();
+            } catch (A) {
+              a = A;
+            }
+            e.call(c.prototype);
+          }
+        } else {
+          try {
+            throw Error();
+          } catch (A) {
+            a = A;
+          }
+          e();
+        }
+      } catch (A) {
+        if (A && a && typeof A.stack == "string") {
+          for (var i = A.stack.split(`
+`), S = a.stack.split(`
+`), I = i.length - 1, N = S.length - 1; I >= 1 && N >= 0 && i[I] !== S[N]; )
+            N--;
+          for (; I >= 1 && N >= 0; I--, N--)
+            if (i[I] !== S[N]) {
+              if (I !== 1 || N !== 1)
+                do
+                  if (I--, N--, N < 0 || i[I] !== S[N]) {
+                    var C = `
+` + i[I].replace(" at new ", " at ");
+                    return e.displayName && C.includes("<anonymous>") && (C = C.replace("<anonymous>", e.displayName)), typeof e == "function" && K.set(e, C), C;
+                  }
+                while (I >= 1 && N >= 0);
+              break;
+            }
+        }
+      } finally {
+        ie = !1, ae.current = f, Ye(), Error.prepareStackTrace = s;
+      }
+      var H = e ? e.displayName || e.name : "", xe = H ? X(H) : "";
+      return typeof e == "function" && K.set(e, xe), xe;
+    }
+    function He(e, t, r) {
+      return Ne(e, !1);
+    }
+    function _e(e) {
+      var t = e.prototype;
+      return !!(t && t.isReactComponent);
+    }
+    function q(e, t, r) {
+      if (e == null)
+        return "";
+      if (typeof e == "function")
+        return Ne(e, _e(e));
+      if (typeof e == "string")
+        return X(e);
+      switch (e) {
+        case D:
+          return X("Suspense");
+        case p:
+          return X("SuspenseList");
+      }
+      if (typeof e == "object")
+        switch (e.$$typeof) {
+          case o:
+            return He(e.render);
+          case y:
+            return q(e.type, t, r);
+          case u: {
+            var a = e, s = a._payload, f = a._init;
+            try {
+              return q(f(s), t, r);
+            } catch {
+            }
+          }
+        }
+      return "";
+    }
+    var ee = Object.prototype.hasOwnProperty, be = {}, we = M.ReactDebugCurrentFrame;
+    function te(e) {
+      if (e) {
+        var t = e._owner, r = q(e.type, e._source, t ? t.type : null);
+        we.setExtraStackFrame(r);
+      } else
+        we.setExtraStackFrame(null);
+    }
+    function Ue(e, t, r, a, s) {
+      {
+        var f = Function.call.bind(ee);
+        for (var c in e)
+          if (f(e, c)) {
+            var i = void 0;
+            try {
+              if (typeof e[c] != "function") {
+                var S = Error((a || "React class") + ": " + r + " type `" + c + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof e[c] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                throw S.name = "Invariant Violation", S;
+              }
+              i = e[c](t, c, a, r, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+            } catch (I) {
+              i = I;
+            }
+            i && !(i instanceof Error) && (te(s), m("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", a || "React class", r, c, typeof i), te(null)), i instanceof Error && !(i.message in be) && (be[i.message] = !0, te(s), m("Failed %s type: %s", r, i.message), te(null));
+          }
+      }
+    }
+    var Be = Array.isArray;
+    function ce(e) {
+      return Be(e);
+    }
+    function Ge(e) {
+      {
+        var t = typeof Symbol == "function" && Symbol.toStringTag, r = t && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return r;
+      }
+    }
+    function Je(e) {
+      try {
+        return je(e), !1;
+      } catch {
+        return !0;
+      }
+    }
+    function je(e) {
+      return "" + e;
+    }
+    function he(e) {
+      if (Je(e))
+        return m("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Ge(e)), je(e);
+    }
+    var J = M.ReactCurrentOwner, Ve = {
+      key: !0,
+      ref: !0,
+      __self: !0,
+      __source: !0
+    }, Se, Te, ue;
+    ue = {};
+    function We(e) {
+      if (ee.call(e, "ref")) {
+        var t = Object.getOwnPropertyDescriptor(e, "ref").get;
+        if (t && t.isReactWarning)
+          return !1;
+      }
+      return e.ref !== void 0;
+    }
+    function $e(e) {
+      if (ee.call(e, "key")) {
+        var t = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (t && t.isReactWarning)
+          return !1;
+      }
+      return e.key !== void 0;
+    }
+    function Fe(e, t) {
+      if (typeof e.ref == "string" && J.current && t && J.current.stateNode !== t) {
+        var r = j(J.current.type);
+        ue[r] || (m('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', j(J.current.type), e.ref), ue[r] = !0);
+      }
+    }
+    function Xe(e, t) {
+      {
+        var r = function() {
+          Se || (Se = !0, m("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", t));
+        };
+        r.isReactWarning = !0, Object.defineProperty(e, "key", {
+          get: r,
+          configurable: !0
+        });
+      }
+    }
+    function Ke(e, t) {
+      {
+        var r = function() {
+          Te || (Te = !0, m("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", t));
+        };
+        r.isReactWarning = !0, Object.defineProperty(e, "ref", {
+          get: r,
+          configurable: !0
+        });
+      }
+    }
+    var qe = function(e, t, r, a, s, f, c) {
+      var i = {
+        $$typeof: d,
+        type: e,
+        key: t,
+        ref: r,
+        props: c,
+        _owner: f
+      };
+      return i._store = {}, Object.defineProperty(i._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: !1
+      }), Object.defineProperty(i, "_self", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !1,
+        value: a
+      }), Object.defineProperty(i, "_source", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !1,
+        value: s
+      }), Object.freeze && (Object.freeze(i.props), Object.freeze(i)), i;
+    };
+    function et(e, t, r, a, s) {
+      {
+        var f, c = {}, i = null, S = null;
+        r !== void 0 && (he(r), i = "" + r), $e(t) && (he(t.key), i = "" + t.key), We(t) && (S = t.ref, Fe(t, s));
+        for (f in t)
+          ee.call(t, f) && !Ve.hasOwnProperty(f) && (c[f] = t[f]);
+        if (e && e.defaultProps) {
+          var I = e.defaultProps;
+          for (f in I)
+            c[f] === void 0 && (c[f] = I[f]);
+        }
+        if (i || S) {
+          var N = typeof e == "function" ? e.displayName || e.name || "Unknown" : e;
+          i && Xe(c, N), S && Ke(c, N);
+        }
+        return qe(e, i, S, s, a, J.current, c);
+      }
+    }
+    var se = M.ReactCurrentOwner, ze = M.ReactDebugCurrentFrame;
+    function Z(e) {
+      if (e) {
+        var t = e._owner, r = q(e.type, e._source, t ? t.type : null);
+        ze.setExtraStackFrame(r);
+      } else
+        ze.setExtraStackFrame(null);
+    }
+    var le;
+    le = !1;
+    function fe(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === d;
+    }
+    function Ee() {
+      {
+        if (se.current) {
+          var e = j(se.current.type);
+          if (e)
+            return `
+
+Check the render method of \`` + e + "`.";
+        }
+        return "";
+      }
+    }
+    function tt(e) {
+      {
+        if (e !== void 0) {
+          var t = e.fileName.replace(/^.*[\\\/]/, ""), r = e.lineNumber;
+          return `
+
+Check your code at ` + t + ":" + r + ".";
+        }
+        return "";
+      }
+    }
+    var Ce = {};
+    function rt(e) {
+      {
+        var t = Ee();
+        if (!t) {
+          var r = typeof e == "string" ? e : e.displayName || e.name;
+          r && (t = `
+
+Check the top-level render call using <` + r + ">.");
+        }
+        return t;
+      }
+    }
+    function ke(e, t) {
+      {
+        if (!e._store || e._store.validated || e.key != null)
+          return;
+        e._store.validated = !0;
+        var r = rt(t);
+        if (Ce[r])
+          return;
+        Ce[r] = !0;
+        var a = "";
+        e && e._owner && e._owner !== se.current && (a = " It was passed a child from " + j(e._owner.type) + "."), Z(e), m('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', r, a), Z(null);
+      }
+    }
+    function Oe(e, t) {
+      {
+        if (typeof e != "object")
+          return;
+        if (ce(e))
+          for (var r = 0; r < e.length; r++) {
+            var a = e[r];
+            fe(a) && ke(a, t);
+          }
+        else if (fe(e))
+          e._store && (e._store.validated = !0);
+        else if (e) {
+          var s = R(e);
+          if (typeof s == "function" && s !== e.entries)
+            for (var f = s.call(e), c; !(c = f.next()).done; )
+              fe(c.value) && ke(c.value, t);
+        }
+      }
+    }
+    function nt(e) {
+      {
+        var t = e.type;
+        if (t == null || typeof t == "string")
+          return;
+        var r;
+        if (typeof t == "function")
+          r = t.propTypes;
+        else if (typeof t == "object" && (t.$$typeof === o || t.$$typeof === y))
+          r = t.propTypes;
+        else
+          return;
+        if (r) {
+          var a = j(t);
+          Ue(r, e.props, "prop", a, e);
+        } else if (t.PropTypes !== void 0 && !le) {
+          le = !0;
+          var s = j(t);
+          m("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", s || "Unknown");
+        }
+        typeof t.getDefaultProps == "function" && !t.getDefaultProps.isReactClassApproved && m("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
+      }
+    }
+    function at(e) {
+      {
+        for (var t = Object.keys(e.props), r = 0; r < t.length; r++) {
+          var a = t[r];
+          if (a !== "children" && a !== "key") {
+            Z(e), m("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", a), Z(null);
+            break;
+          }
+        }
+        e.ref !== null && (Z(e), m("Invalid attribute `ref` supplied to `React.Fragment`."), Z(null));
+      }
+    }
+    function Ae(e, t, r, a, s, f) {
+      {
+        var c = B(e);
+        if (!c) {
+          var i = "";
+          (e === void 0 || typeof e == "object" && e !== null && Object.keys(e).length === 0) && (i += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
+          var S = tt(s);
+          S ? i += S : i += Ee();
+          var I;
+          e === null ? I = "null" : ce(e) ? I = "array" : e !== void 0 && e.$$typeof === d ? (I = "<" + (j(e.type) || "Unknown") + " />", i = " Did you accidentally export a JSX literal instead of a component?") : I = typeof e, m("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", I, i);
+        }
+        var N = et(e, t, r, s, f);
+        if (N == null)
+          return N;
+        if (c) {
+          var C = t.children;
+          if (C !== void 0)
+            if (a)
+              if (ce(C)) {
+                for (var H = 0; H < C.length; H++)
+                  Oe(C[H], e);
+                Object.freeze && Object.freeze(C);
+              } else
+                m("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
+            else
+              Oe(C, e);
+        }
+        return e === v ? at(N) : nt(N), N;
+      }
+    }
+    function ot(e, t, r) {
+      return Ae(e, t, r, !0);
+    }
+    function it(e, t, r) {
+      return Ae(e, t, r, !1);
+    }
+    var ct = it, ut = ot;
+    re.Fragment = v, re.jsx = ct, re.jsxs = ut;
+  }()), re;
+}
+process.env.NODE_ENV === "production" ? pe.exports = ft() : pe.exports = yt();
+var pt = pe.exports;
+const dt = (l, d, b, v) => {
+  let L = d / (b + v), g = Math.floor(l.length / L);
+  L > l.length && (L = l.length, g = 1);
+  const w = [];
+  for (let n = 0; n < L; n++) {
+    let o = 0;
+    for (let D = 0; D < g && n * g + D < l.length; D++)
+      o += l[n * g + D];
+    w.push(o / g);
+  }
+  return w;
+}, gt = (l, d, b, v, L, g) => {
+  const w = d.height / 2, n = d.getContext("2d");
+  n && (n.clearRect(0, 0, d.width, d.height), L !== "transparent" && (n.fillStyle = L, n.fillRect(0, 0, d.width, d.height)), l.forEach((o, D) => {
+    n.fillStyle = g;
+    const p = D * (b + v), y = w - o / 2, u = b, T = o || 1;
+    n.beginPath(), n.roundRect(p, y, u, T, 50), n.fill();
+  }));
+}, Mt = ({
+  mediaRecorder: l,
+  width: d = "100%",
+  height: b = "100%",
+  barWidth: v = 2,
+  gap: L = 1,
+  backgroundColor: g = "transparent",
+  barColor: w = "rgb(160, 198, 255)",
+  fftSize: n = 1024,
+  maxDecibels: o = -10,
+  minDecibels: D = -90,
+  smoothingTimeConstant: p = 0.4
+}) => {
+  const [y] = x(() => new AudioContext()), [u, T] = x(), h = st(null);
+  ye(() => {
+    if (!l.stream)
+      return;
+    const M = y.createAnalyser();
+    T(M), M.fftSize = n, M.minDecibels = D, M.maxDecibels = o, M.smoothingTimeConstant = p, y.createMediaStreamSource(l.stream).connect(M);
+  }, [l.stream]), ye(() => {
+    (u != null ? u : l.state === "recording") && z();
+  }, [u, l.state]);
+  const z = _(() => {
+    if (!u)
+      return;
+    const M = new Uint8Array(u == null ? void 0 : u.frequencyBinCount);
+    l.state === "recording" ? (u == null || u.getByteFrequencyData(M), R(M), requestAnimationFrame(z)) : l.state === "paused" ? R(M) : l.state === "inactive" && y.state !== "closed" && y.close();
+  }, [u]), R = (M) => {
+    if (!h.current)
+      return;
+    const m = dt(
+      M,
+      h.current.width,
+      v,
+      L
+    );
+    gt(
+      m,
+      h.current,
+      v,
+      L,
+      g,
+      w
+    );
+  };
+  return /* @__PURE__ */ pt.jsx(
+    "canvas",
+    {
+      ref: h,
+      width: d,
+      height: b,
+      style: {
+        aspectRatio: "unset"
+      }
+    }
+  );
+}, mt = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDQ3MCA0NzAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ3MCA0NzA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCgk8Zz4NCgkJPHBhdGggZD0iTTIzNSwzMDIuMjk2YzQ3LjE3NywwLDg1LjQyMy0zOC4yNDUsODUuNDIzLTg1LjQyM1Y4NS40MjNDMzIwLjQyMywzOC4yNDUsMjgyLjE3NywwLDIzNSwwcy04NS40MjMsMzguMjQ1LTg1LjQyMyw4NS40MjMNCgkJCXYxMzEuNDUxQzE0OS41NzcsMjY0LjA1MSwxODcuODIzLDMwMi4yOTYsMjM1LDMwMi4yOTZ6Ii8+DQoJCTxwYXRoIGQ9Ik0zNTAuNDIzLDEzNi4xNDh2MzBoMTV2NTAuNzI2YzAsNzEuOTE1LTU4LjUwOCwxMzAuNDIzLTEzMC40MjMsMTMwLjQyM3MtMTMwLjQyMy01OC41MDctMTMwLjQyMy0xMzAuNDIzdi01MC43MjZoMTV2LTMwDQoJCQloLTQ1djgwLjcyNkM3NC41NzcsMzAwLjI3MywxMzguNTUxLDM2OSwyMjAsMzc2LjU4OVY0NDBoLTkwLjQ0NHYzMGgyMTAuODg5di0zMEgyNTB2LTYzLjQxMQ0KCQkJYzgxLjQ0OS03LjU4OSwxNDUuNDIzLTc2LjMxNywxNDUuNDIzLTE1OS43MTZ2LTgwLjcyNkgzNTAuNDIzeiIvPg0KCTwvZz4NCjwvc3ZnPg0K", Dt = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNDcuNjA3IDQ3LjYwNyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDcuNjA3IDQ3LjYwNzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KCTxnPg0KCQk8cGF0aCBkPSJNMTcuOTkxLDQwLjk3NmMwLDMuNjYyLTIuOTY5LDYuNjMxLTYuNjMxLDYuNjMxbDAsMGMtMy42NjIsMC02LjYzMS0yLjk2OS02LjYzMS02LjYzMVY2LjYzMUM0LjcyOSwyLjk2OSw3LjY5OCwwLDExLjM2LDANCgkJCWwwLDBjMy42NjIsMCw2LjYzMSwyLjk2OSw2LjYzMSw2LjYzMVY0MC45NzZ6Ii8+DQoJCTxwYXRoIGQ9Ik00Mi44NzcsNDAuOTc2YzAsMy42NjItMi45NjksNi42MzEtNi42MzEsNi42MzFsMCwwYy0zLjY2MiwwLTYuNjMxLTIuOTY5LTYuNjMxLTYuNjMxVjYuNjMxDQoJCQlDMjkuNjE2LDIuOTY5LDMyLjU4NSwwLDM2LjI0NiwwbDAsMGMzLjY2MiwwLDYuNjMxLDIuOTY5LDYuNjMxLDYuNjMxVjQwLjk3NnoiLz4NCgk8L2c+DQo8L3N2Zz4NCg==", It = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDQ5NC4xNDggNDk0LjE0OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDk0LjE0OCA0OTQuMTQ4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQoJPGc+DQoJCTxnPg0KCQkJPHBhdGggZD0iTTQwNS4yODQsMjAxLjE4OEwxMzAuODA0LDEzLjI4QzExOC4xMjgsNC41OTYsMTA1LjM1NiwwLDk0Ljc0LDBDNzQuMjE2LDAsNjEuNTIsMTYuNDcyLDYxLjUyLDQ0LjA0NHY0MDYuMTI0DQoJCQkJYzAsMjcuNTQsMTIuNjgsNDMuOTgsMzMuMTU2LDQzLjk4YzEwLjYzMiwwLDIzLjItNC42LDM1LjkwNC0xMy4zMDhsMjc0LjYwOC0xODcuOTA0YzE3LjY2LTEyLjEwNCwyNy40NC0yOC4zOTIsMjcuNDQtNDUuODg0DQoJCQkJQzQzMi42MzIsMjI5LjU3Miw0MjIuOTY0LDIxMy4yODgsNDA1LjI4NCwyMDEuMTg4eiIvPg0KCQk8L2c+DQoJPC9nPg0KPC9zdmc+DQo=", vt = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMThweCIgaGVpZ2h0PSIxOHB4IiB2aWV3Qm94PSIwIDAgMTggMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+DQogIDxwYXRoIGZpbGw9IiMwMDAwMDAiIGQ9Ik0xNy44NSAzLjE1bC0yLjk5LTNBLjUwOC41MDggMCAwIDAgMTQuNSAwSDEuNEExLjQxNyAxLjQxNyAwIDAgMCAwIDEuNDN2MTUuMTRBMS40MTcgMS40MTcgMCAwIDAgMS40IDE4aDE1LjJhMS40MTcgMS40MTcgMCAwIDAgMS40LTEuNDNWMy41YS40Ny40NyAwIDAgMC0uMTUtLjM1ek0yIDVWM2ExIDEgMCAwIDEgMS0xaDhhMSAxIDAgMCAxIDEgMXYyYTEgMSAwIDAgMS0xIDFIM2ExIDEgMCAwIDEtMS0xem03IDExYTQgNCAwIDEgMSA0LTQgNCA0IDAgMCAxLTQgNHoiLz4NCjwvc3ZnPg0K", Lt = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNDYuNzM0IDQ2LjczNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDYuNzM0IDQ2LjczNDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZD0iTTQxLjM0NiwwSDUuMzg4QzIuNDE3LDAsMCwyLjQxNywwLDUuMzg4djM1Ljk1OGMwLDIuOTcxLDIuNDE3LDUuMzg4LDUuMzg4LDUuMzg4aDM1Ljk1OGMyLjk3MSwwLDUuMzg4LTIuNDE3LDUuMzg4LTUuMzg4DQoJCVY1LjM4OEM0Ni43MzMsMi40MTcsNDQuMzE2LDAsNDEuMzQ2LDB6Ii8+DQo8L2c+DQo8L3N2Zz4NCg==";
+const bt = ({
+  onRecordingComplete: l,
   onNotAllowedOrFound: d,
-  recorderControls: w,
-  audioTrackConstraints: D,
-  downloadOnSavePress: s = !1,
-  downloadFileExtension: t = "mp3",
-  classes: M
+  recorderControls: b,
+  audioTrackConstraints: v,
+  downloadOnSavePress: L = !1,
+  downloadFileExtension: g = "mp3",
+  showVisualizer: w = !1,
+  classes: n
 }) => {
-  var r, e, N, A, n, v;
+  var k, Q, Y, W, $, U;
   const {
-    startRecording: a,
-    stopRecording: i,
-    togglePauseResume: o,
-    recordingBlob: c,
-    isRecording: g,
-    isPaused: y,
-    recordingTime: S
-  } = w != null ? w : Q(D, d), [z, C] = j(!1), T = (x = !0) => {
-    C(x), i();
-  }, l = (x) => {
-    const b = new Blob([x], {
-      type: `audio/${t}`
-    }), Y = URL.createObjectURL(b), u = document.createElement("a");
-    u.style.display = "none", u.href = Y, u.download = `audio.${t}`, document.body.appendChild(u), u.click(), u.remove();
+    startRecording: o,
+    stopRecording: D,
+    togglePauseResume: p,
+    recordingBlob: y,
+    isRecording: u,
+    isPaused: T,
+    recordingTime: h,
+    mediaRecorder: z
+  } = b != null ? b : lt(v, d), [R, M] = x(!1), m = (B = !0) => {
+    M(B), D();
+  }, E = (B) => {
+    const ne = new Blob([B], {
+      type: `audio/${g}`
+    }), F = URL.createObjectURL(ne), j = document.createElement("a");
+    j.style.display = "none", j.href = F, j.download = `audio.${g}`, document.body.appendChild(j), j.click(), j.remove();
   };
-  return k(() => {
-    (z || w) && c != null && I != null && (I(c), s && l(c));
-  }, [c]), /* @__PURE__ */ L.createElement("div", {
-    className: `audio-recorder ${g ? "recording" : ""} ${(r = M == null ? void 0 : M.AudioRecorderClass) != null ? r : ""}`,
-    "data-testid": "audio_recorder"
-  }, /* @__PURE__ */ L.createElement("img", {
-    src: g ? O : B,
-    className: `audio-recorder-mic ${(e = M == null ? void 0 : M.AudioRecorderStartSaveClass) != null ? e : ""}`,
-    onClick: g ? () => T() : a,
-    "data-testid": "ar_mic",
-    title: g ? "Save recording" : "Start recording"
-  }), /* @__PURE__ */ L.createElement("span", {
-    className: `audio-recorder-timer ${g ? "" : "display-none"} ${(N = M == null ? void 0 : M.AudioRecorderTimerClass) != null ? N : ""}`,
-    "data-testid": "ar_timer"
-  }, Math.floor(S / 60), ":", String(S % 60).padStart(2, "0")), /* @__PURE__ */ L.createElement("span", {
-    className: `audio-recorder-status ${g ? "" : "display-none"} ${(A = M == null ? void 0 : M.AudioRecorderStatusClass) != null ? A : ""}`
-  }, /* @__PURE__ */ L.createElement("span", {
-    className: "audio-recorder-status-dot"
-  }), "Recording"), /* @__PURE__ */ L.createElement("img", {
-    src: y ? E : Z,
-    className: `audio-recorder-options ${g ? "" : "display-none"} ${(n = M == null ? void 0 : M.AudioRecorderPauseResumeClass) != null ? n : ""}`,
-    onClick: o,
-    title: y ? "Resume recording" : "Pause recording",
-    "data-testid": "ar_pause"
-  }), /* @__PURE__ */ L.createElement("img", {
-    src: W,
-    className: `audio-recorder-options ${g ? "" : "display-none"} ${(v = M == null ? void 0 : M.AudioRecorderDiscardClass) != null ? v : ""}`,
-    onClick: () => T(!1),
-    title: "Discard Recording",
-    "data-testid": "ar_cancel"
-  }));
+  return ye(() => {
+    (R || b) && y != null && l != null && (l(y), L && E(y));
+  }, [y]), /* @__PURE__ */ O.createElement(
+    "div",
+    {
+      className: `audio-recorder ${u ? "recording" : ""} ${(k = n == null ? void 0 : n.AudioRecorderClass) != null ? k : ""}`,
+      "data-testid": "audio_recorder"
+    },
+    /* @__PURE__ */ O.createElement(
+      "img",
+      {
+        src: u ? vt : mt,
+        className: `audio-recorder-mic ${(Q = n == null ? void 0 : n.AudioRecorderStartSaveClass) != null ? Q : ""}`,
+        onClick: u ? () => m() : o,
+        "data-testid": "ar_mic",
+        title: u ? "Save recording" : "Start recording"
+      }
+    ),
+    /* @__PURE__ */ O.createElement(
+      "span",
+      {
+        className: `audio-recorder-timer ${u ? "" : "display-none"} ${(Y = n == null ? void 0 : n.AudioRecorderTimerClass) != null ? Y : ""}`,
+        "data-testid": "ar_timer"
+      },
+      Math.floor(h / 60),
+      ":",
+      String(h % 60).padStart(2, "0")
+    ),
+    w ? /* @__PURE__ */ O.createElement("span", { className: `audio-recorder-visualizer ${u ? "" : "display-none"}` }, z && /* @__PURE__ */ O.createElement(
+      Mt,
+      {
+        mediaRecorder: z,
+        barWidth: 2,
+        gap: 2,
+        width: 140,
+        height: 30,
+        fftSize: 512,
+        maxDecibels: -10,
+        minDecibels: -80,
+        smoothingTimeConstant: 0.4
+      }
+    )) : /* @__PURE__ */ O.createElement(
+      "span",
+      {
+        className: `audio-recorder-status ${u ? "" : "display-none"} ${(W = n == null ? void 0 : n.AudioRecorderStatusClass) != null ? W : ""}`
+      },
+      /* @__PURE__ */ O.createElement("span", { className: "audio-recorder-status-dot" }),
+      "Recording"
+    ),
+    /* @__PURE__ */ O.createElement(
+      "img",
+      {
+        src: T ? It : Dt,
+        className: `audio-recorder-options ${u ? "" : "display-none"} ${($ = n == null ? void 0 : n.AudioRecorderPauseResumeClass) != null ? $ : ""}`,
+        onClick: p,
+        title: T ? "Resume recording" : "Pause recording",
+        "data-testid": "ar_pause"
+      }
+    ),
+    /* @__PURE__ */ O.createElement(
+      "img",
+      {
+        src: Lt,
+        className: `audio-recorder-options ${u ? "" : "display-none"} ${(U = n == null ? void 0 : n.AudioRecorderDiscardClass) != null ? U : ""}`,
+        onClick: () => m(!1),
+        title: "Discard Recording",
+        "data-testid": "ar_cancel"
+      }
+    )
+  );
 };
 export {
-  R as AudioRecorder,
-  Q as useAudioRecorder
+  bt as AudioRecorder,
+  lt as useAudioRecorder
 };

dist/react-audio-voice-recorder.umd.js

@@ -1,2 +0,28 @@
-(function(){"use strict";(r=>{try{if(typeof window>"u")return;var e=document.createElement("style");e.appendChild(document.createTextNode(r)),document.head.appendChild(e)}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})(".audio-recorder{background-color:#ebebeb;box-shadow:0 2px 5px #bebebe;border-radius:20px;box-sizing:border-box;color:#000;width:40px;display:flex;align-items:center;transition:all .2s ease-in;-webkit-tap-highlight-color:transparent}.audio-recorder-mic{box-sizing:content-box;cursor:pointer;height:16px;color:#000;padding:12px}.audio-recorder .audio-recorder-mic{border-radius:20px}.audio-recorder.recording .audio-recorder-mic{border-radius:0}.audio-recorder-timer,.audio-recorder-status{color:#000;margin-left:10px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:14px;font-weight:400;line-height:1}.audio-recorder-status{margin-left:15px;display:flex;align-items:baseline;flex-grow:1;animation-name:fading-ar-status;animation-duration:2s;animation-iteration-count:infinite}.audio-recorder-status-dot{background-color:#d00;border-radius:50%;height:10px;width:9px;margin-right:5px}.audio-recorder-options{box-sizing:content-box;height:16px;cursor:pointer;padding:12px 6px 12px 12px}.audio-recorder-options~.audio-recorder-options{padding:12px 12px 12px 6px;border-radius:0 5px 5px 0}.recording{border-radius:12px;width:300px;transition:all .2s ease-out}.display-none{display:none}@keyframes fading-ar-status{0%{opacity:1}50%{opacity:0}to{opacity:1}}")})();
-(function(L,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],e):(L=typeof globalThis<"u"?globalThis:L||self,e(L.AudioRecorder={},L.React))})(this,function(L,e){"use strict";const u=(g=>g&&typeof g=="object"&&"default"in g?g:{default:g})(e),v=(g,I)=>{const[a,w]=e.useState(!1),[y,j]=e.useState(!1),[M,o]=e.useState(0),[i,C]=e.useState(),[c,t]=e.useState(),[m,S]=e.useState(),D=e.useCallback(()=>{const d=setInterval(()=>{o(N=>N+1)},1e3);t(d)},[o,t]),s=e.useCallback(()=>{c!=null&&clearInterval(c),t(void 0)},[c,t]),r=e.useCallback(()=>{c==null&&navigator.mediaDevices.getUserMedia({audio:g!=null?g:!0}).then(d=>{w(!0);const N=new MediaRecorder(d);C(N),N.start(),D(),N.addEventListener("dataavailable",n=>{S(n.data),N.stream.getTracks().forEach(T=>T.stop()),C(void 0)})}).catch(d=>{console.log(d.name,d.message,d.cause),I==null||I(d)})},[c,w,C,D,S,I]),A=e.useCallback(()=>{i==null||i.stop(),s(),o(0),w(!1),j(!1)},[i,o,w,j,s]),l=e.useCallback(()=>{y?(j(!1),i==null||i.resume(),D()):(j(!0),s(),i==null||i.pause())},[i,j,D,s]);return{startRecording:r,stopRecording:A,togglePauseResume:l,recordingBlob:m,isRecording:a,isPaused:y,recordingTime:M,mediaRecorder:i}},Y="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgdmlld0JveD0iMCAwIDQ3MCA0NzAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ3MCA0NzA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KCTxnPgoJCTxwYXRoIGQ9Ik0yMzUsMzAyLjI5NmM0Ny4xNzcsMCw4NS40MjMtMzguMjQ1LDg1LjQyMy04NS40MjNWODUuNDIzQzMyMC40MjMsMzguMjQ1LDI4Mi4xNzcsMCwyMzUsMHMtODUuNDIzLDM4LjI0NS04NS40MjMsODUuNDIzCgkJCXYxMzEuNDUxQzE0OS41NzcsMjY0LjA1MSwxODcuODIzLDMwMi4yOTYsMjM1LDMwMi4yOTZ6Ii8+CgkJPHBhdGggZD0iTTM1MC40MjMsMTM2LjE0OHYzMGgxNXY1MC43MjZjMCw3MS45MTUtNTguNTA4LDEzMC40MjMtMTMwLjQyMywxMzAuNDIzcy0xMzAuNDIzLTU4LjUwNy0xMzAuNDIzLTEzMC40MjN2LTUwLjcyNmgxNXYtMzAKCQkJaC00NXY4MC43MjZDNzQuNTc3LDMwMC4yNzMsMTM4LjU1MSwzNjksMjIwLDM3Ni41ODlWNDQwaC05MC40NDR2MzBoMjEwLjg4OXYtMzBIMjUwdi02My40MTEKCQkJYzgxLjQ0OS03LjU4OSwxNDUuNDIzLTc2LjMxNywxNDUuNDIzLTE1OS43MTZ2LTgwLjcyNkgzNTAuNDIzeiIvPgoJPC9nPgo8L3N2Zz4K",k="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNDcuNjA3IDQ3LjYwNyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDcuNjA3IDQ3LjYwNzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgoJPGc+CgkJPHBhdGggZD0iTTE3Ljk5MSw0MC45NzZjMCwzLjY2Mi0yLjk2OSw2LjYzMS02LjYzMSw2LjYzMWwwLDBjLTMuNjYyLDAtNi42MzEtMi45NjktNi42MzEtNi42MzFWNi42MzFDNC43MjksMi45NjksNy42OTgsMCwxMS4zNiwwCgkJCWwwLDBjMy42NjIsMCw2LjYzMSwyLjk2OSw2LjYzMSw2LjYzMVY0MC45NzZ6Ii8+CgkJPHBhdGggZD0iTTQyLjg3Nyw0MC45NzZjMCwzLjY2Mi0yLjk2OSw2LjYzMS02LjYzMSw2LjYzMWwwLDBjLTMuNjYyLDAtNi42MzEtMi45NjktNi42MzEtNi42MzFWNi42MzEKCQkJQzI5LjYxNiwyLjk2OSwzMi41ODUsMCwzNi4yNDYsMGwwLDBjMy42NjIsMCw2LjYzMSwyLjk2OSw2LjYzMSw2LjYzMVY0MC45NzZ6Ii8+Cgk8L2c+Cjwvc3ZnPgo=",Q="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiCgkgdmlld0JveD0iMCAwIDQ5NC4xNDggNDk0LjE0OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDk0LjE0OCA0OTQuMTQ4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+Cgk8Zz4KCQk8Zz4KCQkJPHBhdGggZD0iTTQwNS4yODQsMjAxLjE4OEwxMzAuODA0LDEzLjI4QzExOC4xMjgsNC41OTYsMTA1LjM1NiwwLDk0Ljc0LDBDNzQuMjE2LDAsNjEuNTIsMTYuNDcyLDYxLjUyLDQ0LjA0NHY0MDYuMTI0CgkJCQljMCwyNy41NCwxMi42OCw0My45OCwzMy4xNTYsNDMuOThjMTAuNjMyLDAsMjMuMi00LjYsMzUuOTA0LTEzLjMwOGwyNzQuNjA4LTE4Ny45MDRjMTcuNjYtMTIuMTA0LDI3LjQ0LTI4LjM5MiwyNy40NC00NS44ODQKCQkJCUM0MzIuNjMyLDIyOS41NzIsNDIyLjk2NCwyMTMuMjg4LDQwNS4yODQsMjAxLjE4OHoiLz4KCQk8L2c+Cgk8L2c+Cjwvc3ZnPgo=",B="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMThweCIgaGVpZ2h0PSIxOHB4IiB2aWV3Qm94PSIwIDAgMTggMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZmlsbD0iIzAwMDAwMCIgZD0iTTE3Ljg1IDMuMTVsLTIuOTktM0EuNTA4LjUwOCAwIDAgMCAxNC41IDBIMS40QTEuNDE3IDEuNDE3IDAgMCAwIDAgMS40M3YxNS4xNEExLjQxNyAxLjQxNyAwIDAgMCAxLjQgMThoMTUuMmExLjQxNyAxLjQxNyAwIDAgMCAxLjQtMS40M1YzLjVhLjQ3LjQ3IDAgMCAwLS4xNS0uMzV6TTIgNVYzYTEgMSAwIDAgMSAxLTFoOGExIDEgMCAwIDEgMSAxdjJhMSAxIDAgMCAxLTEgMUgzYTEgMSAwIDAgMS0xLTF6bTcgMTFhNCA0IDAgMSAxIDQtNCA0IDQgMCAwIDEtNCA0eiIvPgo8L3N2Zz4K",O="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTkuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNDYuNzM0IDQ2LjczNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDYuNzM0IDQ2LjczNDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8Zz4KCTxwYXRoIGQ9Ik00MS4zNDYsMEg1LjM4OEMyLjQxNywwLDAsMi40MTcsMCw1LjM4OHYzNS45NThjMCwyLjk3MSwyLjQxNyw1LjM4OCw1LjM4OCw1LjM4OGgzNS45NThjMi45NzEsMCw1LjM4OC0yLjQxNyw1LjM4OC01LjM4OAoJCVY1LjM4OEM0Ni43MzMsMi40MTcsNDQuMzE2LDAsNDEuMzQ2LDB6Ii8+CjwvZz4KPC9zdmc+Cg==",P="",Z=({onRecordingComplete:g,onNotAllowedOrFound:I,recorderControls:a,audioTrackConstraints:w,downloadOnSavePress:y=!1,downloadFileExtension:j="mp3",classes:M})=>{var l,d,N,n,T,x;const{startRecording:o,stopRecording:i,togglePauseResume:C,recordingBlob:c,isRecording:t,isPaused:m,recordingTime:S}=a!=null?a:v(w,I),[D,s]=e.useState(!1),r=(b=!0)=>{s(b),i()},A=b=>{const E=new Blob([b],{type:`audio/${j}`}),W=URL.createObjectURL(E),z=document.createElement("a");z.style.display="none",z.href=W,z.download=`audio.${j}`,document.body.appendChild(z),z.click(),z.remove()};return e.useEffect(()=>{(D||a)&&c!=null&&g!=null&&(g(c),y&&A(c))},[c]),u.default.createElement("div",{className:`audio-recorder ${t?"recording":""} ${(l=M==null?void 0:M.AudioRecorderClass)!=null?l:""}`,"data-testid":"audio_recorder"},u.default.createElement("img",{src:t?B:Y,className:`audio-recorder-mic ${(d=M==null?void 0:M.AudioRecorderStartSaveClass)!=null?d:""}`,onClick:t?()=>r():o,"data-testid":"ar_mic",title:t?"Save recording":"Start recording"}),u.default.createElement("span",{className:`audio-recorder-timer ${t?"":"display-none"} ${(N=M==null?void 0:M.AudioRecorderTimerClass)!=null?N:""}`,"data-testid":"ar_timer"},Math.floor(S/60),":",String(S%60).padStart(2,"0")),u.default.createElement("span",{className:`audio-recorder-status ${t?"":"display-none"} ${(n=M==null?void 0:M.AudioRecorderStatusClass)!=null?n:""}`},u.default.createElement("span",{className:"audio-recorder-status-dot"}),"Recording"),u.default.createElement("img",{src:m?Q:k,className:`audio-recorder-options ${t?"":"display-none"} ${(T=M==null?void 0:M.AudioRecorderPauseResumeClass)!=null?T:""}`,onClick:C,title:m?"Resume recording":"Pause recording","data-testid":"ar_pause"}),u.default.createElement("img",{src:O,className:`audio-recorder-options ${t?"":"display-none"} ${(x=M==null?void 0:M.AudioRecorderDiscardClass)!=null?x:""}`,onClick:()=>r(!1),title:"Discard Recording","data-testid":"ar_cancel"}))};L.AudioRecorder=Z,L.useAudioRecorder=v,Object.defineProperties(L,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(){"use strict";(r=>{try{if(typeof window>"u")return;var e=document.createElement("style");e.appendChild(document.createTextNode(r)),document.head.appendChild(e)}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})(".audio-recorder{background-color:#ebebeb;box-shadow:0 2px 5px #bebebe;border-radius:20px;box-sizing:border-box;color:#000;width:40px;display:flex;align-items:center;transition:all .2s ease-in;-webkit-tap-highlight-color:transparent}.audio-recorder-mic{box-sizing:content-box;cursor:pointer;height:16px;color:#000;padding:12px}.audio-recorder .audio-recorder-mic{border-radius:20px}.audio-recorder.recording .audio-recorder-mic{border-radius:0}.audio-recorder-timer,.audio-recorder-status{color:#000;margin-left:10px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:14px;font-weight:400;line-height:1}.audio-recorder-status{margin-left:15px;display:flex;align-items:baseline;flex-grow:1;animation-name:fading-ar-status;animation-duration:2s;animation-iteration-count:infinite}.audio-recorder-status-dot{background-color:#d00;border-radius:50%;height:10px;width:9px;margin-right:5px}.audio-recorder-options{box-sizing:content-box;height:16px;cursor:pointer;padding:12px 6px 12px 12px}.audio-recorder-options~.audio-recorder-options{padding:12px 12px 12px 6px;border-radius:0 5px 5px 0}.recording{border-radius:12px;width:300px;transition:all .2s ease-out}.display-none{display:none}.audio-recorder-visualizer{margin-left:15px;flex-grow:1;align-self:center;display:flex;align-items:center}@keyframes fading-ar-status{0%{opacity:1}50%{opacity:0}to{opacity:1}}")})();
+(function(P,p){typeof exports=="object"&&typeof module<"u"?p(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],p):(P=typeof globalThis<"u"?globalThis:P||self,p(P.AudioRecorder={},P.React))})(this,function(P,p){"use strict";const O=(u=>u&&typeof u=="object"&&"default"in u?u:{default:u})(p),ye=(u,g)=>{const[w,L]=p.useState(!1),[b,M]=p.useState(!1),[j,n]=p.useState(0),[o,I]=p.useState(),[y,d]=p.useState(),[s,z]=p.useState(),S=p.useCallback(()=>{const E=setInterval(()=>{n(A=>A+1)},1e3);d(E)},[n,d]),C=p.useCallback(()=>{y!=null&&clearInterval(y),d(void 0)},[y,d]),Q=p.useCallback(()=>{y==null&&navigator.mediaDevices.getUserMedia({audio:u!=null?u:!0}).then(E=>{L(!0);const A=new MediaRecorder(E);I(A),A.start(),S(),A.addEventListener("dataavailable",R=>{z(R.data),A.stream.getTracks().forEach(Z=>Z.stop()),I(void 0)})}).catch(E=>{console.log(E.name,E.message,E.cause),g==null||g(E)})},[y,L,I,S,z,g]),m=p.useCallback(()=>{o==null||o.stop(),C(),n(0),L(!1),M(!1)},[o,n,L,M,C]),D=p.useCallback(()=>{b?(M(!1),o==null||o.resume(),S()):(M(!0),C(),o==null||o.pause())},[o,M,S,C]);return{startRecording:Q,stopRecording:m,togglePauseResume:D,recordingBlob:s,isRecording:w,isPaused:b,recordingTime:j,mediaRecorder:o}};var ne={exports:{}},U={};/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var pe;function Ye(){if(pe)return U;pe=1;var u=O.default,g=Symbol.for("react.element"),w=Symbol.for("react.fragment"),L=Object.prototype.hasOwnProperty,b=u.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,M={key:!0,ref:!0,__self:!0,__source:!0};function j(n,o,I){var y,d={},s=null,z=null;I!==void 0&&(s=""+I),o.key!==void 0&&(s=""+o.key),o.ref!==void 0&&(z=o.ref);for(y in o)L.call(o,y)&&!M.hasOwnProperty(y)&&(d[y]=o[y]);if(n&&n.defaultProps)for(y in o=n.defaultProps,o)d[y]===void 0&&(d[y]=o[y]);return{$$typeof:g,type:n,key:s,ref:z,props:d,_owner:b.current}}return U.Fragment=w,U.jsx=j,U.jsxs=j,U}var W={};/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var ge;function Re(){return ge||(ge=1,process.env.NODE_ENV!=="production"&&function(){var u=O.default,g=Symbol.for("react.element"),w=Symbol.for("react.portal"),L=Symbol.for("react.fragment"),b=Symbol.for("react.strict_mode"),M=Symbol.for("react.profiler"),j=Symbol.for("react.provider"),n=Symbol.for("react.context"),o=Symbol.for("react.forward_ref"),I=Symbol.for("react.suspense"),y=Symbol.for("react.suspense_list"),d=Symbol.for("react.memo"),s=Symbol.for("react.lazy"),z=Symbol.for("react.offscreen"),S=Symbol.iterator,C="@@iterator";function Q(e){if(e===null||typeof e!="object")return null;var t=S&&e[S]||e[C];return typeof t=="function"?t:null}var m=u.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function D(e){{for(var t=arguments.length,r=new Array(t>1?t-1:0),a=1;a<t;a++)r[a-1]=arguments[a];E("error",e,r)}}function E(e,t,r){{var a=m.ReactDebugCurrentFrame,l=a.getStackAddendum();l!==""&&(t+="%s",r=r.concat([l]));var f=r.map(function(c){return String(c)});f.unshift("Warning: "+t),Function.prototype.apply.call(console[e],console,f)}}var A=!1,R=!1,Z=!1,$=!1,F=!1,B;B=Symbol.for("react.module.reference");function G(e){return!!(typeof e=="string"||typeof e=="function"||e===L||e===M||F||e===b||e===I||e===y||$||e===z||A||R||Z||typeof e=="object"&&e!==null&&(e.$$typeof===s||e.$$typeof===d||e.$$typeof===j||e.$$typeof===n||e.$$typeof===o||e.$$typeof===B||e.getModuleId!==void 0))}function ae(e,t,r){var a=e.displayName;if(a)return a;var l=t.displayName||t.name||"";return l!==""?r+"("+l+")":r}function X(e){return e.displayName||"Context"}function h(e){if(e==null)return null;if(typeof e.tag=="number"&&D("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case L:return"Fragment";case w:return"Portal";case M:return"Profiler";case b:return"StrictMode";case I:return"Suspense";case y:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case n:var t=e;return X(t)+".Consumer";case j:var r=e;return X(r._context)+".Provider";case o:return ae(e,e.render,"ForwardRef");case d:var a=e.displayName||null;return a!==null?a:h(e.type)||"Memo";case s:{var l=e,f=l._payload,c=l._init;try{return h(c(f))}catch{return null}}}return null}var Y=Object.assign,J=0,Me,me,De,Ie,ve,Le,be;function Ne(){}Ne.__reactDisabledLog=!0;function Fe(){{if(J===0){Me=console.log,me=console.info,De=console.warn,Ie=console.error,ve=console.group,Le=console.groupCollapsed,be=console.groupEnd;var e={configurable:!0,enumerable:!0,value:Ne,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}J++}}function Xe(){{if(J--,J===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:Y({},e,{value:Me}),info:Y({},e,{value:me}),warn:Y({},e,{value:De}),error:Y({},e,{value:Ie}),group:Y({},e,{value:ve}),groupCollapsed:Y({},e,{value:Le}),groupEnd:Y({},e,{value:be})})}J<0&&D("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var oe=m.ReactCurrentDispatcher,ie;function K(e,t,r){{if(ie===void 0)try{throw Error()}catch(l){var a=l.stack.trim().match(/\n( *(at )?)/);ie=a&&a[1]||""}return`
+`+ie+e}}var ue=!1,q;{var Ke=typeof WeakMap=="function"?WeakMap:Map;q=new Ke}function we(e,t){if(!e||ue)return"";{var r=q.get(e);if(r!==void 0)return r}var a;ue=!0;var l=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var f;f=oe.current,oe.current=null,Fe();try{if(t){var c=function(){throw Error()};if(Object.defineProperty(c.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(c,[])}catch(x){a=x}Reflect.construct(e,[],c)}else{try{c.call()}catch(x){a=x}e.call(c.prototype)}}else{try{throw Error()}catch(x){a=x}e()}}catch(x){if(x&&a&&typeof x.stack=="string"){for(var i=x.stack.split(`
+`),T=a.stack.split(`
+`),v=i.length-1,N=T.length-1;v>=1&&N>=0&&i[v]!==T[N];)N--;for(;v>=1&&N>=0;v--,N--)if(i[v]!==T[N]){if(v!==1||N!==1)do if(v--,N--,N<0||i[v]!==T[N]){var k=`
+`+i[v].replace(" at new "," at ");return e.displayName&&k.includes("<anonymous>")&&(k=k.replace("<anonymous>",e.displayName)),typeof e=="function"&&q.set(e,k),k}while(v>=1&&N>=0);break}}}finally{ue=!1,oe.current=f,Xe(),Error.prepareStackTrace=l}var H=e?e.displayName||e.name:"",Qe=H?K(H):"";return typeof e=="function"&&q.set(e,Qe),Qe}function qe(e,t,r){return we(e,!1)}function et(e){var t=e.prototype;return!!(t&&t.isReactComponent)}function ee(e,t,r){if(e==null)return"";if(typeof e=="function")return we(e,et(e));if(typeof e=="string")return K(e);switch(e){case I:return K("Suspense");case y:return K("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case o:return qe(e.render);case d:return ee(e.type,t,r);case s:{var a=e,l=a._payload,f=a._init;try{return ee(f(l),t,r)}catch{}}}return""}var te=Object.prototype.hasOwnProperty,je={},he=m.ReactDebugCurrentFrame;function re(e){if(e){var t=e._owner,r=ee(e.type,e._source,t?t.type:null);he.setExtraStackFrame(r)}else he.setExtraStackFrame(null)}function tt(e,t,r,a,l){{var f=Function.call.bind(te);for(var c in e)if(f(e,c)){var i=void 0;try{if(typeof e[c]!="function"){var T=Error((a||"React class")+": "+r+" type `"+c+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[c]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw T.name="Invariant Violation",T}i=e[c](t,c,a,r,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(v){i=v}i&&!(i instanceof Error)&&(re(l),D("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",a||"React class",r,c,typeof i),re(null)),i instanceof Error&&!(i.message in je)&&(je[i.message]=!0,re(l),D("Failed %s type: %s",r,i.message),re(null))}}}var rt=Array.isArray;function ce(e){return rt(e)}function nt(e){{var t=typeof Symbol=="function"&&Symbol.toStringTag,r=t&&e[Symbol.toStringTag]||e.constructor.name||"Object";return r}}function at(e){try{return Se(e),!1}catch{return!0}}function Se(e){return""+e}function Te(e){if(at(e))return D("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",nt(e)),Se(e)}var V=m.ReactCurrentOwner,ot={key:!0,ref:!0,__self:!0,__source:!0},ze,Ce,se;se={};function it(e){if(te.call(e,"ref")){var t=Object.getOwnPropertyDescriptor(e,"ref").get;if(t&&t.isReactWarning)return!1}return e.ref!==void 0}function ut(e){if(te.call(e,"key")){var t=Object.getOwnPropertyDescriptor(e,"key").get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function ct(e,t){if(typeof e.ref=="string"&&V.current&&t&&V.current.stateNode!==t){var r=h(V.current.type);se[r]||(D('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',h(V.current.type),e.ref),se[r]=!0)}}function st(e,t){{var r=function(){ze||(ze=!0,D("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",t))};r.isReactWarning=!0,Object.defineProperty(e,"key",{get:r,configurable:!0})}}function lt(e,t){{var r=function(){Ce||(Ce=!0,D("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",t))};r.isReactWarning=!0,Object.defineProperty(e,"ref",{get:r,configurable:!0})}}var ft=function(e,t,r,a,l,f,c){var i={$$typeof:g,type:e,key:t,ref:r,props:c,_owner:f};return i._store={},Object.defineProperty(i._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(i,"_self",{configurable:!1,enumerable:!1,writable:!1,value:a}),Object.defineProperty(i,"_source",{configurable:!1,enumerable:!1,writable:!1,value:l}),Object.freeze&&(Object.freeze(i.props),Object.freeze(i)),i};function dt(e,t,r,a,l){{var f,c={},i=null,T=null;r!==void 0&&(Te(r),i=""+r),ut(t)&&(Te(t.key),i=""+t.key),it(t)&&(T=t.ref,ct(t,l));for(f in t)te.call(t,f)&&!ot.hasOwnProperty(f)&&(c[f]=t[f]);if(e&&e.defaultProps){var v=e.defaultProps;for(f in v)c[f]===void 0&&(c[f]=v[f])}if(i||T){var N=typeof e=="function"?e.displayName||e.name||"Unknown":e;i&&st(c,N),T&&lt(c,N)}return ft(e,i,T,l,a,V.current,c)}}var le=m.ReactCurrentOwner,Ee=m.ReactDebugCurrentFrame;function _(e){if(e){var t=e._owner,r=ee(e.type,e._source,t?t.type:null);Ee.setExtraStackFrame(r)}else Ee.setExtraStackFrame(null)}var fe;fe=!1;function de(e){return typeof e=="object"&&e!==null&&e.$$typeof===g}function ke(){{if(le.current){var e=h(le.current.type);if(e)return`
+
+Check the render method of \``+e+"`."}return""}}function yt(e){{if(e!==void 0){var t=e.fileName.replace(/^.*[\\\/]/,""),r=e.lineNumber;return`
+
+Check your code at `+t+":"+r+"."}return""}}var Oe={};function pt(e){{var t=ke();if(!t){var r=typeof e=="string"?e:e.displayName||e.name;r&&(t=`
+
+Check the top-level render call using <`+r+">.")}return t}}function Ae(e,t){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var r=pt(t);if(Oe[r])return;Oe[r]=!0;var a="";e&&e._owner&&e._owner!==le.current&&(a=" It was passed a child from "+h(e._owner.type)+"."),_(e),D('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',r,a),_(null)}}function xe(e,t){{if(typeof e!="object")return;if(ce(e))for(var r=0;r<e.length;r++){var a=e[r];de(a)&&Ae(a,t)}else if(de(e))e._store&&(e._store.validated=!0);else if(e){var l=Q(e);if(typeof l=="function"&&l!==e.entries)for(var f=l.call(e),c;!(c=f.next()).done;)de(c.value)&&Ae(c.value,t)}}}function gt(e){{var t=e.type;if(t==null||typeof t=="string")return;var r;if(typeof t=="function")r=t.propTypes;else if(typeof t=="object"&&(t.$$typeof===o||t.$$typeof===d))r=t.propTypes;else return;if(r){var a=h(t);tt(r,e.props,"prop",a,e)}else if(t.PropTypes!==void 0&&!fe){fe=!0;var l=h(t);D("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",l||"Unknown")}typeof t.getDefaultProps=="function"&&!t.getDefaultProps.isReactClassApproved&&D("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function Mt(e){{for(var t=Object.keys(e.props),r=0;r<t.length;r++){var a=t[r];if(a!=="children"&&a!=="key"){_(e),D("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",a),_(null);break}}e.ref!==null&&(_(e),D("Invalid attribute `ref` supplied to `React.Fragment`."),_(null))}}function Pe(e,t,r,a,l,f){{var c=G(e);if(!c){var i="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(i+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var T=yt(l);T?i+=T:i+=ke();var v;e===null?v="null":ce(e)?v="array":e!==void 0&&e.$$typeof===g?(v="<"+(h(e.type)||"Unknown")+" />",i=" Did you accidentally export a JSX literal instead of a component?"):v=typeof e,D("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",v,i)}var N=dt(e,t,r,l,f);if(N==null)return N;if(c){var k=t.children;if(k!==void 0)if(a)if(ce(k)){for(var H=0;H<k.length;H++)xe(k[H],e);Object.freeze&&Object.freeze(k)}else D("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else xe(k,e)}return e===L?Mt(N):gt(N),N}}function mt(e,t,r){return Pe(e,t,r,!0)}function Dt(e,t,r){return Pe(e,t,r,!1)}var It=Dt,vt=mt;W.Fragment=L,W.jsx=It,W.jsxs=vt}()),W}process.env.NODE_ENV==="production"?ne.exports=Ye():ne.exports=Re();var Ze=ne.exports;const _e=(u,g,w,L)=>{let b=g/(w+L),M=Math.floor(u.length/b);b>u.length&&(b=u.length,M=1);const j=[];for(let n=0;n<b;n++){let o=0;for(let I=0;I<M&&n*M+I<u.length;I++)o+=u[n*M+I];j.push(o/M)}return j},He=(u,g,w,L,b,M)=>{const j=g.height/2,n=g.getContext("2d");n&&(n.clearRect(0,0,g.width,g.height),b!=="transparent"&&(n.fillStyle=b,n.fillRect(0,0,g.width,g.height)),u.forEach((o,I)=>{n.fillStyle=M;const y=I*(w+L),d=j-o/2,s=w,z=o||1;n.beginPath(),n.roundRect(y,d,s,z,50),n.fill()}))},Ue=({mediaRecorder:u,width:g="100%",height:w="100%",barWidth:L=2,gap:b=1,backgroundColor:M="transparent",barColor:j="rgb(160, 198, 255)",fftSize:n=1024,maxDecibels:o=-10,minDecibels:I=-90,smoothingTimeConstant:y=.4})=>{const[d]=p.useState(()=>new AudioContext),[s,z]=p.useState(),S=p.useRef(null);p.useEffect(()=>{if(!u.stream)return;const m=d.createAnalyser();z(m),m.fftSize=n,m.minDecibels=I,m.maxDecibels=o,m.smoothingTimeConstant=y,d.createMediaStreamSource(u.stream).connect(m)},[u.stream]),p.useEffect(()=>{(s!=null?s:u.state==="recording")&&C()},[s,u.state]);const C=p.useCallback(()=>{if(!s)return;const m=new Uint8Array(s==null?void 0:s.frequencyBinCount);u.state==="recording"?(s==null||s.getByteFrequencyData(m),Q(m),requestAnimationFrame(C)):u.state==="paused"?Q(m):u.state==="inactive"&&d.state!=="closed"&&d.close()},[s]),Q=m=>{if(!S.current)return;const D=_e(m,S.current.width,L,b);He(D,S.current,L,b,M,j)};return Ze.jsx("canvas",{ref:S,width:g,height:w,style:{aspectRatio:"unset"}})},Be="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDQ3MCA0NzAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQ3MCA0NzA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCgk8Zz4NCgkJPHBhdGggZD0iTTIzNSwzMDIuMjk2YzQ3LjE3NywwLDg1LjQyMy0zOC4yNDUsODUuNDIzLTg1LjQyM1Y4NS40MjNDMzIwLjQyMywzOC4yNDUsMjgyLjE3NywwLDIzNSwwcy04NS40MjMsMzguMjQ1LTg1LjQyMyw4NS40MjMNCgkJCXYxMzEuNDUxQzE0OS41NzcsMjY0LjA1MSwxODcuODIzLDMwMi4yOTYsMjM1LDMwMi4yOTZ6Ii8+DQoJCTxwYXRoIGQ9Ik0zNTAuNDIzLDEzNi4xNDh2MzBoMTV2NTAuNzI2YzAsNzEuOTE1LTU4LjUwOCwxMzAuNDIzLTEzMC40MjMsMTMwLjQyM3MtMTMwLjQyMy01OC41MDctMTMwLjQyMy0xMzAuNDIzdi01MC43MjZoMTV2LTMwDQoJCQloLTQ1djgwLjcyNkM3NC41NzcsMzAwLjI3MywxMzguNTUxLDM2OSwyMjAsMzc2LjU4OVY0NDBoLTkwLjQ0NHYzMGgyMTAuODg5di0zMEgyNTB2LTYzLjQxMQ0KCQkJYzgxLjQ0OS03LjU4OSwxNDUuNDIzLTc2LjMxNywxNDUuNDIzLTE1OS43MTZ2LTgwLjcyNkgzNTAuNDIzeiIvPg0KCTwvZz4NCjwvc3ZnPg0K",Ge="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNDcuNjA3IDQ3LjYwNyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDcuNjA3IDQ3LjYwNzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KCTxnPg0KCQk8cGF0aCBkPSJNMTcuOTkxLDQwLjk3NmMwLDMuNjYyLTIuOTY5LDYuNjMxLTYuNjMxLDYuNjMxbDAsMGMtMy42NjIsMC02LjYzMS0yLjk2OS02LjYzMS02LjYzMVY2LjYzMUM0LjcyOSwyLjk2OSw3LjY5OCwwLDExLjM2LDANCgkJCWwwLDBjMy42NjIsMCw2LjYzMSwyLjk2OSw2LjYzMSw2LjYzMVY0MC45NzZ6Ii8+DQoJCTxwYXRoIGQ9Ik00Mi44NzcsNDAuOTc2YzAsMy42NjItMi45NjksNi42MzEtNi42MzEsNi42MzFsMCwwYy0zLjY2MiwwLTYuNjMxLTIuOTY5LTYuNjMxLTYuNjMxVjYuNjMxDQoJCQlDMjkuNjE2LDIuOTY5LDMyLjU4NSwwLDM2LjI0NiwwbDAsMGMzLjY2MiwwLDYuNjMxLDIuOTY5LDYuNjMxLDYuNjMxVjQwLjk3NnoiLz4NCgk8L2c+DQo8L3N2Zz4NCg==",Je="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDQ5NC4xNDggNDk0LjE0OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDk0LjE0OCA0OTQuMTQ4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQoJPGc+DQoJCTxnPg0KCQkJPHBhdGggZD0iTTQwNS4yODQsMjAxLjE4OEwxMzAuODA0LDEzLjI4QzExOC4xMjgsNC41OTYsMTA1LjM1NiwwLDk0Ljc0LDBDNzQuMjE2LDAsNjEuNTIsMTYuNDcyLDYxLjUyLDQ0LjA0NHY0MDYuMTI0DQoJCQkJYzAsMjcuNTQsMTIuNjgsNDMuOTgsMzMuMTU2LDQzLjk4YzEwLjYzMiwwLDIzLjItNC42LDM1LjkwNC0xMy4zMDhsMjc0LjYwOC0xODcuOTA0YzE3LjY2LTEyLjEwNCwyNy40NC0yOC4zOTIsMjcuNDQtNDUuODg0DQoJCQkJQzQzMi42MzIsMjI5LjU3Miw0MjIuOTY0LDIxMy4yODgsNDA1LjI4NCwyMDEuMTg4eiIvPg0KCQk8L2c+DQoJPC9nPg0KPC9zdmc+DQo=",Ve="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMThweCIgaGVpZ2h0PSIxOHB4IiB2aWV3Qm94PSIwIDAgMTggMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+DQogIDxwYXRoIGZpbGw9IiMwMDAwMDAiIGQ9Ik0xNy44NSAzLjE1bC0yLjk5LTNBLjUwOC41MDggMCAwIDAgMTQuNSAwSDEuNEExLjQxNyAxLjQxNyAwIDAgMCAwIDEuNDN2MTUuMTRBMS40MTcgMS40MTcgMCAwIDAgMS40IDE4aDE1LjJhMS40MTcgMS40MTcgMCAwIDAgMS40LTEuNDNWMy41YS40Ny40NyAwIDAgMC0uMTUtLjM1ek0yIDVWM2ExIDEgMCAwIDEgMS0xaDhhMSAxIDAgMCAxIDEgMXYyYTEgMSAwIDAgMS0xIDFIM2ExIDEgMCAwIDEtMS0xem03IDExYTQgNCAwIDEgMSA0LTQgNCA0IDAgMCAxLTQgNHoiLz4NCjwvc3ZnPg0K",We="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNDYuNzM0IDQ2LjczNCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDYuNzM0IDQ2LjczNDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZD0iTTQxLjM0NiwwSDUuMzg4QzIuNDE3LDAsMCwyLjQxNywwLDUuMzg4djM1Ljk1OGMwLDIuOTcxLDIuNDE3LDUuMzg4LDUuMzg4LDUuMzg4aDM1Ljk1OGMyLjk3MSwwLDUuMzg4LTIuNDE3LDUuMzg4LTUuMzg4DQoJCVY1LjM4OEM0Ni43MzMsMi40MTcsNDQuMzE2LDAsNDEuMzQ2LDB6Ii8+DQo8L2c+DQo8L3N2Zz4NCg==",bt="",$e=({onRecordingComplete:u,onNotAllowedOrFound:g,recorderControls:w,audioTrackConstraints:L,downloadOnSavePress:b=!1,downloadFileExtension:M="mp3",showVisualizer:j=!1,classes:n})=>{var A,R,Z,$,F,B;const{startRecording:o,stopRecording:I,togglePauseResume:y,recordingBlob:d,isRecording:s,isPaused:z,recordingTime:S,mediaRecorder:C}=w!=null?w:ye(L,g),[Q,m]=p.useState(!1),D=(G=!0)=>{m(G),I()},E=G=>{const ae=new Blob([G],{type:`audio/${M}`}),X=URL.createObjectURL(ae),h=document.createElement("a");h.style.display="none",h.href=X,h.download=`audio.${M}`,document.body.appendChild(h),h.click(),h.remove()};return p.useEffect(()=>{(Q||w)&&d!=null&&u!=null&&(u(d),b&&E(d))},[d]),O.default.createElement("div",{className:`audio-recorder ${s?"recording":""} ${(A=n==null?void 0:n.AudioRecorderClass)!=null?A:""}`,"data-testid":"audio_recorder"},O.default.createElement("img",{src:s?Ve:Be,className:`audio-recorder-mic ${(R=n==null?void 0:n.AudioRecorderStartSaveClass)!=null?R:""}`,onClick:s?()=>D():o,"data-testid":"ar_mic",title:s?"Save recording":"Start recording"}),O.default.createElement("span",{className:`audio-recorder-timer ${s?"":"display-none"} ${(Z=n==null?void 0:n.AudioRecorderTimerClass)!=null?Z:""}`,"data-testid":"ar_timer"},Math.floor(S/60),":",String(S%60).padStart(2,"0")),j?O.default.createElement("span",{className:`audio-recorder-visualizer ${s?"":"display-none"}`},C&&O.default.createElement(Ue,{mediaRecorder:C,barWidth:2,gap:2,width:140,height:30,fftSize:512,maxDecibels:-10,minDecibels:-80,smoothingTimeConstant:.4})):O.default.createElement("span",{className:`audio-recorder-status ${s?"":"display-none"} ${($=n==null?void 0:n.AudioRecorderStatusClass)!=null?$:""}`},O.default.createElement("span",{className:"audio-recorder-status-dot"}),"Recording"),O.default.createElement("img",{src:z?Je:Ge,className:`audio-recorder-options ${s?"":"display-none"} ${(F=n==null?void 0:n.AudioRecorderPauseResumeClass)!=null?F:""}`,onClick:y,title:z?"Resume recording":"Pause recording","data-testid":"ar_pause"}),O.default.createElement("img",{src:We,className:`audio-recorder-options ${s?"":"display-none"} ${(B=n==null?void 0:n.AudioRecorderDiscardClass)!=null?B:""}`,onClick:()=>D(!1),title:"Discard Recording","data-testid":"ar_cancel"}))};P.AudioRecorder=$e,P.useAudioRecorder=ye,Object.defineProperties(P,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package.json

 {
   "name": "react-audio-voice-recorder",
   "private": false,
-  "version": "1.1.7",
+  "version": "1.2.0",
   "license": "MIT",
@@ -82,4 +82,6 @@ "author": "",
     "prettier": "^2.7.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "typescript": "^4.8.2",
-    "vite": "^3.0.7",
+    "vite": "^3.2.7",
     "vite-plugin-css-injected-by-js": "^3.1.0",
@@ -90,5 +92,4 @@ "vite-plugin-dts": "^1.4.1",
   "dependencies": {
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-audio-visualize": "^1.0.0"
   }
 }

README.md

@@ -51,2 +51,3 @@
 | **`downloadFileExtension`**  | The file extension to be used for the downloaded file. Allowed values are `mp3`, `wav` and `webm` | `mp3` | Yes |
+| **`showVisualizer`**  | Displays a waveform visualization for the audio when set to `true` | `false` | Yes |
 | **`classes`** | This allows class names to be passed to modify the styles for the entire component or specific portions of it | N/A | Yes |
@@ -53,0 +54,0 @@ ---

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

73309

increased by117.48%

Dependency count

3

decreased by-25%

Lines of code

1106

increased by281.38%

Number of lines in readme file

131

increased by0.77%

Worsened metrics

Dev dependency count

37

increased by5.71%

Number of low supply chain risk alerts

10

increased by150%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedreact-audio-visualize@^1.0.0

• + Addedreact@19.0.0(transitive)

• + Addedreact-audio-visualize@1.2.0(transitive)

• + Addedreact-dom@19.0.0(transitive)

• + Addedscheduler@0.25.0(transitive)

• - Removedreact@^18.2.0

• - Removedreact-dom@^18.2.0

• - Removedjs-tokens@4.0.0(transitive)

• - Removedloose-envify@1.4.0(transitive)

• - Removedreact@18.3.1(transitive)

• - Removedreact-dom@18.3.1(transitive)

• - Removedscheduler@0.23.2(transitive)