import { defineComponent as N, computed as i, ref as g, watch as R, useId as z, createBlock as S, createCommentVNode as b, openBlock as m, unref as s, withCtx as r, createVNode as n, createSlots as H, createElementVNode as v, createElementBlock as q, renderSlot as h, toDisplayString as K } from "vue";
import { ScalarCard as $, ScalarCardHeader as M, ScalarCombobox as W, ScalarButton as D, ScalarCardSection as E, ScalarCodeBlock as F, ScalarCardFooter as U } from "@scalar/components";
import { freezeElement as A } from "@scalar/helpers/dom/freeze-element";
import { ScalarIconCaretDown as G } from "@scalar/icons";
import { isReference as J } from "@scalar/workspace-store/schemas/v3.1/type-guard";
import { findClient as V } from "../helpers/find-client.js";
import { generateCustomId as B } from "../helpers/generate-client-options.js";
import { generateCodeSnippet as P } from "../helpers/generate-code-snippet.js";
import { getSecrets as Q } from "../helpers/get-secrets.js";
import X from "./ExamplePicker.vue2.js";
import T from "../../../../components/HttpMethod/HttpMethod.vue.js";
import { emitCustomEvent as O } from "../../../events/definitions.js";
const Y = ["innerHTML"], Z = { class: "text-base font-normal" }, _ = ["id"], ee = {
  key: 0,
  class: "request-card-footer-addon"
}, te = { class: "request-header" }, le = {}, ve = /* @__PURE__ */ N({
  ...le,
  __name: "RequestExample",
  props: {
    clientOptions: {},
    selectedClient: {},
    selectedServer: { default: () => ({ url: "/" }) },
    selectedContentType: {},
    selectedExample: {},
    securitySchemes: { default: () => [] },
    method: {},
    path: {},
    operation: {},
    fallback: { type: Boolean },
    generateLabel: { type: Function }
  },
  setup(o) {
    const c = i(() => {
      var a, p;
      if (J(o.operation.requestBody))
        return {};
      const t = ((a = o.operation.requestBody) == null ? void 0 : a.content) ?? {}, e = o.selectedContentType || Object.keys(t)[0];
      return ((p = t[e]) == null ? void 0 : p.examples) ?? {};
    }), y = g(
      o.selectedExample ?? Object.keys(c.value)[0]
    ), C = i(() => [
      "x-custom-examples",
      "x-codeSamples",
      "x-code-samples"
    ].flatMap(
      (e) => o.operation[e] ?? []
    )), f = i(() => C.value.length ? [
      {
        label: "Code Examples",
        options: C.value.map((e) => {
          const l = B(e), a = e.label || e.lang || l;
          return {
            id: l,
            lang: e.lang || "plaintext",
            title: a,
            label: a
          };
        })
      },
      ...o.clientOptions
    ] : o.clientOptions), u = g(
      V(f.value, o.selectedClient) ?? null
    );
    R(
      () => o.selectedClient,
      (t) => {
        const e = V(f.value, t);
        e && (u.value = e);
      }
    );
    const k = i(() => {
      var t, e, l;
      try {
        if ((t = u.value) != null && t.id.startsWith("custom"))
          return ((e = C.value.find(
            (I) => {
              var x;
              return B(I) === ((x = u.value) == null ? void 0 : x.id);
            }
          )) == null ? void 0 : e.source) ?? "Custom example not found";
        const a = c.value[y.value || ""], p = (a == null ? void 0 : a.value) ?? (a == null ? void 0 : a.summary);
        return P({
          clientId: (l = u.value) == null ? void 0 : l.id,
          operation: o.operation,
          method: o.method,
          server: o.selectedServer,
          securitySchemes: o.securitySchemes,
          contentType: o.selectedContentType,
          path: o.path,
          example: p
        });
      } catch (a) {
        return console.error("[generateSnippet]", a), "";
      }
    }), w = i(() => Q(o.securitySchemes)), d = g(null), L = (t) => {
      var e;
      if (d.value) {
        const l = A(d.value.$el);
        setTimeout(() => {
          l();
        }, 300);
      }
      u.value = t, t.id.startsWith("custom") || O((e = d.value) == null ? void 0 : e.$el, "scalar-update-selected-client", t.id);
    }, j = z();
    return (t, e) => k.value ? (m(), S(s($), {
      key: 0,
      class: "request-card dark-mode",
      ref_key: "elem",
      ref: d
    }, {
      default: r(() => [
        n(s(M), { class: "pr-2.5" }, H({
          default: r(() => [
            e[3] || (e[3] = v("span", { class: "sr-only" }, "Request Example for", -1)),
            n(s(T), {
              as: "span",
              class: "request-method",
              method: t.method
            }, null, 8, ["method"]),
            t.generateLabel ? (m(), q("span", {
              key: 0,
              innerHTML: t.generateLabel()
            }, null, 8, Y)) : h(t.$slots, "header", { key: 1 }, void 0, !0)
          ]),
          _: 2
        }, [
          f.value.length ? {
            name: "actions",
            fn: r(() => [
              n(s(W), {
                class: "max-h-80",
                modelValue: u.value,
                options: f.value,
                teleport: "",
                placement: "bottom-end",
                "onUpdate:modelValue": e[0] || (e[0] = (l) => L(l))
              }, {
                default: r(() => [
                  n(s(D), {
                    "data-testid": "client-picker",
                    class: "text-c-2 hover:text-c-1 flex h-full w-fit gap-1.5 px-0.5",
                    fullWidth: "",
                    variant: "ghost"
                  }, {
                    default: r(() => [
                      v("span", Z, K(u.value.title), 1),
                      n(s(G), {
                        weight: "bold",
                        class: "ui-open:rotate-180 mt-0.25 size-3 transition-transform duration-100"
                      })
                    ]),
                    _: 1
                  })
                ]),
                _: 1
              }, 8, ["modelValue", "options"])
            ]),
            key: "0"
          } : void 0
        ]), 1024),
        n(s(E), { class: "request-editor-section custom-scroll p-0" }, {
          default: r(() => {
            var l;
            return [
              v("div", {
                id: `${s(j)}-example`,
                class: "code-snippet"
              }, [
                n(s(F), {
                  class: "bg-b-2 !min-h-full -outline-offset-2",
                  content: k.value,
                  hideCredentials: w.value,
                  lang: (l = u.value) == null ? void 0 : l.lang,
                  lineNumbers: ""
                }, null, 8, ["content", "hideCredentials", "lang"])
              ], 8, _)
            ];
          }),
          _: 1
        }),
        Object.keys(c.value).length || t.$slots.footer ? (m(), S(s(U), {
          key: 0,
          class: "request-card-footer bg-b-3"
        }, {
          default: r(() => [
            Object.keys(c.value).length ? (m(), q("div", ee, [
              n(X, {
                examples: c.value,
                modelValue: y.value,
                "onUpdate:modelValue": [
                  e[1] || (e[1] = (l) => y.value = l),
                  e[2] || (e[2] = (l) => {
                    var a;
                    return s(O)((a = d.value) == null ? void 0 : a.$el, "scalar-update-selected-example", l);
                  })
                ]
              }, null, 8, ["examples", "modelValue"])
            ])) : b("", !0),
            h(t.$slots, "footer", {}, void 0, !0)
          ]),
          _: 3
        })) : b("", !0)
      ]),
      _: 3
    }, 512)) : t.fallback ? (m(), S(s($), {
      key: 1,
      class: "request-card dark-mode"
    }, {
      default: r(() => [
        n(s(E), { class: "request-card-simple" }, {
          default: r(() => [
            v("div", te, [
              n(s(T), {
                as: "span",
                class: "request-method",
                method: t.method
              }, null, 8, ["method"]),
              h(t.$slots, "header", {}, void 0, !0)
            ]),
            h(t.$slots, "footer", {}, void 0, !0)
          ]),
          _: 3
        })
      ]),
      _: 3
    })) : b("", !0);
  }
});
export {
  ve as default
};
