import { defineComponent as p, ref as f, useId as v, onBeforeMount as C, watch as S, nextTick as h, onBeforeUnmount as k, createBlock as T, openBlock as _, Transition as w, withCtx as n, withDirectives as x, createElementVNode as a, mergeProps as y, unref as c, createVNode as B, renderSlot as F, vShow as $ } from "vue";
import { addScalarClassesToHeadless as b, ScalarTeleportRoot as g } from "@scalar/components";
import { useFocusTrap as I } from "@vueuse/integrations/useFocusTrap";
const M = { class: "scalar scalar-app z-overlay relative" }, N = { class: "scalar-container" }, P = ["id"], E = /* @__PURE__ */ p({
  __name: "ModalClientContainer",
  props: {
    modalState: {}
  },
  emits: ["open", "close"],
  setup(t, { emit: d }) {
    const m = t, o = d, l = f(null), s = v(), { activate: u, deactivate: i } = I(l, {
      allowOutsideClick: !0,
      fallbackFocus: `#${s}`
    });
    return C(() => b()), S(
      () => m.modalState.open,
      async (e) => {
        e ? (await h(), u(), o("open")) : (i(), o("close"));
      },
      { immediate: !1 }
    ), k(() => {
      i();
    }), (e, r) => (_(), T(w, { name: "scalar-client-fade" }, {
      default: n(() => [
        x(a("div", M, [
          a("div", N, [
            a("div", y({
              id: c(s),
              ref_key: "client",
              ref: l,
              "aria-label": "API Client",
              "aria-modal": "true"
            }, e.$attrs, {
              class: "scalar-app-layout scalar-client",
              role: "dialog",
              tabindex: "-1"
            }), [
              B(c(g), null, {
                default: n(() => [
                  F(e.$slots, "default", {}, void 0, !0)
                ]),
                _: 3
              })
            ], 16, P),
            a("div", {
              class: "scalar-app-exit",
              onClick: r[0] || (r[0] = (V) => t.modalState.hide())
            })
          ])
        ], 512), [
          [$, t.modalState.open]
        ])
      ]),
      _: 3
    }));
  }
});
export {
  E as default
};
