@exode-team/react-recorder 1.1.12 → 1.1.15

package/dist/index.js

@@ -1,2613 +1,14 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import React, { useState, useRef, useCallback, useEffect, useMemo, useLayoutEffect, useImperativeHandle } from 'react';
-import styled from 'styled-components';
-import { Icon32Microphone, Icon16Microphone, Icon16Pause, Icon16Play, Icon28DeleteOutlineAndroid, Icon28SendOutline, Icon20Voice, Icon24Pause, Icon24Play } from '@vkontakte/icons';
-
-/**
- * Math utilities
- *
- * @author: exode <hello@exode.ru>
- */
-const clampValue = (value, lowerBound = 0, upperBound = 100) => {
-    const safe = Number.isFinite(value) ? value : 0;
-    return Math.min(Math.max(safe, lowerBound), upperBound);
-};
-const roundTo = (value, precision = 2) => {
-    const factor = Math.pow(10, precision);
-    return Math.round(value * factor) / factor;
-};
-
-/**
- * Format utilities
- *
- * @author: exode <hello@exode.ru>
- */
-const formatTime = (seconds) => {
-    const mins = Math.floor(seconds / 60);
-    const secs = Math.floor(seconds % 60);
-    return `${String(mins).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
-};
-
-/**
- * Microphone platform adapter
- *
- * @author: exode <hello@exode.ru>
- */
-const classifyMicError = (error) => {
-    const domError = error instanceof DOMException ? error : null;
-    if ((domError === null || domError === void 0 ? void 0 : domError.name) === 'NotAllowedError'
-        || (domError === null || domError === void 0 ? void 0 : domError.name) === 'NotFoundError'
-        || (domError === null || domError === void 0 ? void 0 : domError.name) === 'NotReadableError') {
-        return 'permission';
-    }
-    return 'unknown';
-};
-const requestMicrophoneAccess = async () => {
-    var _a;
-    if (typeof navigator === 'undefined' || !((_a = navigator.mediaDevices) === null || _a === void 0 ? void 0 : _a.getUserMedia)) {
-        throw new Error('MediaRecorder is not supported in this browser');
-    }
-    return navigator.mediaDevices.getUserMedia({ audio: true });
-};
-
-/**
- * MediaRecorder platform adapter
- *
- * @author: exode <hello@exode.ru>
- */
-const createRecorderSession = (stream, callbacks, options) => {
-    const recorderOptions = {};
-    if ((options === null || options === void 0 ? void 0 : options.mimeType) && MediaRecorder.isTypeSupported(options.mimeType)) {
-        recorderOptions.mimeType = options.mimeType;
-    }
-    const recorder = new MediaRecorder(stream, recorderOptions);
-    recorder.ondataavailable = callbacks.onDataAvailable;
-    recorder.onstop = callbacks.onStop;
-    recorder.onpause = callbacks.onPause;
-    recorder.onresume = callbacks.onResume;
-    return { recorder, stream };
-};
-const stopStream = (stream) => {
-    stream.getTracks().forEach((track) => track.stop());
-};
-
-/**
- * Audio playback platform adapter
- *
- * @author: exode <hello@exode.ru>
- */
-const SEEK_OFFSET = 5;
-const setupMediaSession = (audio, callbacks) => {
-    if (!('mediaSession' in navigator)) {
-        return;
-    }
-    navigator.mediaSession.setActionHandler('play', () => {
-        audio.play().catch(() => { });
-    });
-    navigator.mediaSession.setActionHandler('pause', () => {
-        audio.pause();
-    });
-    navigator.mediaSession.setActionHandler('stop', () => {
-        var _a;
-        audio.pause();
-        audio.currentTime = 0;
-        (_a = callbacks.onStop) === null || _a === void 0 ? void 0 : _a.call(callbacks);
-    });
-    navigator.mediaSession.setActionHandler('seekbackward', () => {
-        var _a;
-        audio.currentTime = Math.max(0, audio.currentTime - SEEK_OFFSET);
-        (_a = callbacks.onSeekBackward) === null || _a === void 0 ? void 0 : _a.call(callbacks);
-    });
-    navigator.mediaSession.setActionHandler('seekforward', () => {
-        var _a;
-        audio.currentTime = Math.min(audio.duration, audio.currentTime + SEEK_OFFSET);
-        (_a = callbacks.onSeekForward) === null || _a === void 0 ? void 0 : _a.call(callbacks);
-    });
-    navigator.mediaSession.setActionHandler('seekto', (details) => {
-        if (details.seekTime != null && isFinite(audio.duration)) {
-            audio.currentTime = details.seekTime;
-        }
-    });
-    navigator.mediaSession.setActionHandler('previoustrack', () => {
-        var _a;
-        (_a = callbacks.onPreviousTrack) === null || _a === void 0 ? void 0 : _a.call(callbacks);
-    });
-    navigator.mediaSession.setActionHandler('nexttrack', () => {
-        var _a;
-        (_a = callbacks.onNextTrack) === null || _a === void 0 ? void 0 : _a.call(callbacks);
-    });
-};
-const clearMediaSession = () => {
-    if (!('mediaSession' in navigator)) {
-        return;
-    }
-    const actions = [
-        'play', 'pause', 'stop',
-        'seekbackward', 'seekforward', 'seekto',
-        'previoustrack', 'nexttrack',
-    ];
-    actions.forEach((action) => {
-        navigator.mediaSession.setActionHandler(action, null);
-    });
-    navigator.mediaSession.playbackState = 'none';
-};
-const createAudioPlayback = (url, callbacks) => {
-    const audio = new Audio(url);
-    audio.onloadedmetadata = () => {
-        callbacks.onLoadedMetadata(audio.duration);
-    };
-    audio.ontimeupdate = () => {
-        callbacks.onTimeUpdate(audio.currentTime);
-    };
-    audio.onended = () => {
-        callbacks.onEnded();
-    };
-    audio.onplay = () => {
-        var _a;
-        setupMediaSession(audio, callbacks);
-        if ('mediaSession' in navigator) {
-            navigator.mediaSession.playbackState = 'playing';
-        }
-        (_a = callbacks.onPlay) === null || _a === void 0 ? void 0 : _a.call(callbacks);
-    };
-    audio.onpause = () => {
-        var _a;
-        if ('mediaSession' in navigator) {
-            navigator.mediaSession.playbackState = 'paused';
-        }
-        (_a = callbacks.onPause) === null || _a === void 0 ? void 0 : _a.call(callbacks);
-    };
-    return { audio, url };
-};
-const cleanupAudio = (audio) => {
-    audio.pause();
-    audio.src = '';
-    audio.onended = null;
-    audio.ontimeupdate = null;
-    audio.onloadedmetadata = null;
-    audio.onplay = null;
-    audio.onpause = null;
-    clearMediaSession();
-};
-const createObjectURL = (blob) => {
-    return URL.createObjectURL(blob);
-};
-const revokeObjectURL = (url) => {
-    URL.revokeObjectURL(url);
-};
-
-/**
- * AudioRecorder constants
- *
- * @author: exode <hello@exode.ru>
- */
-const AUDIO_LEVEL_BARS = 40;
-/** Waveform decoding resamples to this rate — only the amplitude envelope matters */
-const WAVEFORM_SAMPLE_RATE = 44100;
-const createInitialLevels = () => Array.from({ length: AUDIO_LEVEL_BARS }, () => 0);
-const TIMELINE_SAMPLE_INTERVAL = 150;
-const TIMELINE_BAR_WIDTH = 3;
-const TIMELINE_BAR_GAP = 2;
-const TIMELINE_BAR_MIN_HEIGHT = 3;
-const TIMELINE_BAR_MAX_HEIGHT = 24;
-
-/**
- * MPEG frame scanner
- *
- * @author: exode <hello@exode.ru>
- */
-const MPEG_LAYER_III = 1;
-const MPEG_SAMPLE_RATES = [44100, 48000, 32000];
-const MPEG_BITRATES_V1 = [0, 32, 40, 48, 56, 64, 80, 96, 112, 128, 160, 192, 224, 256, 320, 0];
-const MPEG_BITRATES_V2 = [0, 8, 16, 24, 32, 40, 48, 56, 64, 80, 96, 112, 128, 144, 160, 0];
-/** Length of the Layer III frame at the given offset, or 0 when it is not one */
-const readFrameLength = (bytes, offset) => {
-    if (offset + 3 >= bytes.length || bytes[offset] !== 0xff || (bytes[offset + 1] & 0xe0) !== 0xe0) {
-        return 0;
-    }
-    /** Version ids: 0 = MPEG 2.5, 1 = reserved, 2 = MPEG 2, 3 = MPEG 1 */
-    const version = (bytes[offset + 1] >> 3) & 0x03;
-    const layer = (bytes[offset + 1] >> 1) & 0x03;
-    const bitrateIndex = (bytes[offset + 2] >> 4) & 0x0f;
-    const sampleRateIndex = (bytes[offset + 2] >> 2) & 0x03;
-    const isReserved = version === 1
-        || layer !== MPEG_LAYER_III
-        || sampleRateIndex === 3
-        || bitrateIndex === 0
-        || bitrateIndex === 0x0f;
-    if (isReserved) {
-        return 0;
-    }
-    const isVersion1 = version === 3;
-    const padding = (bytes[offset + 2] >> 1) & 0x01;
-    const bitrate = (isVersion1 ? MPEG_BITRATES_V1 : MPEG_BITRATES_V2)[bitrateIndex] * 1000;
-    const sampleRate = MPEG_SAMPLE_RATES[sampleRateIndex] / (isVersion1 ? 1 : version === 2 ? 2 : 4);
-    return Math.floor((isVersion1 ? 144 : 72) * bitrate / sampleRate) + padding;
-};
-/**
- * Some mp3 (e.g. converted from wma) keep junk between the ID3 tag and the
- * first MPEG frame: media elements skip it, the WebAudio decoder does not.
- * Returns the offset of the first real frame, or 0 when there is none.
- */
-const findFirstFrameOffset = (bytes) => {
-    let start = 0;
-    /** ID3v2 header: "ID3" + version + flags + 4 syncsafe size bytes */
-    if (bytes.length >= 10 && bytes[0] === 0x49 && bytes[1] === 0x44 && bytes[2] === 0x33) {
-        start = 10 + ((bytes[6] << 21) | (bytes[7] << 14) | (bytes[8] << 7) | bytes[9]);
-        /** ID3v2.4 may append a 10 byte footer copy of the header */
-        if (bytes[5] & 0x10) {
-            start += 10;
-        }
-    }
-    for (let i = start; i < bytes.length - 3; i += 1) {
-        const length = readFrameLength(bytes, i);
-        /** Junk can open with a valid looking header, so require the next frame to follow */
-        if (length && readFrameLength(bytes, i + length)) {
-            return i;
-        }
-    }
-    return 0;
-};
-
-/**
- * Audio analyzer platform adapter
- *
- * @author: exode <hello@exode.ru>
- */
-const createStreamAnalyzer = (stream) => {
-    const context = new AudioContext();
-    const analyser = context.createAnalyser();
-    const source = context.createMediaStreamSource(stream);
-    source.connect(analyser);
-    analyser.fftSize = 256;
-    return { context, analyser };
-};
-const readFrequencyLevels = (analyser, barCount = AUDIO_LEVEL_BARS) => {
-    var _a;
-    const bufferLength = analyser.frequencyBinCount;
-    const dataArray = new Uint8Array(bufferLength);
-    analyser.getByteFrequencyData(dataArray);
-    const step = Math.max(1, Math.floor(bufferLength / barCount));
-    const levels = [];
-    for (let i = 0; i < barCount; i += 1) {
-        const value = (_a = dataArray[i * step]) !== null && _a !== void 0 ? _a : 0;
-        levels.push((value / 255) * 100);
-    }
-    return levels;
-};
-/** decodeAudioData detaches the buffer, so the retry re-reads the blob */
-const decodeSkippingJunk = async (context, blob) => {
-    try {
-        return await context.decodeAudioData(await blob.arrayBuffer());
-    }
-    catch (error) {
-        const bytes = new Uint8Array(await blob.arrayBuffer());
-        const offset = findFirstFrameOffset(bytes);
-        if (!offset) {
-            throw error;
-        }
-        return context.decodeAudioData(bytes.buffer.slice(offset));
-    }
-};
-const decodeAudioLevels = async (blob, barCount = AUDIO_LEVEL_BARS) => {
-    /**
-     * Offline context stays out of the audio session. A realtime AudioContext
-     * registers as a WebAudio source, which pins WebKit to the AmbientSound
-     * category and leaves media playback silent inside iOS apps — including
-     * iPad apps running on macOS.
-     */
-    const context = new OfflineAudioContext(1, 1, WAVEFORM_SAMPLE_RATE);
-    const audioBuffer = await decodeSkippingJunk(context, blob);
-    const channelData = audioBuffer.getChannelData(0);
-    if (!channelData.length) {
-        return Array.from({ length: barCount }, () => 0);
-    }
-    const levels = [];
-    const segmentLength = Math.max(1, Math.floor(channelData.length / barCount));
-    for (let i = 0; i < barCount; i += 1) {
-        const segmentStart = i * segmentLength;
-        let sum = 0;
-        for (let j = 0; j < segmentLength; j += 1) {
-            const sample = channelData[segmentStart + j];
-            if (sample !== undefined) {
-                sum += Math.abs(sample);
-            }
-        }
-        const average = sum / segmentLength;
-        levels.push(Math.min(100, average * 200));
-    }
-    return levels;
-};
-
-/**
- * Audio blob fetcher platform adapter
- *
- * @author: exode <hello@exode.ru>
- */
-const fetchAudioBlob = async (url, signal) => {
-    const response = await fetch(url, {
-        signal,
-        mode: 'cors',
-        credentials: 'omit',
-    });
-    if (!response.ok) {
-        throw new Error(`Failed to fetch audio: ${response.status}`);
-    }
-    return response.blob();
-};
-
-/**
- * Animation frame platform adapter
- *
- * @author: exode <hello@exode.ru>
- */
-const scheduleFrame = (callback) => {
-    return requestAnimationFrame(callback);
-};
-const cancelFrame = (id) => {
-    cancelAnimationFrame(id);
-};
-
-/**
- * useMediaRecorder
- *
- * @author: exode <hello@exode.ru>
- */
-const useMediaRecorder = (callbacks) => {
-    const [isRecording, setIsRecording] = useState(false);
-    const [isPaused, setIsPaused] = useState(false);
-    const mediaRecorderRef = useRef(null);
-    const mediaStreamRef = useRef(null);
-    const audioChunksRef = useRef([]);
-    const discardRef = useRef(false);
-    const needsPreviewRef = useRef(false);
-    const cleanupStream = useCallback(() => {
-        if (mediaStreamRef.current) {
-            stopStream(mediaStreamRef.current);
-            mediaStreamRef.current = null;
-        }
-    }, []);
-    const startRecording = useCallback(async (mimeType) => {
-        try {
-            const stream = await requestMicrophoneAccess();
-            mediaStreamRef.current = stream;
-            callbacks.onStreamAcquired(stream);
-            audioChunksRef.current = [];
-            discardRef.current = false;
-            const { recorder } = createRecorderSession(stream, {
-                onDataAvailable: (event) => {
-                    if (event.data.size > 0) {
-                        audioChunksRef.current.push(event.data);
-                        callbacks.onDataChunk(event.data);
-                    }
-                    if (needsPreviewRef.current) {
-                        callbacks.onNeedsPreview(audioChunksRef.current);
-                        needsPreviewRef.current = false;
-                    }
-                },
-                onStop: () => {
-                    const discarded = discardRef.current;
-                    discardRef.current = false;
-                    mediaRecorderRef.current = null;
-                    cleanupStream();
-                    setIsRecording(false);
-                    setIsPaused(false);
-                    callbacks.onStopped(audioChunksRef.current, discarded);
-                },
-                onPause: () => {
-                    setIsPaused(true);
-                    callbacks.onPaused();
-                },
-                onResume: () => {
-                    setIsPaused(false);
-                    needsPreviewRef.current = false;
-                    callbacks.onResumed();
-                },
-            }, { mimeType });
-            mediaRecorderRef.current = recorder;
-            recorder.start();
-            setIsRecording(true);
-            setIsPaused(false);
-        }
-        catch (error) {
-            console.error('[audio-recorder] Error accessing microphone:', error);
-            const kind = classifyMicError(error);
-            if (kind === 'permission') {
-                callbacks.onPermissionDenied(error);
-            }
-            else {
-                callbacks.onError(error);
-            }
-        }
-    }, [callbacks, cleanupStream]);
-    const stopRecording = useCallback(() => {
-        if (!mediaRecorderRef.current || !isRecording) {
-            return;
-        }
-        if (mediaRecorderRef.current.state === 'paused') {
-            mediaRecorderRef.current.resume();
-        }
-        mediaRecorderRef.current.stop();
-    }, [isRecording]);
-    const cancelRecording = useCallback(() => {
-        if (!mediaRecorderRef.current) {
-            return;
-        }
-        discardRef.current = true;
-        needsPreviewRef.current = false;
-        if (mediaRecorderRef.current.state !== 'inactive') {
-            mediaRecorderRef.current.stop();
-        }
-    }, []);
-    const togglePause = useCallback(() => {
-        if (!mediaRecorderRef.current || !isRecording) {
-            return;
-        }
-        if (mediaRecorderRef.current.state === 'recording') {
-            needsPreviewRef.current = true;
-            try {
-                mediaRecorderRef.current.requestData();
-            }
-            catch (error) {
-                console.warn('[audio-recorder] requestData failed', error);
-            }
-            mediaRecorderRef.current.pause();
-        }
-        else if (mediaRecorderRef.current.state === 'paused') {
-            needsPreviewRef.current = false;
-            mediaRecorderRef.current.resume();
-        }
-    }, [isRecording]);
-    return {
-        isPaused,
-        isRecording,
-        togglePause,
-        cleanupStream,
-        stopRecording,
-        startRecording,
-        cancelRecording,
-    };
-};
-
-/**
- * useAudioPlayback
- *
- * @author: exode <hello@exode.ru>
- */
-const useAudioPlayback = () => {
-    const [audioURL, setAudioURL] = useState(null);
-    const [isPlaying, setIsPlaying] = useState(false);
-    const [playbackTime, setPlaybackTime] = useState(0);
-    const [playbackDuration, setPlaybackDuration] = useState(0);
-    const audioRef = useRef(null);
-    const cleanupAudioElement = useCallback(() => {
-        const audio = audioRef.current;
-        if (!audio) {
-            return;
-        }
-        cleanupAudio(audio);
-        audioRef.current = null;
-    }, []);
-    const setAudioUrlSafely = useCallback((value) => {
-        setAudioURL((prev) => {
-            if (prev) {
-                revokeObjectURL(prev);
-            }
-            return value;
-        });
-    }, []);
-    const resetPlayback = useCallback(() => {
-        setPlaybackTime(0);
-        setPlaybackDuration(0);
-        setIsPlaying(false);
-        setAudioUrlSafely(null);
-        cleanupAudioElement();
-    }, [cleanupAudioElement, setAudioUrlSafely]);
-    const mountBlob = useCallback((blob) => {
-        const url = createObjectURL(blob);
-        setAudioUrlSafely(url);
-        cleanupAudioElement();
-        const { audio } = createAudioPlayback(url, {
-            onLoadedMetadata: (duration) => setPlaybackDuration(duration),
-            onTimeUpdate: (currentTime) => setPlaybackTime(currentTime),
-            onEnded: () => {
-                setIsPlaying(false);
-                setPlaybackTime(0);
-            },
-            onPlay: () => setIsPlaying(true),
-            onPause: () => setIsPlaying(false),
-        });
-        audioRef.current = audio;
-        setPlaybackTime(0);
-        setPlaybackDuration(0);
-        setIsPlaying(false);
-        return url;
-    }, [cleanupAudioElement, setAudioUrlSafely]);
-    const togglePlayback = useCallback((onError) => {
-        if (!audioURL) {
-            return;
-        }
-        if (!audioRef.current) {
-            const { audio } = createAudioPlayback(audioURL, {
-                onLoadedMetadata: (duration) => setPlaybackDuration(duration),
-                onTimeUpdate: (currentTime) => setPlaybackTime(currentTime),
-                onEnded: () => {
-                    setIsPlaying(false);
-                    setPlaybackTime(0);
-                },
-                onPlay: () => setIsPlaying(true),
-                onPause: () => setIsPlaying(false),
-            });
-            audioRef.current = audio;
-        }
-        const audio = audioRef.current;
-        if (!audio) {
-            return;
-        }
-        if (audio.paused) {
-            if (audio.duration > 0 && playbackDuration > 0) {
-                audio.currentTime = Math.min(playbackTime, audio.duration);
-            }
-            audio.play()
-                .then(() => setIsPlaying(true))
-                .catch((error) => {
-                setIsPlaying(false);
-                onError === null || onError === void 0 ? void 0 : onError(error);
-            });
-        }
-        else {
-            audio.pause();
-            setIsPlaying(false);
-        }
-    }, [audioURL, playbackDuration, playbackTime]);
-    const stopPlayback = useCallback(() => {
-        const audio = audioRef.current;
-        if (!audio) {
-            return;
-        }
-        audio.pause();
-        audio.currentTime = 0;
-        setIsPlaying(false);
-        setPlaybackTime(0);
-    }, []);
-    return {
-        audioURL,
-        isPlaying,
-        mountBlob,
-        playbackTime,
-        stopPlayback,
-        resetPlayback,
-        togglePlayback,
-        playbackDuration,
-        cleanupAudioElement,
-    };
-};
-
-/**
- * useRecordingTiming
- *
- * @author: exode <hello@exode.ru>
- */
-const useRecordingTiming = () => {
-    const [lastDuration, setLastDuration] = useState(0);
-    const [recordingTime, setRecordingTime] = useState(0);
-    const timerRef = useRef(null);
-    const recordingStartRef = useRef(null);
-    const recordingAccumulatedRef = useRef(0);
-    const stopTicker = useCallback(() => {
-        if (timerRef.current) {
-            clearInterval(timerRef.current);
-            timerRef.current = null;
-        }
-    }, []);
-    const startTicker = useCallback(() => {
-        if (timerRef.current) {
-            clearInterval(timerRef.current);
-        }
-        timerRef.current = setInterval(() => {
-            if (recordingStartRef.current === null) {
-                setRecordingTime(roundTo(recordingAccumulatedRef.current));
-                return;
-            }
-            const elapsed = (performance.now() - recordingStartRef.current) / 1000 +
-                recordingAccumulatedRef.current;
-            setRecordingTime(roundTo(elapsed));
-        }, 100);
-    }, []);
-    const startNewSession = useCallback(() => {
-        recordingAccumulatedRef.current = 0;
-        setRecordingTime(0);
-        setLastDuration(0);
-        recordingStartRef.current = performance.now();
-        startTicker();
-    }, [startTicker]);
-    const resumeSession = useCallback(() => {
-        recordingStartRef.current = performance.now();
-        startTicker();
-    }, [startTicker]);
-    const pauseSession = useCallback(() => {
-        if (recordingStartRef.current === null) {
-            return;
-        }
-        const elapsed = (performance.now() - recordingStartRef.current) / 1000;
-        recordingAccumulatedRef.current += elapsed;
-        recordingStartRef.current = null;
-        setRecordingTime(roundTo(recordingAccumulatedRef.current));
-        stopTicker();
-    }, [stopTicker]);
-    const getElapsedMs = useCallback(() => {
-        const accumulated = recordingAccumulatedRef.current;
-        const elapsed = recordingStartRef.current !== null
-            ? (performance.now() - recordingStartRef.current) / 1000 + accumulated
-            : accumulated;
-        return Math.round(elapsed * 1000);
-    }, []);
-    const resetSession = useCallback(() => {
-        const accumulated = recordingAccumulatedRef.current;
-        const elapsed = recordingStartRef.current !== null
-            ? (performance.now() - recordingStartRef.current) / 1000 + accumulated
-            : accumulated;
-        if (elapsed > 0) {
-            setLastDuration(roundTo(elapsed));
-        }
-        stopTicker();
-        recordingStartRef.current = null;
-        recordingAccumulatedRef.current = 0;
-        setRecordingTime(0);
-    }, [stopTicker]);
-    useEffect(() => {
-        return () => {
-            stopTicker();
-        };
-    }, [stopTicker]);
-    return {
-        lastDuration,
-        getElapsedMs,
-        pauseSession,
-        resetSession,
-        recordingTime,
-        resumeSession,
-        startNewSession,
-    };
-};
-
-/**
- * useRecorderVisualization
- *
- * @author: exode <hello@exode.ru>
- */
-const useRecorderVisualization = () => {
-    const [audioLevels, setAudioLevels] = useState(createInitialLevels);
-    const [previewLevels, setPreviewLevels] = useState(createInitialLevels);
-    const analyzerRef = useRef(null);
-    const animationFrameRef = useRef(null);
-    const resetAudioLevels = useCallback(() => {
-        setAudioLevels(createInitialLevels);
-    }, []);
-    const resetPreviewLevels = useCallback(() => {
-        setPreviewLevels(createInitialLevels);
-    }, []);
-    const stopVisualization = useCallback((options) => {
-        var _a, _b;
-        if (animationFrameRef.current) {
-            cancelFrame(animationFrameRef.current);
-            animationFrameRef.current = null;
-        }
-        if (((_a = options === null || options === void 0 ? void 0 : options.closeContext) !== null && _a !== void 0 ? _a : true) && analyzerRef.current) {
-            void analyzerRef.current.context.close();
-            analyzerRef.current = null;
-        }
-        if ((_b = options === null || options === void 0 ? void 0 : options.resetLevels) !== null && _b !== void 0 ? _b : true) {
-            resetAudioLevels();
-        }
-    }, [resetAudioLevels]);
-    const visualize = useCallback(() => {
-        if (!analyzerRef.current) {
-            return;
-        }
-        const { analyser } = analyzerRef.current;
-        const draw = () => {
-            animationFrameRef.current = scheduleFrame(draw);
-            const levels = readFrequencyLevels(analyser);
-            setAudioLevels(levels);
-        };
-        draw();
-    }, []);
-    const resumeVisualization = useCallback(() => {
-        if (analyzerRef.current && !animationFrameRef.current) {
-            visualize();
-        }
-    }, [visualize]);
-    const initializeVisualization = useCallback((stream) => {
-        analyzerRef.current = createStreamAnalyzer(stream);
-        visualize();
-    }, [visualize]);
-    const generatePreviewLevels = useCallback(async (blob) => {
-        try {
-            const levels = await decodeAudioLevels(blob);
-            setAudioLevels(levels);
-            setPreviewLevels(levels);
-        }
-        catch (error) {
-            console.warn('[audio-recorder] Failed to build waveform preview', error);
-            setPreviewLevels(createInitialLevels());
-        }
-    }, []);
-    const cleanupVisualization = useCallback(() => {
-        if (animationFrameRef.current) {
-            cancelFrame(animationFrameRef.current);
-        }
-        animationFrameRef.current = null;
-        if (analyzerRef.current) {
-            void analyzerRef.current.context.close();
-            analyzerRef.current = null;
-        }
-        resetAudioLevels();
-        resetPreviewLevels();
-    }, [resetAudioLevels, resetPreviewLevels]);
-    return {
-        audioLevels,
-        previewLevels,
-        resetAudioLevels,
-        stopVisualization,
-        resetPreviewLevels,
-        resumeVisualization,
-        cleanupVisualization,
-        generatePreviewLevels,
-        initializeVisualization,
-    };
-};
-
-/**
- * useRecordingSender — handles sending a recorded voice message via an upload strategy.
- *
- * @author: exode <hello@exode.ru>
- */
-const useRecordingSender = (options) => {
-    const { uploader, fileName, mimeType, uploadId, audioBlob, onUploaded, getDurationMs, onRecordingError, deleteRecording, autoResetAfterUpload, } = options;
-    const sendRecording = useCallback(async () => {
-        if (!audioBlob) {
-            const error = new Error('Voice recording is not available');
-            onRecordingError === null || onRecordingError === void 0 ? void 0 : onRecordingError(error);
-            return;
-        }
-        if (!uploader) {
-            const error = new Error('Uploader strategy is not defined');
-            onRecordingError === null || onRecordingError === void 0 ? void 0 : onRecordingError(error);
-            throw error;
-        }
-        try {
-            const durationMs = getDurationMs();
-            const durationSec = durationMs / 1000;
-            const file = new File([audioBlob], fileName, {
-                type: audioBlob.type || mimeType,
-            });
-            const uploaded = await uploader(file, { uploadId });
-            await onUploaded(uploaded, durationSec);
-            if (autoResetAfterUpload) {
-                deleteRecording();
-            }
-        }
-        catch (error) {
-            onRecordingError === null || onRecordingError === void 0 ? void 0 : onRecordingError(error);
-            throw error;
-        }
-    }, [
-        uploadId,
-        uploader,
-        fileName,
-        audioBlob,
-        mimeType,
-        onUploaded,
-        getDurationMs,
-        deleteRecording,
-        onRecordingError,
-        autoResetAfterUpload,
-    ]);
-    return { sendRecording };
-};
-
-/**
- * useVoiceRecorder
- *
- * @author: exode <hello@exode.ru>
- */
-function useVoiceRecorder(props) {
-    const { uploadId, uploader, onUploaded, onRecordingStop, onRecordingStart, onRecordingError, onRecordingDelete, onPermissionDenied, fileName = 'record.webm', mimeType = 'audio/webm', autoResetAfterUpload = true, } = props;
-    const [audioBlob, setAudioBlob] = useState(null);
-    const { audioURL, isPlaying, mountBlob, playbackTime, stopPlayback, resetPlayback, togglePlayback: _togglePlayback, playbackDuration, } = useAudioPlayback();
-    const { audioLevels, previewLevels, resetAudioLevels, stopVisualization, resetPreviewLevels, resumeVisualization, cleanupVisualization, generatePreviewLevels, initializeVisualization, } = useRecorderVisualization();
-    const { lastDuration, getElapsedMs, recordingTime, pauseSession, resetSession, resumeSession, startNewSession, } = useRecordingTiming();
-    const resetCurrentRecording = useCallback((opts) => {
-        var _a;
-        setAudioBlob(null);
-        resetPlayback();
-        if ((_a = opts === null || opts === void 0 ? void 0 : opts.resetPreview) !== null && _a !== void 0 ? _a : true) {
-            resetPreviewLevels();
-        }
-        if (opts === null || opts === void 0 ? void 0 : opts.resetLevels) {
-            resetAudioLevels();
-        }
-        if (opts === null || opts === void 0 ? void 0 : opts.notifyDelete) {
-            onRecordingDelete === null || onRecordingDelete === void 0 ? void 0 : onRecordingDelete();
-        }
-    }, [onRecordingDelete, resetAudioLevels, resetPlayback, resetPreviewLevels]);
-    const deleteRecording = useCallback(() => {
-        resetCurrentRecording({
-            resetLevels: true,
-            notifyDelete: true,
-        });
-        resetSession();
-    }, [resetCurrentRecording, resetSession]);
-    const { sendRecording } = useRecordingSender({
-        audioBlob,
-        fileName,
-        mimeType,
-        uploadId,
-        uploader,
-        onUploaded,
-        deleteRecording,
-        onRecordingError,
-        autoResetAfterUpload,
-        getDurationMs: getElapsedMs,
-    });
-    const mountRecordingBlob = useCallback((blob) => {
-        setAudioBlob(blob);
-        mountBlob(blob);
-    }, [mountBlob]);
-    const recorderCallbacks = useMemo(() => ({
-        onDataChunk: () => { },
-        onNeedsPreview: (chunks) => {
-            const snapshot = new Blob(chunks, { type: mimeType });
-            mountRecordingBlob(snapshot);
-            void generatePreviewLevels(snapshot);
-        },
-        onStopped: (chunks, discarded) => {
-            pauseSession();
-            stopVisualization({ resetLevels: false });
-            if (discarded) {
-                resetCurrentRecording({ notifyDelete: true });
-                resetSession();
-                return;
-            }
-            const blob = new Blob(chunks, { type: mimeType });
-            onRecordingStop === null || onRecordingStop === void 0 ? void 0 : onRecordingStop(blob);
-            mountRecordingBlob(blob);
-            void generatePreviewLevels(blob);
-            resetSession();
-        },
-        onPaused: () => {
-            pauseSession();
-            stopVisualization({ resetLevels: false, closeContext: false });
-        },
-        onResumed: () => {
-            resumeSession();
-            resumeVisualization();
-        },
-        onStreamAcquired: (stream) => {
-            initializeVisualization(stream);
-        },
-        onPermissionDenied: (error) => {
-            onPermissionDenied === null || onPermissionDenied === void 0 ? void 0 : onPermissionDenied(error);
-        },
-        onError: (error) => {
-            onRecordingError === null || onRecordingError === void 0 ? void 0 : onRecordingError(error);
-        },
-    }), [
-        generatePreviewLevels,
-        initializeVisualization,
-        mimeType,
-        mountRecordingBlob,
-        onPermissionDenied,
-        onRecordingError,
-        onRecordingStop,
-        pauseSession,
-        resetCurrentRecording,
-        resetSession,
-        resumeSession,
-        resumeVisualization,
-        stopVisualization,
-    ]);
-    const { isPaused, isRecording, togglePause, cleanupStream, stopRecording, cancelRecording, startRecording: _startRecording, } = useMediaRecorder(recorderCallbacks);
-    const startRecording = useCallback(async () => {
-        resetCurrentRecording({ resetLevels: true });
-        await _startRecording(mimeType);
-        onRecordingStart === null || onRecordingStart === void 0 ? void 0 : onRecordingStart();
-        startNewSession();
-    }, [_startRecording, mimeType, onRecordingStart, resetCurrentRecording, startNewSession]);
-    useEffect(() => {
-        return () => {
-            cleanupVisualization();
-            cleanupStream();
-            resetPlayback();
-            resetSession();
-        };
-    }, [cleanupVisualization, cleanupStream, resetPlayback, resetSession]);
-    const togglePlayback = useCallback(() => {
-        _togglePlayback(onRecordingError);
-    }, [_togglePlayback, onRecordingError]);
-    return {
-        audioURL,
-        isPaused,
-        isPlaying,
-        isRecording,
-        audioLevels,
-        lastDuration,
-        playbackTime,
-        recordingTime,
-        previewLevels,
-        playbackDuration,
-        formatTime,
-        stopPlayback,
-        sendRecording,
-        stopRecording,
-        togglePlayback,
-        startRecording,
-        cancelRecording,
-        deleteRecording,
-        toggleRecordingPause: togglePause,
-        hasRecording: Boolean(audioURL),
-    };
-}
-
-/**
- * useAudioBlobLoader — loads audio blob from URL or preloaded data,
- * creates object URL and decodes waveform levels.
- *
- * @author: exode <hello@exode.ru>
- */
-const useAudioBlobLoader = (options) => {
-    const { src, waveformData, preloadedBlob, playbackCallbacks } = options;
-    const [isLoading, setIsLoading] = useState(false);
-    const [isLoaded, setIsLoaded] = useState(false);
-    const [waveformLevels, setWaveformLevels] = useState(waveformData || createInitialLevels);
-    const audioRef = useRef(null);
-    const objectUrlRef = useRef(null);
-    const abortControllerRef = useRef(null);
-    const failedSrcRef = useRef(null);
-    const waveformTokenRef = useRef(0);
-    const waveformDataRef = useRef(waveformData);
-    const callbacksRef = useRef(playbackCallbacks);
-    waveformDataRef.current = waveformData;
-    callbacksRef.current = playbackCallbacks;
-    const createAudioFromBlob = useCallback((blob) => {
-        if (objectUrlRef.current) {
-            revokeObjectURL(objectUrlRef.current);
-        }
-        const url = createObjectURL(blob);
-        objectUrlRef.current = url;
-        const { audio } = createAudioPlayback(url, {
-            onLoadedMetadata: (dur) => callbacksRef.current.onLoadedMetadata(dur),
-            onTimeUpdate: (time) => callbacksRef.current.onTimeUpdate(time),
-            onEnded: () => callbacksRef.current.onEnded(),
-            onPlay: () => { var _a, _b; return (_b = (_a = callbacksRef.current).onPlay) === null || _b === void 0 ? void 0 : _b.call(_a); },
-            onPause: () => { var _a, _b; return (_b = (_a = callbacksRef.current).onPause) === null || _b === void 0 ? void 0 : _b.call(_a); },
-            onStop: () => { var _a, _b; return (_b = (_a = callbacksRef.current).onStop) === null || _b === void 0 ? void 0 : _b.call(_a); },
-            onSeekBackward: () => { var _a, _b; return (_b = (_a = callbacksRef.current).onSeekBackward) === null || _b === void 0 ? void 0 : _b.call(_a); },
-            onSeekForward: () => { var _a, _b; return (_b = (_a = callbacksRef.current).onSeekForward) === null || _b === void 0 ? void 0 : _b.call(_a); },
-            onPreviousTrack: () => { var _a, _b; return (_b = (_a = callbacksRef.current).onPreviousTrack) === null || _b === void 0 ? void 0 : _b.call(_a); },
-            onNextTrack: () => { var _a, _b; return (_b = (_a = callbacksRef.current).onNextTrack) === null || _b === void 0 ? void 0 : _b.call(_a); },
-        });
-        audioRef.current = audio;
-        setIsLoaded(true);
-    }, []);
-    /**
-     * Waveform is cosmetic: some files (e.g. mp3 with junk before the first
-     * frame) fail to decode in Safari while playing fine, so a decode error
-     * must never block playback. Token keeps only the latest decode.
-     */
-    const applyWaveformLevels = useCallback(async (blob) => {
-        if (waveformData) {
-            return;
-        }
-        waveformTokenRef.current += 1;
-        const token = waveformTokenRef.current;
-        try {
-            const levels = await decodeAudioLevels(blob);
-            if (token === waveformTokenRef.current) {
-                setWaveformLevels(levels);
-            }
-        }
-        catch (error) {
-            console.warn('[voice-player] Failed to decode waveform', error);
-        }
-    }, [waveformData]);
-    const mountFromBlob = useCallback(async (blob) => {
-        if (audioRef.current) {
-            return;
-        }
-        setIsLoading(true);
-        try {
-            createAudioFromBlob(blob);
-        }
-        catch (error) {
-            console.warn('[voice-player] Failed to mount blob', error);
-        }
-        finally {
-            setIsLoading(false);
-        }
-        void applyWaveformLevels(blob);
-    }, [applyWaveformLevels, createAudioFromBlob]);
-    const ensureAudioLoaded = useCallback(async (options) => {
-        var _a;
-        if (audioRef.current) {
-            return;
-        }
-        if (failedSrcRef.current === src) {
-            if (!(options === null || options === void 0 ? void 0 : options.retryFailed)) {
-                return;
-            }
-            failedSrcRef.current = null;
-        }
-        if (preloadedBlob) {
-            return mountFromBlob(preloadedBlob);
-        }
-        if (!src) {
-            return;
-        }
-        (_a = abortControllerRef.current) === null || _a === void 0 ? void 0 : _a.abort();
-        const controller = new AbortController();
-        abortControllerRef.current = controller;
-        setIsLoading(true);
-        try {
-            const blob = await fetchAudioBlob(src, controller.signal);
-            if (controller.signal.aborted) {
-                return;
-            }
-            createAudioFromBlob(blob);
-            void applyWaveformLevels(blob);
-        }
-        catch (error) {
-            if (error instanceof DOMException && error.name === 'AbortError') {
-                return;
-            }
-            failedSrcRef.current = src;
-            console.warn('[voice-player] Failed to load audio', error);
-        }
-        finally {
-            if (!controller.signal.aborted) {
-                setIsLoading(false);
-            }
-        }
-    }, [src, preloadedBlob, mountFromBlob, applyWaveformLevels, createAudioFromBlob]);
-    /** Cleanup on src change or unmount */
-    useEffect(() => {
-        failedSrcRef.current = null;
-        /** Drop the previous waveform so a failed decode cannot leave a foreign one */
-        setWaveformLevels(waveformDataRef.current || createInitialLevels());
-        return () => {
-            var _a;
-            (_a = abortControllerRef.current) === null || _a === void 0 ? void 0 : _a.abort();
-            waveformTokenRef.current += 1;
-            if (audioRef.current) {
-                cleanupAudio(audioRef.current);
-                audioRef.current = null;
-            }
-            if (objectUrlRef.current) {
-                revokeObjectURL(objectUrlRef.current);
-                objectUrlRef.current = null;
-            }
-            setIsLoaded(false);
-        };
-    }, [src]);
-    useEffect(() => {
-        if (preloadedBlob && !audioRef.current) {
-            void mountFromBlob(preloadedBlob);
-        }
-    }, [preloadedBlob, mountFromBlob]);
-    useEffect(() => {
-        if (waveformData) {
-            waveformTokenRef.current += 1;
-            setWaveformLevels(waveformData);
-        }
-    }, [waveformData]);
-    return {
-        audioRef,
-        isLoading,
-        isLoaded,
-        waveformLevels,
-        ensureAudioLoaded,
-    };
-};
-
-/**
- * Global audio playback manager — ensures only one audio plays at a time
- *
- * @author: exode <hello@exode.ru>
- */
-const listeners = new Set();
-const audioPlaybackManager = {
-    /** Register a stop callback for a player instance */
-    subscribe: (callback) => {
-        listeners.add(callback);
-        return () => {
-            listeners.delete(callback);
-        };
-    },
-    /** Stop all other players except the caller */
-    stopOthers: (except) => {
-        listeners.forEach((cb) => {
-            if (cb !== except) {
-                cb();
-            }
-        });
-    },
-};
-
-/**
- * useVoiceMessagePlayer
- *
- * @author: exode <hello@exode.ru>
- */
-const useVoiceMessagePlayer = (options) => {
-    const { src, onEnded, onPreviousTrack, onNextTrack, waveformData, preloadedBlob, duration: externalDuration, } = options;
-    const onEndedRef = useRef(onEnded);
-    const onPreviousTrackRef = useRef(onPreviousTrack);
-    const onNextTrackRef = useRef(onNextTrack);
-    onEndedRef.current = onEnded;
-    onPreviousTrackRef.current = onPreviousTrack;
-    onNextTrackRef.current = onNextTrack;
-    const [isPlaying, setIsPlaying] = useState(false);
-    const [currentTime, setCurrentTime] = useState(0);
-    const [duration, setDuration] = useState(externalDuration || 0);
-    const progress = duration > 0 ? currentTime / duration : 0;
-    /** Stop this player (called by manager when another player starts) */
-    const stopThis = useCallback(() => {
-        const audio = audioRef.current;
-        if (audio && !audio.paused) {
-            audio.pause();
-        }
-        setIsPlaying(false);
-    }, []);
-    /** Subscribe to global manager on mount */
-    useEffect(() => {
-        return audioPlaybackManager.subscribe(stopThis);
-    }, [stopThis]);
-    const { audioRef, isLoading, isLoaded, waveformLevels, ensureAudioLoaded, } = useAudioBlobLoader({
-        src,
-        waveformData,
-        preloadedBlob,
-        playbackCallbacks: {
-            onLoadedMetadata: (dur) => {
-                if (!externalDuration && dur && isFinite(dur) && dur > 0.5) {
-                    setDuration(dur);
-                }
-            },
-            onTimeUpdate: (time) => setCurrentTime(time),
-            onEnded: () => {
-                var _a;
-                setIsPlaying(false);
-                setCurrentTime(0);
-                (_a = onEndedRef.current) === null || _a === void 0 ? void 0 : _a.call(onEndedRef);
-            },
-            onPlay: () => setIsPlaying(true),
-            onPause: () => setIsPlaying(false),
-            onStop: () => {
-                setIsPlaying(false);
-                setCurrentTime(0);
-            },
-            onPreviousTrack: () => { var _a; return (_a = onPreviousTrackRef.current) === null || _a === void 0 ? void 0 : _a.call(onPreviousTrackRef); },
-            onNextTrack: () => { var _a; return (_a = onNextTrackRef.current) === null || _a === void 0 ? void 0 : _a.call(onNextTrackRef); },
-        },
-    });
-    /** Pre-fetch audio without playing (for viewport preloading) */
-    const prefetch = useCallback(() => {
-        if (isLoading || audioRef.current) {
-            return;
-        }
-        void ensureAudioLoaded();
-    }, [isLoading, ensureAudioLoaded]);
-    /** Load audio and auto-play after loaded */
-    const preload = useCallback(() => {
-        if (isLoading || audioRef.current) {
-            return;
-        }
-        audioPlaybackManager.stopOthers(stopThis);
-        void ensureAudioLoaded({ retryFailed: true }).then(() => {
-            const audio = audioRef.current;
-            if (audio) {
-                audio.play()
-                    .then(() => setIsPlaying(true))
-                    .catch(() => setIsPlaying(false));
-            }
-        });
-    }, [isLoading, ensureAudioLoaded, stopThis, audioRef]);
-    /** Programmatically start playback (used for chained playback) */
-    const play = useCallback(() => {
-        const audio = audioRef.current;
-        if (audio) {
-            audioPlaybackManager.stopOthers(stopThis);
-            audio.play()
-                .then(() => setIsPlaying(true))
-                .catch(() => setIsPlaying(false));
-        }
-        else {
-            preload();
-        }
-    }, [stopThis, preload, audioRef]);
-    /** Toggle play/pause (only works after audio is loaded) */
-    const togglePlayback = useCallback(() => {
-        const audio = audioRef.current;
-        if (!audio || isLoading) {
-            return;
-        }
-        if (audio.paused) {
-            audioPlaybackManager.stopOthers(stopThis);
-            audio.play()
-                .then(() => setIsPlaying(true))
-                .catch(() => setIsPlaying(false));
-        }
-        else {
-            audio.pause();
-            setIsPlaying(false);
-        }
-    }, [isLoading, stopThis, audioRef]);
-    const seekTo = useCallback((seekPercent) => {
-        const audio = audioRef.current;
-        if (!audio || !isFinite(audio.duration)) {
-            return;
-        }
-        const time = seekPercent * audio.duration;
-        audio.currentTime = time;
-        setCurrentTime(time);
-    }, [audioRef]);
-    /** Seek to a specific time in seconds and start playback */
-    const seekToTime = useCallback((seconds) => {
-        const audio = audioRef.current;
-        if (audio && isFinite(audio.duration)) {
-            audioPlaybackManager.stopOthers(stopThis);
-            audio.currentTime = Math.max(0, Math.min(seconds, audio.duration));
-            setCurrentTime(audio.currentTime);
-            audio.play()
-                .then(() => setIsPlaying(true))
-                .catch(() => setIsPlaying(false));
-        }
-        else {
-            void ensureAudioLoaded({ retryFailed: true }).then(() => {
-                const loadedAudio = audioRef.current;
-                if (loadedAudio) {
-                    audioPlaybackManager.stopOthers(stopThis);
-                    loadedAudio.currentTime = Math.max(0, Math.min(seconds, loadedAudio.duration || seconds));
-                    setCurrentTime(loadedAudio.currentTime);
-                    loadedAudio.play()
-                        .then(() => setIsPlaying(true))
-                        .catch(() => setIsPlaying(false));
-                }
-            });
-        }
-    }, [
-        audioRef,
-        stopThis,
-        ensureAudioLoaded,
-    ]);
-    /** Sync external duration */
-    useEffect(() => {
-        if (externalDuration) {
-            setDuration(externalDuration);
-        }
-    }, [externalDuration]);
-    return {
-        play,
-        progress,
-        duration,
-        isLoaded,
-        isPlaying,
-        isLoading,
-        currentTime,
-        waveformLevels,
-        seekTo,
-        seekToTime,
-        prefetch,
-        preload,
-        formatTime,
-        togglePlayback,
-    };
-};
-
-/**
- * useAudioRecorderHandlers — recording/send/cancel handlers for AudioRecorder
- *
- * @author: exode <hello@exode.ru>
- */
-const useAudioRecorderHandlers = (options) => {
-    const { vibrate, recorder, messages, onUploadError, } = options;
-    const { audioURL, isPaused, isRecording, hasRecording, stopPlayback, stopRecording, sendRecording, togglePlayback, startRecording, cancelRecording, deleteRecording, toggleRecordingPause, } = recorder;
-    const shouldSendAfterStopRef = useRef(false);
-    const [isSending, setIsSending] = useState(false);
-    const startNewRecording = useCallback(async () => {
-        if (isRecording) {
-            return;
-        }
-        try {
-            await startRecording();
-            vibrate(50);
-        }
-        catch (error) {
-            onUploadError === null || onUploadError === void 0 ? void 0 : onUploadError(error);
-        }
-    }, [
-        vibrate,
-        isRecording,
-        onUploadError,
-        startRecording,
-    ]);
-    const handleRecordToggle = useCallback(() => {
-        if (!isRecording) {
-            if (audioURL) {
-                stopPlayback();
-                deleteRecording();
-            }
-            void startNewRecording();
-            return;
-        }
-        if (isPaused) {
-            stopPlayback();
-        }
-        toggleRecordingPause();
-    }, [
-        audioURL,
-        isPaused,
-        isRecording,
-        stopPlayback,
-        deleteRecording,
-        startNewRecording,
-        toggleRecordingPause,
-    ]);
-    const handleSend = useCallback(async () => {
-        shouldSendAfterStopRef.current = false;
-        setIsSending(true);
-        try {
-            stopPlayback();
-            await sendRecording();
-        }
-        catch (error) {
-            const uploadError = error instanceof Error
-                ? error
-                : new Error(messages.errors.loadFileFailed);
-            onUploadError === null || onUploadError === void 0 ? void 0 : onUploadError(uploadError);
-        }
-        finally {
-            setIsSending(false);
-        }
-    }, [
-        stopPlayback,
-        onUploadError,
-        sendRecording,
-        messages.errors.loadFileFailed,
-    ]);
-    const handleSendRequest = useCallback(() => {
-        if (isSending) {
-            return;
-        }
-        if (isRecording) {
-            setIsSending(true);
-            shouldSendAfterStopRef.current = true;
-            stopRecording();
-            return;
-        }
-        void handleSend();
-    }, [
-        isSending,
-        handleSend,
-        isRecording,
-        stopRecording,
-    ]);
-    const handleCancel = useCallback(() => {
-        shouldSendAfterStopRef.current = false;
-        if (isRecording) {
-            cancelRecording();
-            return;
-        }
-        if (audioURL) {
-            stopPlayback();
-            deleteRecording();
-        }
-    }, [
-        audioURL,
-        isRecording,
-        stopPlayback,
-        deleteRecording,
-        cancelRecording,
-    ]);
-    const handlePlaybackToggle = useCallback(() => {
-        if (!hasRecording) {
-            return;
-        }
-        togglePlayback();
-    }, [hasRecording, togglePlayback]);
-    /** Auto-send after stop */
-    useEffect(() => {
-        if (!isRecording
-            && hasRecording
-            && shouldSendAfterStopRef.current) {
-            shouldSendAfterStopRef.current = false;
-            void handleSend();
-        }
-    }, [
-        handleSend,
-        isRecording,
-        hasRecording,
-    ]);
-    return {
-        isSending,
-        handleCancel,
-        handleSendRequest,
-        handleRecordToggle,
-        handlePlaybackToggle,
-    };
-};
-
-/**
- * AudioRecorder styled components
- *
- * @author: exode <hello@exode.ru>
- */
-const Container = styled.div `
-    position: relative;
-    width: 100%;
-    transition: color 200ms ease, background-color 200ms ease;
-    color: var(--text_primary, #0a0a0a);
-`;
-
-/**
- * IdleControl styles
- *
- * @author: exode <hello@exode.ru>
- */
-const IdleWrapper = styled.div `
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: 16px;
-`;
-const IdleButton = styled.button `
-    position: relative;
-    width: 72px;
-    height: 72px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 36px;
-    border: 0;
-    background: var(--background_content, #ffffff);
-    color: color-mix(in srgb, var(--accent, #3f8ae0) 80%, white 20%);
-    cursor: pointer;
-    transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
-
-    &:hover {
-        transform: translateY(-2px);
-    }
-
-    &:active {
-        transform: translateY(0);
-    }
-
-    &:focus-visible {
-        outline: 2px solid color-mix(in srgb, var(--accent, #3f8ae0) 70%, transparent);
-        outline-offset: 4px;
-    }
-`;
-const IdleButtonOutline = styled.span `
-    position: absolute;
-    inset: 0;
-    border-radius: 32px;
-    border: 1px solid color-mix(in srgb, var(--accent, #3f8ae0) 28%, transparent);
-    pointer-events: none;
-`;
-const IdleButtonGlow = styled.span `
-    position: absolute;
-    inset: 8px;
-    border-radius: 28px;
-    background: radial-gradient(
-            120% 120% at 50% 50%,
-            color-mix(in srgb, var(--accent, #3f8ae0) 24%, transparent) 0%,
-            color-mix(in srgb, var(--accent, #3f8ae0) 10%, transparent) 65%,
-            transparent 100%
-    );
-    filter: blur(4px);
-    pointer-events: none;
-`;
-const IdleInstruction = styled.div `
-    font-size: 14px;
-    text-align: center;
-    color: color-mix(in srgb, var(--text_primary, #0a0a0a) 60%, transparent);
-`;
-
-const IdleControl = (props) => {
-    const { onClick, instruction, startAriaLabel, } = props;
-    return (jsxs(IdleWrapper, { children: [jsxs(IdleButton, { type: "button", onClick: onClick, "aria-label": startAriaLabel, children: [jsx(IdleButtonOutline, { "aria-hidden": true }), jsx(IdleButtonGlow, { "aria-hidden": true }), jsx(Icon32Microphone, { height: 48, width: 48 })] }), jsx(IdleInstruction, { children: instruction })] }));
-};
-
-const Bars = styled.div `
-    position: absolute;
-    inset: 0;
-    display: flex;
-    align-items: flex-end;
-    gap: 3px;
-`;
-const Bar = styled.div `
-    flex: 1;
-    min-width: 2px;
-    border-radius: 9999px;
-    background: var(--white, #ffffff);
-    opacity: 0.6;
-    transition: height 120ms ease, opacity 120ms ease;
-`;
-
-const WaveformBars = (props) => {
-    const { values, progress, styleInterpolator, scale = 40, minHeight = 6, divider = 100, } = props;
-    return (jsx(Bars, { children: values.map((value, index) => {
-            const normalized = clampValue(value);
-            const height = Math.max(minHeight, (normalized / divider) * scale);
-            const barProgress = values.length > 1 ? index / (values.length - 1) : 0;
-            const isPlayed = (progress !== null && progress !== void 0 ? progress : 0) > 0 && barProgress <= (progress !== null && progress !== void 0 ? progress : 0);
-            const interpolated = styleInterpolator === null || styleInterpolator === void 0 ? void 0 : styleInterpolator({
-                normalized,
-                height,
-                index,
-                progress: progress !== null && progress !== void 0 ? progress : 0,
-                barProgress,
-                isPlayed,
-            });
-            return (jsx(Bar, { style: {
-                    height: `${height}px`,
-                    ...interpolated,
-                } }, index));
-        }) }));
-};
-
-/**
- * RecordingShell styles
- *
- * @author: exode <hello@exode.ru>
- */
-const Wrapper$1 = styled.div `
-    display: flex;
-    align-items: center;
-    gap: 12px;
-    padding: 10px 14px;
-    border-radius: 9999px;
-    background: var(--background_hover, color-mix(in srgb, var(--text_primary, #0a0a0a) 6%, transparent));
-`;
-const CancelButton$1 = styled.button `
-    width: 38px;
-    height: 38px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 19px;
-    background: color-mix(in srgb, var(--exode_red) 10%, transparent);
-    border: 0;
-    flex-shrink: 0;
-    color: color-mix(in srgb, var(--text_primary, #0a0a0a) 54%, transparent);
-    cursor: pointer;
-    transition: transform 160ms ease;
-
-    &:hover:not(:disabled) {
-        transform: translateY(-1px);
-    }
-
-    &:active:not(:disabled) {
-        transform: translateY(0);
-    }
-`;
-const Track = styled.div `
-    flex: 1;
-    display: flex;
-    align-items: center;
-    gap: 12px;
-    padding: 8px 10px;
-    border-radius: 9999px;
-    background: color-mix(in srgb, var(--text_primary, #0a0a0a) 10%, transparent);
-`;
-const CircleButton = styled.button `
-    width: 38px;
-    height: 38px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 19px;
-    border: 0;
-    cursor: pointer;
-    transition: transform 160ms ease, color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
-    flex-shrink: 0;
-    background: var(--background_content, #ffffff);
-
-    color: ${({ $variant }) => {
-    if ($variant === 'record') {
-        return 'var(--exode_red, #ed1c24)';
-    }
-    if ($variant === 'resume') {
-        return 'color-mix(in srgb, var(--accent, #3f8ae0) 86%, white 14%)';
-    }
-    return 'color-mix(in srgb, var(--text_primary, #0a0a0a) 80%, transparent)';
-}};
-
-    &:hover:not(:disabled) {
-        transform: translateY(-1px);
-    }
-
-    &:active:not(:disabled) {
-        transform: translateY(0);
-    }
-
-    &:focus-visible {
-        outline: 2px solid color-mix(in srgb, var(--accent, #3f8ae0) 70%, transparent);
-        outline-offset: 2px;
-    }
-
-    &:disabled {
-        cursor: not-allowed;
-        opacity: 0.45;
-        transform: none;
-    }
-`;
-const Waveform = styled.div `
-    position: relative;
-    flex: ${({ $expanded }) => ($expanded ? 1.4 : 1)};
-    height: 34px;
-    display: flex;
-    align-items: center;
-    overflow: hidden;
-`;
-const Timer$1 = styled.span `
-    text-align: right;
-    font-size: 13px;
-    font-weight: 600;
-    color: color-mix(in srgb, var(--text_primary, #0a0a0a) 86%, transparent);
-`;
-const SendButton$1 = styled.button `
-    width: 40px;
-    height: 40px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 20px;
-    border: 0;
-    cursor: pointer;
-    background: var(--accent, #3f8ae0);
-    color: var(--white, #ffffff);
-    transition: transform 160ms ease, opacity 160ms ease;
-
-    &:hover:not(:disabled) {
-        transform: translateY(-1px);
-    }
-
-    &:active:not(:disabled) {
-        transform: translateY(0);
-    }
-
-    &:disabled {
-        opacity: 0.45;
-        cursor: not-allowed;
-    }
-`;
-const SpinnerSlot = styled.div `
-    width: 22px;
-    height: 22px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-`;
-const Spinner = styled.span `
-    width: 100%;
-    height: 100%;
-    display: inline-block;
-    box-sizing: border-box;
-    border-radius: 50%;
-    border: 2px solid rgba(255, 255, 255, 0.3);
-    border-top-color: var(--white, #ffffff);
-    border-right-color: var(--white, #ffffff);
-    animation: audioRecorderSpinner 0.75s linear infinite;
-
-    @keyframes audioRecorderSpinner {
-        from {
-            transform: rotate(0deg);
-        }
-
-        to {
-            transform: rotate(360deg);
-        }
-    }
-`;
-
-const RecordingShell = (props) => {
-    const { isPaused, isPlaying, isSending, isRecording, audioLevels, hasRecording, playbackTime, previewLevels, recordingTime, stopAriaLabel, playAriaLabel, sendAriaLabel, startAriaLabel, cancelAriaLabel, playbackDuration, pausePlaybackAriaLabel, pauseRecordingAriaLabel, resumeRecordingAriaLabel, onSend, onCancel, formatTime, onRecordToggle, onTogglePlayback, } = props;
-    const { lastDuration } = props;
-    const isPreview = !isRecording || isPaused;
-    const waveformValues = isRecording ? audioLevels : (hasRecording ? previewLevels : audioLevels);
-    const effectiveDuration = recordingTime
-        || playbackDuration
-        || lastDuration
-        || 1;
-    const progress = (isPreview && isPlaying)
-        ? Math.min(1, playbackTime / effectiveDuration)
-        : 0;
-    const displayTime = useMemo(() => {
-        if (isPlaying) {
-            return formatTime(playbackTime);
-        }
-        if (isRecording && !isPaused) {
-            return formatTime(recordingTime);
-        }
-        if (isRecording && isPaused) {
-            return formatTime(recordingTime);
-        }
-        if (lastDuration > 0) {
-            return formatTime(lastDuration);
-        }
-        if (hasRecording) {
-            if (playbackDuration > 0.5) {
-                return formatTime(playbackDuration);
-            }
-            if (recordingTime > 0) {
-                return formatTime(recordingTime);
-            }
-        }
-        return formatTime(0);
-    }, [
-        isPaused,
-        isPlaying,
-        formatTime,
-        isRecording,
-        lastDuration,
-        hasRecording,
-        playbackTime,
-        recordingTime,
-        playbackDuration,
-    ]);
-    const recordButtonDisabled = isSending;
-    const recordButtonIcon = !isRecording || isPaused
-        ? jsx(Icon16Microphone, { width: 24, height: 24 })
-        : jsx(Icon16Pause, { width: 24, height: 24 });
-    const recordButtonVariant = !isRecording || isPaused ? 'resume' : 'record';
-    const recordButtonAria = !isRecording
-        ? startAriaLabel
-        : isPaused
-            ? resumeRecordingAriaLabel
-            : pauseRecordingAriaLabel || stopAriaLabel;
-    const canShowPlayback = !isRecording || isPaused;
-    const playbackDisabled = !hasRecording && !isRecording;
-    const playbackIcon = isPlaying
-        ? jsx(Icon16Pause, { width: 24, height: 24 })
-        : jsx(Icon16Play, { width: 24, height: 24 });
-    const playbackAria = isPlaying ? pausePlaybackAriaLabel : playAriaLabel;
-    const sendDisabled = isSending || (!hasRecording && !isRecording);
-    return (jsxs(Wrapper$1, { children: [jsx(CancelButton$1, { type: "button", onClick: onCancel, "aria-label": cancelAriaLabel, children: jsx(Icon28DeleteOutlineAndroid, { fill: "var(--exode_red)", width: 24, height: 24, style: { minWidth: 24 } }) }), jsxs(Track, { children: [jsx(CircleButton, { type: "button", "$variant": recordButtonVariant, onClick: onRecordToggle, "aria-label": recordButtonAria, disabled: recordButtonDisabled, children: recordButtonIcon }), !canShowPlayback ? null : (jsx(CircleButton, { type: "button", "$variant": "play", onClick: onTogglePlayback, "aria-label": playbackAria, disabled: playbackDisabled, children: playbackIcon })), jsx(Waveform, { "$expanded": canShowPlayback, children: jsx(WaveformBars, { scale: 42, minHeight: 6, divider: 100, progress: progress, values: waveformValues, styleInterpolator: ({ normalized, isPlayed, progress: p }) => ({
-                                height: `${12 + normalized / 2}px`,
-                                maxHeight: '34px',
-                                opacity: p > 0
-                                    ? (isPlayed ? 0.80 : 0.22)
-                                    : 0.38 + Math.min(0.5, normalized / 120),
-                                transition: 'opacity 80ms ease',
-                            }) }) }), jsx(Timer$1, { children: displayTime })] }), jsx(SendButton$1, { type: "button", onClick: onSend, disabled: sendDisabled, "aria-label": sendAriaLabel, children: isSending ? (jsx(SpinnerSlot, { children: jsx(Spinner, {}) })) : (jsx(Icon28SendOutline, { width: 24, height: 24 })) })] }));
-};
-
-/**
- * AudioRecorder messages — i18n-ready message definitions and merge utility
- *
- * @author: exode <hello@exode.ru>
- */
-const DEFAULT_MESSAGES = {
-    buttons: {
-        cancel: 'Cancel',
-        send: 'Send',
-    },
-    instruction: 'Tap to start recording',
-    aria: {
-        startRecording: 'Start recording voice message',
-        stopRecording: 'Stop recording voice message',
-        pauseRecording: 'Pause recording',
-        resumeRecording: 'Resume recording',
-        playRecording: 'Play recording',
-        pausePlayback: 'Pause playback',
-    },
-    errors: {
-        loadFileFailed: 'Failed to upload audio file',
-    },
-};
-const mergeMessages = (custom) => {
-    var _a;
-    if (!custom) {
-        return DEFAULT_MESSAGES;
-    }
-    return {
-        buttons: {
-            ...DEFAULT_MESSAGES.buttons,
-            ...custom.buttons,
-        },
-        instruction: (_a = custom.instruction) !== null && _a !== void 0 ? _a : DEFAULT_MESSAGES.instruction,
-        aria: {
-            ...DEFAULT_MESSAGES.aria,
-            ...custom.aria,
-        },
-        errors: {
-            ...DEFAULT_MESSAGES.errors,
-            ...custom.errors,
-        },
-    };
-};
-
-const AudioRecorder = (props) => {
-    const { fileName, uploadId, mimeType, className, uploader, onUploaded, onUploadError, onRecordingStop, onRecordingError, onRecordingStart, onRecordingDelete, onPermissionDenied, autoResetAfterUpload, messages: customMessages, } = props;
-    const messages = useMemo(() => mergeMessages(customMessages), [customMessages]);
-    const [resolvedUploadId] = useState(() => uploadId !== null && uploadId !== void 0 ? uploadId : (typeof crypto !== 'undefined' && 'randomUUID' in crypto
-        ? crypto.randomUUID()
-        : `upload-${Date.now()}`));
-    const handleRecorderError = useCallback((error) => {
-        onRecordingError === null || onRecordingError === void 0 ? void 0 : onRecordingError(error);
-        onUploadError === null || onUploadError === void 0 ? void 0 : onUploadError(error);
-    }, [onRecordingError, onUploadError]);
-    const vibrate = useCallback((pattern) => {
-        if (typeof navigator !== 'undefined' && 'vibrate' in navigator) {
-            navigator.vibrate(pattern);
-        }
-    }, []);
-    const recorder = useVoiceRecorder({
-        fileName,
-        mimeType,
-        onRecordingStop,
-        onRecordingStart,
-        onRecordingDelete,
-        onPermissionDenied,
-        autoResetAfterUpload,
-        uploader,
-        uploadId: resolvedUploadId,
-        onRecordingError: handleRecorderError,
-        onUploaded: onUploaded !== null && onUploaded !== void 0 ? onUploaded : (() => { }),
-    });
-    const { isSending, handleCancel, handleSendRequest, handleRecordToggle, handlePlaybackToggle, } = useAudioRecorderHandlers({
-        vibrate,
-        recorder,
-        messages,
-        onUploadError,
-    });
-    const { isPaused, isPlaying, formatTime, audioLevels, isRecording, lastDuration, playbackTime, hasRecording, previewLevels, recordingTime, playbackDuration, } = recorder;
-    const showRecorderBar = isRecording || hasRecording || isSending;
-    return (jsx(Container, { className: className, children: showRecorderBar ? (jsx(RecordingShell, { isPaused: isPaused, isSending: isSending, isPlaying: isPlaying, formatTime: formatTime, onCancel: handleCancel, isRecording: isRecording, audioLevels: audioLevels, onSend: handleSendRequest, playbackTime: playbackTime, lastDuration: lastDuration, hasRecording: hasRecording, previewLevels: previewLevels, recordingTime: recordingTime, playbackDuration: playbackDuration, onRecordToggle: handleRecordToggle, sendAriaLabel: messages.buttons.send, onTogglePlayback: handlePlaybackToggle, cancelAriaLabel: messages.buttons.cancel, playAriaLabel: messages.aria.playRecording, stopAriaLabel: messages.aria.stopRecording, startAriaLabel: messages.aria.startRecording, pauseRecordingAriaLabel: messages.aria.pauseRecording, resumeRecordingAriaLabel: messages.aria.resumeRecording, pausePlaybackAriaLabel: messages.aria.pausePlayback })) : (jsx(IdleControl, { onClick: handleRecordToggle, startAriaLabel: messages.aria.startRecording, instruction: messages.instruction })) }));
-};
-
-/**
- * useVoiceRecorderInput — orchestrates recording, sending and timeline for VoiceRecorderInput
- *
- * @author: exode <hello@exode.ru>
- */
-const useVoiceRecorderInput = (options) => {
-    const { onSend, onError, onCancel, uploader, onUploaded, onPermissionDenied, autoStart = true, mimeType = 'audio/webm', fileName = 'voice-message.webm', } = options;
-    const [isSending, setIsSending] = useState(false);
-    const [timelineLevels, setTimelineLevels] = useState([]);
-    const audioBlobRef = useRef(null);
-    const audioLevelsRef = useRef([]);
-    const lastDurationRef = useRef(0);
-    const shouldSendAfterStopRef = useRef(false);
-    const doSendRef = useRef();
-    const autoStartedRef = useRef(false);
-    const [uploadId] = useState(() => typeof crypto !== 'undefined' && 'randomUUID' in crypto
-        ? crypto.randomUUID()
-        : `upload-${Date.now()}`);
-    const handleRecordingStop = useCallback((blob) => {
-        var _a;
-        audioBlobRef.current = blob;
-        if (shouldSendAfterStopRef.current) {
-            shouldSendAfterStopRef.current = false;
-            void ((_a = doSendRef.current) === null || _a === void 0 ? void 0 : _a.call(doSendRef));
-        }
-    }, []);
-    const recorder = useVoiceRecorder({
-        fileName,
-        mimeType,
-        uploadId,
-        onPermissionDenied,
-        onRecordingStop: handleRecordingStop,
-        onRecordingError: onError,
-        uploader: onSend ? undefined : uploader,
-        onUploaded: onSend ? (() => { }) : (onUploaded !== null && onUploaded !== void 0 ? onUploaded : (() => { })),
-    });
-    const { audioLevels, isPaused, isRecording, recordingTime, hasRecording, stopPlayback, sendRecording, stopRecording, startRecording, cancelRecording, deleteRecording, toggleRecordingPause, } = recorder;
-    audioLevelsRef.current = audioLevels;
-    useEffect(() => {
-        if (recordingTime > 0) {
-            lastDurationRef.current = recordingTime;
-        }
-    }, [recordingTime]);
-    const isPreview = isPaused || (!isRecording && hasRecording);
-    const isActiveRecording = isRecording && !isPaused;
-    useEffect(() => {
-        if (!isActiveRecording) {
-            return;
-        }
-        const interval = setInterval(() => {
-            const levels = audioLevelsRef.current;
-            const peak = levels.length > 0 ? Math.max(...levels) : 0;
-            setTimelineLevels((prev) => [...prev, peak]);
-        }, TIMELINE_SAMPLE_INTERVAL);
-        return () => clearInterval(interval);
-    }, [isActiveRecording]);
-    useEffect(() => {
-        if (isRecording && !isPaused) {
-            setTimelineLevels([]);
-        }
-    }, [isRecording]);
-    const handleResume = useCallback(() => {
-        stopPlayback();
-        toggleRecordingPause();
-    }, [
-        stopPlayback,
-        toggleRecordingPause,
-    ]);
-    const handlePause = toggleRecordingPause;
-    const handleCancel = useCallback(() => {
-        shouldSendAfterStopRef.current = false;
-        if (isRecording) {
-            cancelRecording();
-        }
-        else if (hasRecording) {
-            stopPlayback();
-            deleteRecording();
-        }
-        onCancel === null || onCancel === void 0 ? void 0 : onCancel();
-    }, [
-        onCancel,
-        isRecording,
-        hasRecording,
-        stopPlayback,
-        cancelRecording,
-        deleteRecording,
-    ]);
-    const doSend = useCallback(async () => {
-        setIsSending(true);
-        try {
-            stopPlayback();
-            if (onSend) {
-                if (!audioBlobRef.current) {
-                    return;
-                }
-                const file = new File([audioBlobRef.current], fileName, { type: audioBlobRef.current.type || mimeType });
-                await onSend(file, recordingTime || lastDurationRef.current || 0);
-                deleteRecording();
-            }
-            else {
-                await sendRecording();
-            }
-        }
-        catch (error) {
-            onError === null || onError === void 0 ? void 0 : onError(error);
-        }
-        finally {
-            setIsSending(false);
-        }
-    }, [
-        onSend,
-        onError,
-        fileName,
-        mimeType,
-        recordingTime,
-        sendRecording,
-        stopPlayback,
-        deleteRecording,
-    ]);
-    doSendRef.current = doSend;
-    const handleSendRequest = useCallback(async () => {
-        if (isSending) {
-            return;
-        }
-        if (isRecording) {
-            shouldSendAfterStopRef.current = true;
-            stopRecording();
-            return;
-        }
-        await doSend();
-    }, [
-        doSend,
-        isRecording,
-        isSending,
-        stopRecording,
-    ]);
-    useEffect(() => {
-        if (autoStart && !autoStartedRef.current) {
-            autoStartedRef.current = true;
-            void startRecording().catch((error) => {
-                onPermissionDenied === null || onPermissionDenied === void 0 ? void 0 : onPermissionDenied(error);
-            });
-        }
-    }, [autoStart]);
-    return {
-        recorder,
-        isSending,
-        isPreview,
-        timelineLevels,
-        lastDurationRef,
-        handleResume,
-        handlePause,
-        handleCancel,
-        handleSendRequest,
-    };
-};
-
-const PreviewBars = (props) => {
-    var _a, _b;
-    const { isPlaying, playbackTime, lastDuration, previewLevels, recordingTime, timelineLevels, visibleBarsCount, } = props;
-    const maxBars = visibleBarsCount;
-    const sourceLevels = timelineLevels.length > 0
-        ? timelineLevels
-        : previewLevels;
-    if (!sourceLevels.length) {
-        return (jsx(Fragment, { children: Array.from({ length: maxBars }, (_, i) => (jsx("div", { style: {
-                    width: `${TIMELINE_BAR_WIDTH}px`,
-                    height: `${TIMELINE_BAR_MIN_HEIGHT}px`,
-                    borderRadius: '9999px',
-                    flexShrink: 0,
-                    background: 'color-mix(in srgb, var(--text_primary, #0a0a0a) 15%, transparent)',
-                } }, i))) }));
-    }
-    /** Interpolate source levels to fill container */
-    const bars = [];
-    for (let i = 0; i < maxBars; i++) {
-        const srcIndex = (i / maxBars) * sourceLevels.length;
-        const low = Math.floor(srcIndex);
-        const high = Math.min(low + 1, sourceLevels.length - 1);
-        const frac = srcIndex - low;
-        bars.push(((_a = sourceLevels[low]) !== null && _a !== void 0 ? _a : 0) * (1 - frac) + ((_b = sourceLevels[high]) !== null && _b !== void 0 ? _b : 0) * frac);
-    }
-    const totalDuration = recordingTime || lastDuration || 1;
-    const progress = isPlaying ? Math.min(1, playbackTime / totalDuration) : 0;
-    return (jsx(Fragment, { children: bars.map((level, i) => {
-            const normalized = Math.min(100, level);
-            const height = TIMELINE_BAR_MIN_HEIGHT + (normalized / 100) * (TIMELINE_BAR_MAX_HEIGHT - TIMELINE_BAR_MIN_HEIGHT);
-            const isPlayed = progress > 0 && (i / maxBars) <= progress;
-            return (jsx("div", { style: {
-                    flexShrink: 0,
-                    height: `${height}px`,
-                    borderRadius: '9999px',
-                    width: `${TIMELINE_BAR_WIDTH}px`,
-                    background: !isPlaying
-                        ? 'color-mix(in srgb, var(--text_primary, #0a0a0a) 55%, transparent)'
-                        : isPlayed
-                            ? 'color-mix(in srgb, var(--text_primary, #0a0a0a) 80%, transparent)'
-                            : 'color-mix(in srgb, var(--text_primary, #0a0a0a) 22%, transparent)',
-                    transition: 'background 80ms ease',
-                } }, i));
-        }) }));
-};
-
-const TimelineBars = (props) => {
-    const { timelineLevels, visibleBarsCount } = props;
-    const maxBars = visibleBarsCount;
-    const visible = timelineLevels.slice(-maxBars);
-    const padded = [
-        ...visible,
-        ...Array.from({ length: Math.max(0, maxBars - visible.length) }, () => 0),
-    ];
-    return (jsx(Fragment, { children: padded.map((level, i) => {
-            const normalized = Math.min(100, level);
-            const height = TIMELINE_BAR_MIN_HEIGHT + (normalized / 100) * (TIMELINE_BAR_MAX_HEIGHT - TIMELINE_BAR_MIN_HEIGHT);
-            const hasValue = i < visible.length;
-            return (jsx("div", { style: {
-                    width: `${TIMELINE_BAR_WIDTH}px`,
-                    height: `${height}px`,
-                    borderRadius: '9999px',
-                    flexShrink: 0,
-                    transition: 'height 120ms ease',
-                    background: hasValue
-                        ? 'color-mix(in srgb, var(--text_primary, #0a0a0a) 55%, transparent)'
-                        : 'color-mix(in srgb, var(--text_primary, #0a0a0a) 18%, transparent)',
-                } }, i));
-        }) }));
-};
-
-/**
- * VoiceRecorderInput styles
- *
- * @author: exode <hello@exode.ru>
- */
-const Wrapper = styled.div `
-    display: flex;
-    align-items: center;
-    width: 100%;
-    gap: 6px;
-    padding: 0 4px;
-    color: var(--text_primary, #0a0a0a);
-`;
-const CancelButton = styled.button `
-    width: 32px;
-    height: 32px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 16px;
-    background: transparent;
-    border: 0;
-    margin-right: 4px;
-    flex-shrink: 0;
-    color: color-mix(in srgb, var(--text_primary, #0a0a0a) 45%, transparent);
-    cursor: pointer;
-    transition: color 160ms ease, background-color 160ms ease;
-`;
-const RecordTrack = styled.div `
-    flex: 1;
-    display: flex;
-    align-items: center;
-    gap: 4px;
-    padding: 4px 10px 4px 4px;
-    border-radius: 9999px;
-    background: color-mix(in srgb, var(--text_primary, #0a0a0a) 8%, transparent);
-    min-width: 0;
-`;
-/** Container for control buttons — auto-sized, no fixed width */
-const ButtonSlot = styled.div `
-    display: flex;
-    align-items: center;
-    gap: 4px;
-    padding: 2px;
-    flex-shrink: 0;
-`;
-const StopButton = styled.button `
-    width: 26px;
-    height: 26px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 13px;
-    border: 0;
-    flex-shrink: 0;
-    cursor: pointer;
-    background: var(--background_content, #ffffff);
-    color: var(--exode_red, #ed1c24);
-    transition: transform 120ms ease;
-
-    &:hover:not(:disabled) {
-        transform: scale(1.05);
-    }
-
-    &:active:not(:disabled) {
-        transform: scale(0.96);
-    }
-
-    &:disabled {
-        opacity: 0.4;
-        cursor: not-allowed;
-    }
-`;
-const WaveformArea = styled.div `
-    flex: 1;
-    height: 28px;
-    display: flex;
-    align-items: flex-end;
-    justify-content: flex-start;
-    gap: 2px;
-    overflow: hidden;
-    min-width: 0;
-    padding-bottom: 2px;
-`;
-const Timer = styled.span `
-    font-size: 13px;
-    font-weight: 500;
-    flex-shrink: 0;
-    color: color-mix(in srgb, var(--text_primary, #0a0a0a) 60%, transparent);
-    font-variant-numeric: tabular-nums;
-`;
-const SendButton = styled.button `
-    width: 32px;
-    height: 32px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 16px;
-    border: 0;
-    flex-shrink: 0;
-    cursor: pointer;
-    background: transparent;
-    color: var(--accent, #3f8ae0);
-    transition: opacity 140ms ease;
-    padding: 0;
-
-    &:hover:not(:disabled) {
-        opacity: 0.75;
-    }
-
-    &:disabled {
-        opacity: 0.35;
-        cursor: not-allowed;
-    }
-`;
-const MicIndicator = styled.button `
-    width: 26px;
-    height: 26px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 13px;
-    border: 0;
-    flex-shrink: 0;
-    cursor: pointer;
-    background: var(--background_content, #ffffff);
-    color: color-mix(in srgb, var(--accent, #3f8ae0) 86%, white 14%);
-    transition: background-color 140ms ease, transform 120ms ease;
-
-    &:active {
-        transform: scale(0.94);
-    }
-`;
-const PlayPauseButton = styled.button `
-    width: 26px;
-    height: 26px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 13px;
-    border: 0;
-    flex-shrink: 0;
-    cursor: pointer;
-    background: var(--background_content, #ffffff);
-    color: var(--text_primary, #0a0a0a);
-    transition: transform 120ms ease;
-
-    &:hover {
-        transform: scale(1.06);
-    }
-
-    &:active {
-        transform: scale(0.94);
-    }
-`;
-const SpinnerIcon = styled.span `
-    width: 20px;
-    height: 20px;
-    display: inline-block;
-    border-radius: 50%;
-    border: 2px solid color-mix(in srgb, var(--accent, #3f8ae0) 25%, transparent);
-    border-top-color: var(--accent, #3f8ae0);
-    border-right-color: var(--accent, #3f8ae0);
-    animation: voiceRecorderSpin 0.75s linear infinite;
-
-    @keyframes voiceRecorderSpin {
-        from { transform: rotate(0deg); }
-        to { transform: rotate(360deg); }
-    }
-`;
-
-const VoiceRecorderInput = (props) => {
-    const { className, ...inputOptions } = props;
-    const waveformRef = useRef(null);
-    const { recorder, isSending, isPreview, timelineLevels, lastDurationRef, handleResume, handlePause, handleCancel, handleSendRequest, } = useVoiceRecorderInput(inputOptions);
-    const { isPlaying, isRecording, recordingTime, hasRecording, previewLevels, playbackTime, formatTime, togglePlayback, } = recorder;
-    const [visibleBarsCount, setVisibleBarsCount] = useState(0);
-    const measureBars = () => {
-        const el = waveformRef.current;
-        if (!el) {
-            return;
-        }
-        setVisibleBarsCount(Math.floor(el.clientWidth / (TIMELINE_BAR_WIDTH + TIMELINE_BAR_GAP)));
-    };
-    /** Sync recalc before paint — catches layout shifts from button changes */
-    useLayoutEffect(measureBars);
-    /** ResizeObserver for external size changes (window resize, container resize) */
-    useEffect(() => {
-        const el = waveformRef.current;
-        if (!el) {
-            return;
-        }
-        let rafId = 0;
-        const observer = new ResizeObserver(() => {
-            cancelAnimationFrame(rafId);
-            rafId = requestAnimationFrame(measureBars);
-        });
-        observer.observe(el);
-        return () => {
-            cancelAnimationFrame(rafId);
-            observer.disconnect();
-        };
-    }, []);
-    const displayTime = (isPreview && isPlaying)
-        ? formatTime(playbackTime)
-        : formatTime(recordingTime || lastDurationRef.current);
-    return (jsxs(Wrapper, { className: className, children: [jsx(CancelButton, { type: "button", onClick: handleCancel, "aria-label": "Cancel", children: jsx(Icon28DeleteOutlineAndroid, { fill: "var(--exode_red)", width: 28, height: 28, style: { minWidth: 28 } }) }), jsxs(RecordTrack, { children: [jsx(ButtonSlot, { children: isPreview ? (jsxs(Fragment, { children: [jsx(MicIndicator, { type: "button", onClick: handleResume, "aria-label": "Resume recording", children: jsx(Icon20Voice, { width: 14, height: 14 }) }), jsx(PlayPauseButton, { type: "button", onClick: togglePlayback, "aria-label": isPlaying ? 'Pause' : 'Play', children: isPlaying
-                                        ? jsx(Icon16Pause, { width: 14, height: 14 })
-                                        : jsx(Icon16Play, { width: 14, height: 14 }) })] })) : (jsx(StopButton, { type: "button", onClick: handlePause, "aria-label": "Pause recording", children: jsx(Icon16Pause, { width: 14, height: 14 }) })) }), jsx(WaveformArea, { ref: waveformRef, children: isPreview ? (jsx(PreviewBars, { timelineLevels: timelineLevels, previewLevels: previewLevels, isPlaying: isPlaying, playbackTime: playbackTime, recordingTime: recordingTime, lastDuration: lastDurationRef.current, visibleBarsCount: visibleBarsCount })) : (jsx(TimelineBars, { timelineLevels: timelineLevels, visibleBarsCount: visibleBarsCount })) }), jsx(Timer, { children: displayTime })] }), jsx(SendButton, { type: "button", onClick: handleSendRequest, disabled: isSending || (!hasRecording && !isRecording), "aria-label": "Send", children: isSending ? (jsx(SpinnerIcon, {})) : (jsx(Icon28SendOutline, {})) })] }));
-};
-
-/**
- * VoicePlaybackChain
- *
- * @description Sequential voice message playback chain (like Telegram).
- * Registers voice players by media ID and plays the next one when current ends.
- *
- * @author: exode <hello@exode.ru>
- */
-class VoicePlaybackChainClass {
-    constructor() {
-        this.entries = [];
-        /** Register a voice player. Returns cleanup function for useEffect. */
-        this.register = (id, play) => {
-            this.entries = this.entries.filter((e) => e.id !== id);
-            this.entries.push({ id, play });
-            this.entries.sort((a, b) => a.id - b.id);
-            return () => this.unregister(id);
-        };
-        /** Unregister a voice player by media ID */
-        this.unregister = (id) => {
-            this.entries = this.entries.filter((e) => e.id !== id);
-        };
-        /** Play the next voice message after the given media ID */
-        this.playNext = (currentId) => {
-            const idx = this.entries.findIndex((e) => e.id === currentId);
-            if (idx >= 0 && idx < this.entries.length - 1) {
-                this.entries[idx + 1].play();
-            }
-        };
-        /** Play the previous voice message before the given media ID */
-        this.playPrevious = (currentId) => {
-            const idx = this.entries.findIndex((e) => e.id === currentId);
-            if (idx > 0) {
-                this.entries[idx - 1].play();
-            }
-        };
-    }
-}
-const VoicePlaybackChain = new VoicePlaybackChainClass();
-
-/**
- * VoiceMessagePlayer styles
- *
- * @author: exode <hello@exode.ru>
- */
-const PlayerWrapper = styled.div `
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    min-width: 200px;
-    padding: 2px 0;
-    user-select: none;
-`;
-const PlayButton = styled.button `
-    width: 44px;
-    height: 44px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 22px;
-    border: 0;
-    cursor: pointer;
-    flex-shrink: 0;
-    background: var(--white, #ffffff);
-    color: var(--accent, #3f8ae0);
-    transition: transform 140ms ease, box-shadow 140ms ease;
-    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-    padding: 0;
-
-    &:hover:not(:disabled) {
-        transform: scale(1.04);
-        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.14);
-    }
-
-    &:active:not(:disabled) {
-        transform: scale(0.97);
-        box-shadow: 0 0 2px rgba(0, 0, 0, 0.08);
-    }
-
-    &:disabled {
-        opacity: 0.5;
-        cursor: not-allowed;
-    }
-`;
-const ContentColumn = styled.div `
-    display: flex;
-    flex-direction: column;
-    flex: 1;
-    min-width: 0;
-    gap: 4px;
-`;
-const WaveformTrack = styled.div `
-    height: 28px;
-    display: flex;
-    align-items: center;
-    gap: 2px;
-    overflow: hidden;
-    cursor: pointer;
-    min-width: 0;
-`;
-const WaveformBar = styled.div `
-    width: 3px;
-    border-radius: 1.5px;
-    flex-shrink: 0;
-    transition: background 100ms ease;
-`;
-const Duration = styled.span `
-    font-size: 12px;
-    font-weight: 500;
-    line-height: 1;
-    color: color-mix(in srgb, var(--text_primary, #0a0a0a) 55%, transparent);
-    font-variant-numeric: tabular-nums;
-`;
-const LoadingSpinner = styled.span `
-    width: 18px;
-    height: 18px;
-    display: inline-block;
-    border-radius: 50%;
-    border: 2px solid color-mix(in srgb, var(--accent, #3f8ae0) 25%, transparent);
-    border-top-color: var(--accent, #3f8ae0);
-    animation: voicePlayerSpin 0.7s linear infinite;
-
-    @keyframes voicePlayerSpin {
-        from { transform: rotate(0deg); }
-        to { transform: rotate(360deg); }
-    }
-`;
-
-const BAR_WIDTH = 3;
-const BAR_GAP = 2;
-const BAR_MIN_HEIGHT = 2;
-const BAR_MAX_HEIGHT = 24;
-const VoiceMessagePlayer = React.forwardRef((props, ref) => {
-    const { src, onClick, onEnded, chainId, duration, className, waveformData, autoPreload = true, } = props;
-    const trackRef = useRef(null);
-    const wrapperRef = useRef(null);
-    const [trackWidth, setTrackWidth] = useState(0);
-    const handleEnded = useCallback(() => {
-        onEnded === null || onEnded === void 0 ? void 0 : onEnded();
-        if (chainId != null) {
-            VoicePlaybackChain.playNext(chainId);
-        }
-    }, [onEnded, chainId]);
-    const handleNextTrack = useCallback(() => {
-        if (chainId != null) {
-            VoicePlaybackChain.playNext(chainId);
-        }
-    }, [chainId]);
-    const handlePreviousTrack = useCallback(() => {
-        if (chainId != null) {
-            VoicePlaybackChain.playPrevious(chainId);
-        }
-    }, [chainId]);
-    const { play, progress, isLoaded, isPlaying, isLoading, currentTime, waveformLevels, seekTo, seekToTime, prefetch, preload, formatTime, togglePlayback, duration: resolvedDuration, } = useVoiceMessagePlayer({
-        src,
-        duration,
-        waveformData,
-        preloadedBlob: props.preloadedBlob,
-        onEnded: handleEnded,
-        onNextTrack: handleNextTrack,
-        onPreviousTrack: handlePreviousTrack,
-    });
-    useImperativeHandle(ref, () => ({ play, prefetch, seekToTime }), [
-        play,
-        prefetch,
-        seekToTime,
-    ]);
-    /** Auto-preload audio when player enters viewport */
-    useEffect(() => {
-        if (!autoPreload || isLoaded || isLoading) {
-            return;
-        }
-        const el = wrapperRef.current;
-        if (!el) {
-            return;
-        }
-        const observer = new IntersectionObserver(([entry]) => {
-            if (entry.isIntersecting) {
-                prefetch();
-                observer.disconnect();
-            }
-        }, { threshold: 0.1 });
-        observer.observe(el);
-        return () => observer.disconnect();
-    }, [
-        isLoaded,
-        prefetch,
-        isLoading,
-        autoPreload,
-    ]);
-    /** Register in playback chain for sequential playback */
-    useEffect(() => {
-        if (chainId != null) {
-            return VoicePlaybackChain.register(chainId, () => play());
-        }
-    }, [chainId, play]);
-    const measureTrackWidth = () => {
-        if (trackRef.current) {
-            setTrackWidth(trackRef.current.clientWidth);
-        }
-    };
-    /** Sync recalc before paint — catches layout shifts */
-    useLayoutEffect(measureTrackWidth);
-    /** ResizeObserver for external size changes (window resize, container resize) */
-    useEffect(() => {
-        const el = trackRef.current;
-        if (!el) {
-            return;
-        }
-        let rafId = 0;
-        const observer = new ResizeObserver(() => {
-            cancelAnimationFrame(rafId);
-            rafId = requestAnimationFrame(measureTrackWidth);
-        });
-        observer.observe(el);
-        return () => {
-            cancelAnimationFrame(rafId);
-            observer.disconnect();
-        };
-    }, []);
-    const displayTime = (isPlaying || currentTime > 0)
-        ? formatTime(currentTime)
-        : formatTime(resolvedDuration);
-    const handleTrackClick = useCallback((e) => {
-        const track = trackRef.current;
-        if (!track) {
-            return;
-        }
-        const rect = track.getBoundingClientRect();
-        const clickProgress = (e.clientX - rect.left) / rect.width;
-        seekTo(Math.max(0, Math.min(1, clickProgress)));
-    }, [seekTo]);
-    /** Interpolate waveform levels to fill container */
-    const interpolatedBars = useMemo(() => {
-        var _a, _b;
-        const maxBars = trackWidth > 0
-            ? Math.floor(trackWidth / (BAR_WIDTH + BAR_GAP))
-            : 48;
-        if (!waveformLevels.length) {
-            return Array.from({ length: maxBars }, () => 0);
-        }
-        const raw = [];
-        for (let i = 0; i < maxBars; i++) {
-            const srcIndex = (i / maxBars) * waveformLevels.length;
-            const low = Math.floor(srcIndex);
-            const high = Math.min(low + 1, waveformLevels.length - 1);
-            const frac = srcIndex - low;
-            raw.push(((_a = waveformLevels[low]) !== null && _a !== void 0 ? _a : 0) * (1 - frac)
-                + ((_b = waveformLevels[high]) !== null && _b !== void 0 ? _b : 0) * frac);
-        }
-        /** Normalize to 0-100 range so bars use full height */
-        const peak = Math.max(...raw, 1);
-        return raw.map((v) => (v / peak) * 100);
-    }, [waveformLevels, trackWidth]);
-    return (jsxs(PlayerWrapper, { ref: wrapperRef, onClick: onClick, className: className, children: [jsx(PlayButton, { type: "button", disabled: isLoading || (!src && !props.preloadedBlob), onClick: isLoaded ? togglePlayback : preload, "aria-label": isPlaying ? 'Pause' : 'Play', children: isLoading ? (jsx(LoadingSpinner, {})) : isPlaying ? (jsx(Icon24Pause, {})) : (jsx(Icon24Play, {})) }), jsxs(ContentColumn, { children: [jsx(WaveformTrack, { ref: trackRef, onClick: handleTrackClick, children: interpolatedBars.map((level, i) => {
-                            const normalized = Math.min(100, level);
-                            const height = BAR_MIN_HEIGHT + (normalized / 100) * (BAR_MAX_HEIGHT - BAR_MIN_HEIGHT);
-                            const barProgress = interpolatedBars.length > 0
-                                ? i / interpolatedBars.length
-                                : 0;
-                            const isPlayed = progress > 0 && barProgress <= progress;
-                            return (jsx(WaveformBar, { style: {
-                                    height: `${height}px`,
-                                    background: isPlayed
-                                        ? 'color-mix(in srgb, var(--text_primary, #0a0a0a) 75%, transparent)'
-                                        : 'color-mix(in srgb, var(--text_primary, #0a0a0a) 25%, transparent)',
-                                } }, i));
-                        }) }), jsx(Duration, { children: displayTime })] })] }));
-});
-
-/**
- * VoiceBlobCache
- *
- * @description In-memory cache for voice message blobs.
- * Allows instant playback of just-sent voice messages
- * before the server URL becomes available.
- *
- * @author: exode <hello@exode.ru>
- */
-class VoiceBlobCacheClass {
-    constructor() {
-        this.cache = new Map();
-        this.set = (messageId, blob) => {
-            this.cache.set(messageId, blob);
-        };
-        this.get = (messageId) => {
-            return this.cache.get(messageId);
-        };
-        this.delete = (messageId) => {
-            this.cache.delete(messageId);
-        };
-        /** Transfer blob from optimistic ID to real server ID */
-        this.transfer = (fromId, toId) => {
-            const blob = this.cache.get(fromId);
-            if (blob) {
-                this.cache.delete(fromId);
-                this.cache.set(toId, blob);
-            }
-        };
-    }
-}
-const VoiceBlobCache = new VoiceBlobCacheClass();
-
-export { AUDIO_LEVEL_BARS, AudioRecorder, VoiceBlobCache, VoiceMessagePlayer, VoicePlaybackChain, VoiceRecorderInput, WaveformBars, clampValue, formatTime, useRecorderVisualization, useRecordingTiming, useVoiceMessagePlayer, useVoiceRecorder };
+export { AudioRecorder } from './components/AudioRecorder.js';
+export { VoiceRecorderInput } from './components/VoiceRecorderInput/VoiceRecorderInput.js';
+export { VoiceMessagePlayer } from './components/VoiceMessagePlayer/VoiceMessagePlayer.js';
+export { WaveformBars } from './components/WaveformBars/WaveformBars.js';
+export { useVoiceRecorder } from './hooks/useVoiceRecorder.js';
+export { useVoiceMessagePlayer } from './hooks/useVoiceMessagePlayer.js';
+export { useRecorderVisualization } from './hooks/useRecorderVisualization.js';
+export { useRecordingTiming } from './hooks/useRecordingTiming.js';
+export { AUDIO_LEVEL_BARS } from './constants.js';
+export { clampValue } from './utils/math.js';
+export { formatTime } from './utils/format.js';
+export { VoiceBlobCache } from './utils/voice-blob-cache.js';
+export { VoicePlaybackChain } from './utils/voice-playback-chain.js';
 //# sourceMappingURL=index.js.map