import { defineComponent as d, ref as u, useId as p, toRef as t, createElementBlock as m, openBlock as n, createElementVNode as c, createBlock as f, createCommentVNode as g, unref as l } from "vue";
import { ScalarCodeBlockCopy as _ } from "@scalar/components";
import { prettyPrintJson as b } from "@scalar/oas-utils/helpers";
import { useCodeMirror as k } from "@scalar/use-codemirror";
const v = { class: "scalar-code-block group/code-block body-raw relative grid min-h-0 overflow-hidden p-px outline-none has-focus-visible:outline" }, y = {
  class: "body-raw-scroller custom-scroll relative pr-1",
  tabindex: "0"
}, M = /* @__PURE__ */ d({
  __name: "ResponseBodyRaw",
  props: {
    content: {},
    language: {}
  },
  setup(s) {
    const e = s, o = u(null), a = p(), { codeMirror: i } = k({
      codeMirrorRef: o,
      readOnly: !0,
      lineNumbers: !0,
      content: t(() => b(e.content)),
      language: t(() => e.language),
      forceFoldGutter: !0
    }), r = () => i.value?.state.doc.toString() || "";
    return (h, C) => (n(), m("div", v, [
      c("div", y, [
        c("div", {
          ref_key: "codeMirrorRef",
          ref: o
        }, null, 512)
      ]),
      r() ? (n(), f(l(_), {
        key: 0,
        class: "absolute top-2 right-2",
        content: r(),
        "aria-controls": l(a)
      }, null, 8, ["content", "aria-controls"])) : g("", !0)
    ]));
  }
});
export {
  M as default
};
