import { jsxs as v, jsx as u } from "react/jsx-runtime";
import { useState as e, useMemo as U, useEffect as B } from "react";
import { cn as F } from "../../utils/cn.js";
import { BaseCodeBlock as M } from "../code-block/base-code-block.js";
import { CopyToClipboardButton as R } from "../code-block/copy-button.js";
import { CodeSelectDropdown as j } from "./code-select-dropdown.js";
const q = "Code snippet", W = ({
  snippets: s,
  syncedLabel: f,
  setSyncedLabel: l,
  setSelectedExampleIndex: c,
  askAiButton: N,
  codeBlockTheme: O = "system",
  codeBlockThemeObject: k,
  codeSnippetAriaLabel: G = q,
  copyButtonProps: T,
  className: _
}) => {
  const a = Object.keys(s), [h, A] = e(a[0]), w = h && a.includes(h) ? h : a[0], t = w !== void 0 ? s[w] : void 0, o = U(
    () => t ? Object.keys(t) : void 0,
    [t]
  ), [g, m] = e(o == null ? void 0 : o[0]), d = g && (o != null && o.includes(g)) ? g : o == null ? void 0 : o[0], r = t !== void 0 && d !== void 0 ? t[d] : void 0, D = (i) => {
    A(i);
    const n = (s[i] ? Object.keys(s[i]) : [])[0];
    n !== void 0 && (m(n), c == null || c(0), n !== f && (l == null || l(n)));
  }, P = (i) => {
    m(i);
    const C = (o == null ? void 0 : o.indexOf(i)) ?? -1;
    c == null || c(C === -1 ? 0 : C), i !== f && (l == null || l(i));
  };
  return B(() => {
    if (f && f !== d && (o != null && o.includes(f))) {
      m(f);
      const i = (o == null ? void 0 : o.indexOf(f)) ?? -1;
      c == null || c(i === -1 ? 0 : i);
    }
  }, [f, o, d, c]), /* @__PURE__ */ v(
    "div",
    {
      className: F(
        "not-prose relative flex min-w-full max-w-full flex-col overflow-hidden rounded-2xl p-0.5 text-xs leading-6",
        "border border-gray-950/10 bg-gray-50 dark:border-white/10 dark:bg-white/5",
        _
      ),
      "data-testid": "code-group-select",
      children: [
        /* @__PURE__ */ v("div", { className: "flex w-full justify-between rounded-t-2xl text-xs leading-6", children: [
          /* @__PURE__ */ u(
            j,
            {
              options: a,
              selectedOption: w,
              setSelectedOption: D
            }
          ),
          /* @__PURE__ */ v("div", { className: "flex overflow-hidden", children: [
            o && /* @__PURE__ */ u(
              j,
              {
                options: o,
                selectedOption: d,
                setSelectedOption: P
              }
            ),
            /* @__PURE__ */ v(
              "div",
              {
                className: "flex items-center gap-1.5 pr-2.5",
                "data-testid": "code-group-select-copy-button",
                children: [
                  /* @__PURE__ */ u(
                    R,
                    {
                      codeBlockTheme: O,
                      textToCopy: (r == null ? void 0 : r.code) ?? "",
                      ...T
                    }
                  ),
                  N && N
                ]
              }
            )
          ] })
        ] }),
        /* @__PURE__ */ u(
          "section",
          {
            "aria-label": G,
            className: "flex flex-1 overflow-hidden",
            children: /* @__PURE__ */ u("div", { className: "relative h-full max-h-full w-full min-w-full max-w-full", children: r != null && r.audioUrl ? /* @__PURE__ */ u("div", { className: "p-4", children: /* @__PURE__ */ u("audio", { className: "w-full", controls: !0, src: r.audioUrl, children: /* @__PURE__ */ u("track", { kind: "captions" }) }) }) : /* @__PURE__ */ u(
              M,
              {
                codeBlockTheme: O,
                codeBlockThemeObject: k ?? O,
                isParentCodeGroup: !0,
                isSmallText: !0,
                language: r == null ? void 0 : r.language,
                children: r == null ? void 0 : r.code
              }
            ) })
          }
        )
      ]
    }
  );
};
export {
  W as CodeGroupSelect
};
