import { jsxs as o, jsx as i } from "react/jsx-runtime";
import { useState as b } from "react";
import { cn as p } from "../../utils/cn.js";
import { getDisplayName as d } from "../../utils/shiki/snippet-presets.js";
import { DropdownMenu as l, DropdownMenuTrigger as v, DropdownMenuContent as w, DropdownMenuItem as g } from "./dropdown.js";
import { LanguageIcon as x } from "./language-icon.js";
import k from "../../node_modules/.pnpm/lucide-react@0.453.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/chevrons-up-down.js";
const S = ({
  selectedLanguage: e,
  setSelectedLanguage: h,
  languages: m,
  codeBlockTheme: r = "system"
}) => {
  const s = m.length > 1, [n, y] = b(!1);
  return /* @__PURE__ */ o(l, { onOpenChange: y, open: n, children: [
    /* @__PURE__ */ i(
      v,
      {
        className: "cursor-default select-none bg-transparent pb-1 font-medium text-xs dark:bg-transparent",
        disabled: !s,
        children: /* @__PURE__ */ o(
          "div",
          {
            className: p(
              "flex items-center gap-1 rounded-[10px] border py-[5px] pr-1.5 pl-2.5 text-stone-500 dark:text-stone-400",
              s ? "cursor-pointer" : "cursor-default",
              s && r === "system" && "hover:bg-stone-200/50 hover:text-primary dark:hover:bg-stone-700/70 dark:hover:text-primary-light",
              s && r === "dark" && "hover:bg-stone-700/70 hover:text-primary-light",
              n && "border-stone-600/50 ring-1 dark:border-stone-400/50 dark:ring-stone-800/50",
              n && r === "system" && "ring-stone-200/70",
              n && r === "dark" && "ring-stone-800/50",
              !n && "border-transparent"
            ),
            children: [
              /* @__PURE__ */ i(x, { language: e }),
              /* @__PURE__ */ i("p", { className: "truncate font-medium", children: d(e) }),
              s && /* @__PURE__ */ i(k, { className: "size-3.5 shrink-0" })
            ]
          }
        )
      }
    ),
    /* @__PURE__ */ i(
      w,
      {
        align: "end",
        className: p(
          "min-w-[170px] overflow-y-auto border p-1",
          r === "system" && "border-stone-200/70 bg-white dark:border-white/10 dark:bg-[#0F1117]",
          r === "dark" && "border-white/10 bg-[#0F1117]"
        ),
        sideOffset: 0,
        children: m.map((t, a) => {
          const f = t === e;
          return /* @__PURE__ */ o(
            g,
            {
              className: p(
                "flex items-center gap-1.5 py-1.5 text-xs",
                r === "system" && "hover:bg-primary/10 hover:text-primary dark:hover:bg-primary-light/10 dark:hover:text-primary-light",
                r === "dark" && "text-primary-light hover:bg-primary-light/10 hover:text-primary-light dark:text-primary-light",
                t === e && r === "system" && "font-medium text-primary dark:text-primary-light",
                t === e && r === "dark" && "font-medium text-primary-light dark:text-primary-light",
                t !== e && r === "system" && "text-stone-500 dark:text-white/50",
                t !== e && r === "dark" && "text-white/50"
              ),
              isSelected: f,
              onSelect: () => h(t, a),
              children: [
                /* @__PURE__ */ i(x, { language: t }),
                /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 items-center font-medium", children: d(t) })
              ]
            },
            `Language${a}${t}`
          );
        })
      }
    )
  ] });
};
export {
  S as LanguageDropdown
};
