"use client";
import * as React from 'react';
import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import { jsxs, jsx } from 'react/jsx-runtime';

function cn(...inputs) {
  return twMerge(clsx(inputs));
}
function AudioPlayer({ src, autoPlay = false, onEnded, onError, className, ...rest }) {
  const containerRef = React.useRef(null);
  const wsRef = React.useRef(null);
  const onEndedRef = React.useRef(onEnded);
  const onErrorRef = React.useRef(onError);
  onEndedRef.current = onEnded;
  onErrorRef.current = onError;
  const [isPlaying, setIsPlaying] = React.useState(false);
  const [duration, setDuration] = React.useState(0);
  const [currentTime, setCurrentTime] = React.useState(0);
  const [isReady, setIsReady] = React.useState(false);
  React.useEffect(() => {
    if (!containerRef.current) return;
    let disposed = false;
    const objectUrl = src instanceof Blob ? URL.createObjectURL(src) : null;
    void (async () => {
      const { default: WaveSurfer } = await import('wavesurfer.js');
      if (disposed || !containerRef.current) return;
      const ws = WaveSurfer.create({
        container: containerRef.current,
        waveColor: "#a3a3a3",
        progressColor: "#171717",
        cursorColor: "transparent",
        height: 32,
        barWidth: 2,
        barGap: 1,
        barRadius: 1,
        normalize: true
      });
      ws.on("ready", () => {
        setIsReady(true);
        setDuration(ws.getDuration());
        if (autoPlay) void ws.play();
      });
      ws.on("play", () => setIsPlaying(true));
      ws.on("pause", () => setIsPlaying(false));
      ws.on("finish", () => {
        setIsPlaying(false);
        onEndedRef.current?.();
      });
      ws.on("timeupdate", (t) => setCurrentTime(t));
      ws.on("error", (err) => {
        onErrorRef.current?.(err.message);
      });
      void ws.load(objectUrl ?? src);
      wsRef.current = ws;
    })();
    return () => {
      disposed = true;
      wsRef.current?.destroy();
      wsRef.current = null;
      if (objectUrl) URL.revokeObjectURL(objectUrl);
    };
  }, [src]);
  function togglePlay() {
    const ws = wsRef.current;
    if (!ws || !isReady) return;
    void ws.playPause();
  }
  return /* @__PURE__ */ jsxs(
    "div",
    {
      ...rest,
      "data-hex-audio-player": true,
      className: cn("flex items-center gap-3 rounded-md border bg-background p-2", className),
      children: [
        /* @__PURE__ */ jsx(
          "button",
          {
            type: "button",
            onClick: togglePlay,
            disabled: !isReady,
            "aria-label": isPlaying ? "Pause" : "Play",
            className: cn(
              "inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-md",
              "bg-foreground text-background transition-opacity",
              "hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50",
              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
            ),
            children: isPlaying ? /* @__PURE__ */ jsx(PauseIcon, {}) : /* @__PURE__ */ jsx(PlayIcon, {})
          }
        ),
        /* @__PURE__ */ jsx("div", { ref: containerRef, className: "flex-1 min-w-0" }),
        /* @__PURE__ */ jsxs("span", { className: "shrink-0 text-xs tabular-nums text-muted-foreground", children: [
          formatTime(currentTime),
          " / ",
          formatTime(duration)
        ] })
      ]
    }
  );
}
function formatTime(seconds) {
  if (!Number.isFinite(seconds) || seconds < 0) return "0:00";
  const m = Math.floor(seconds / 60);
  const s = Math.floor(seconds % 60);
  return `${m}:${s.toString().padStart(2, "0")}`;
}
function PlayIcon() {
  return /* @__PURE__ */ jsx("svg", { "aria-hidden": true, viewBox: "0 0 16 16", width: "12", height: "12", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M5 3.5v9l8-4.5z" }) });
}
function PauseIcon() {
  return /* @__PURE__ */ jsxs("svg", { "aria-hidden": true, viewBox: "0 0 16 16", width: "12", height: "12", fill: "currentColor", children: [
    /* @__PURE__ */ jsx("rect", { x: "4", y: "3", width: "3", height: "10", rx: "0.5" }),
    /* @__PURE__ */ jsx("rect", { x: "9", y: "3", width: "3", height: "10", rx: "0.5" })
  ] });
}

export { AudioPlayer };
//# sourceMappingURL=audio-player.js.map
//# sourceMappingURL=audio-player.js.map