import { defineComponent as me, computed as M, provide as S, ref as C, onBeforeMount as fe, onMounted as V, watch as I, toValue as U, onUnmounted as ve, useId as pe, createElementBlock as m, openBlock as a, Fragment as Y, createElementVNode as p, createVNode as f, normalizeStyle as ge, normalizeClass as he, unref as r, createCommentVNode as l, withDirectives as Se, createBlock as b, renderSlot as d, normalizeProps as g, guardReactiveProps as h, withCtx as s, vShow as be, createSlots as ye } from "vue";
import { provideUseId as we } from "@headlessui/vue";
import { OpenApiClientButton as ke } from "@scalar/api-client/components";
import { LAYOUT_SYMBOL as $e } from "@scalar/api-client/hooks";
import { WORKSPACE_SYMBOL as Me, ACTIVE_ENTITIES_SYMBOL as Te } from "@scalar/api-client/store";
import { addScalarClassesToHeadless as De, ScalarErrorBoundary as Ce, ScalarSidebarFooter as Ee, ScalarColorModeToggleButton as Oe, ScalarColorModeToggleIcon as Ie } from "@scalar/components";
import { sleep as Be } from "@scalar/helpers/testing/sleep";
import { hasObtrusiveScrollbars as Le, getThemeStyles as Re } from "@scalar/themes";
import { apiReferenceConfigurationSchema as _e } from "@scalar/types/api-reference";
import { useBreakpoints as Ae } from "@scalar/use-hooks/useBreakpoints";
import { useToasts as Pe, ScalarToasts as He } from "@scalar/use-toasts";
import { useMediaQuery as Fe, useResizeObserver as Ne, useDebounceFn as Ve } from "@vueuse/core";
import Ue from "./ClassicHeader.vue.js";
import Ye from "./GettingStarted.vue.js";
import { hasLazyLoaded as Ke } from "./Lazy/lazyBus.js";
import ze from "./MobileHeader.vue.js";
import { CONFIGURATION_SYMBOL as Ge } from "../hooks/useConfig.js";
import { useNavState as Qe } from "../hooks/useNavState.js";
import { downloadEventBus as K, downloadDocument as We } from "../libs/download.js";
import { useDocumentSource as je } from "../features/document-source/hooks/useDocumentSource.js";
import { OPENAPI_VERSION_SYMBOL as qe } from "../features/download-link/openapi-version-symbol.js";
import { useSidebar as Je } from "../features/sidebar/hooks/useSidebar.js";
import { PLUGIN_MANAGER_SYMBOL as Xe } from "../plugins/hooks/usePluginManager.js";
import { createPluginManager as Ze } from "../plugins/plugin-manager.js";
import xe from "../features/sidebar/components/Sidebar.vue.js";
import z from "../features/Search/components/SearchButton.vue.js";
import et from "./Content/Content.vue.js";
import "./Content/Content.vue2.js";
import tt from "../features/api-client-modal/ApiClientModal.vue.js";
const ot = ["innerHTML"], rt = { class: "references-header" }, at = ["aria-label"], nt = { class: "references-navigation-list" }, lt = { key: 0 }, st = {
  key: 1,
  class: "scalar-api-references-standalone-search"
}, it = { key: 1 }, dt = { class: "references-editor" }, ut = { class: "references-editor-textarea" }, ct = ["aria-label"], mt = {
  key: 0,
  class: "w-64 *:!p-0 empty:hidden"
}, ft = {
  key: 0,
  class: "references-footer"
}, Kt = /* @__PURE__ */ me({
  inheritAttrs: !1,
  __name: "ApiReferenceLayout",
  props: {
    configuration: {},
    dereferencedDocument: {},
    originalDocument: {},
    isDark: { type: Boolean },
    rawSpec: {},
    store: {}
  },
  emits: ["changeTheme", "updateContent", "loadSwaggerFile", "linkSwaggerFile", "toggleDarkMode"],
  setup(T) {
    const t = M(
      () => _e.parse(T.configuration)
    ), { initializeToasts: G, toast: Q } = Pe();
    G((e) => Q(e));
    const {
      originalDocument: W,
      originalOpenApiVersion: j,
      dereferencedDocument: v,
      workspaceStore: q,
      activeEntitiesStore: J
    } = je({
      configuration: t,
      dereferencedDocument: T.dereferencedDocument,
      originalDocument: T.originalDocument
    });
    S(qe, j), S(Me, q), S(Te, J);
    const X = Fe("(min-width: 1150px)"), Z = C("100dvh"), y = C(null);
    Ne(y, (e) => {
      Z.value = e[0] ? e[0].contentRect.height + "px" : "100dvh";
    });
    const x = M(Le), B = Qe(t), { isSidebarOpen: E, setCollapsedSidebarItem: L, scrollToOperation: ee, items: te } = Je(v, {
      ...B,
      config: t
    }), {
      getReferenceId: oe,
      getPathRoutingId: re,
      getSectionId: ae,
      getTagId: ne,
      hash: D,
      isIntersectionEnabled: R,
      updateHash: _,
      replaceUrlState: le
    } = B;
    if (t.value.redirect && typeof window < "u") {
      const e = t.value.redirect(
        (t.value.pathRouting ? window.location.pathname : "") + window.location.hash
      );
      e && history.replaceState({}, "", e);
    }
    fe(() => {
      _(), De();
    });
    const A = async (e) => {
      var o;
      R.value = !1, _(), e ? ee(e) : (o = y.value) == null || o.scrollTo(0, 0), await Be(100), R.value = !0;
    }, P = C(0);
    V(() => {
      var n, w, k;
      history.scrollRestoration = "manual";
      const e = (w = (n = y.value) == null ? void 0 : n.parentElement) == null ? void 0 : w.getBoundingClientRect(), o = (k = y.value) == null ? void 0 : k.getBoundingClientRect();
      if (e && o) {
        const $ = o.top - e.top;
        P.value = $ < 2 ? 0 : $;
      }
      window.onhashchange = () => {
        A(oe());
      }, window.onpopstate = () => t.value.pathRouting && A(re(window.location.pathname)), window.addEventListener("scroll", H, { passive: !0 });
    });
    const se = M(
      () => X.value || !t.value.isEditable
    ), H = Ve(() => {
      window.scrollY < 50 && Ke.value && le("");
    }), ie = C(!1);
    I(v, (e) => {
      var o;
      if (D.value) {
        const n = ae(D.value);
        n && L(n, !0);
      } else {
        const n = (o = e.tags) == null ? void 0 : o[0];
        n && L(ne(n), !0);
      }
      ie.value = !0;
    });
    const u = M(() => {
      var e;
      return {
        breadcrumb: ((e = te.value) == null ? void 0 : e.titles.get(D.value)) ?? ""
      };
    });
    V(
      () => K.on(({ filename: e, format: o }) => {
        We(
          U(W) || U(T.rawSpec) || "",
          e,
          o
        );
      })
    ), ve(() => {
      window.removeEventListener("scroll", H), K.reset();
    }), we(() => pe()), S($e, "modal"), S(Ge, t), S(
      Xe,
      Ze({
        plugins: t.value.plugins
      })
    );
    const de = M(
      () => `<style>
  ${Re(t.value.theme, {
        fonts: t.value.withDefaultFonts
      })}</style>`
    ), { mediaQueries: ue } = Ae(), ce = !1;
    return I(ue.lg, (e, o) => {
      o && !e && (E.value = !1);
    }), I(D, (e, o) => {
      e && e !== o && (E.value = !1);
    }), (e, o) => {
      var n, w, k, $, F;
      return a(), m(Y, null, [
        p("div", { innerHTML: de.value }, null, 8, ot),
        p("div", {
          ref_key: "documentEl",
          ref: y,
          class: he(["scalar-app scalar-api-reference references-layout", [
            {
              "scalar-api-references-standalone-mobile": t.value.showSidebar ?? !0,
              "scalar-scrollbars-obtrusive": x.value,
              "references-editable": t.value.isEditable,
              "references-sidebar": t.value.showSidebar,
              "references-sidebar-mobile-open": r(E),
              "references-classic": t.value.layout === "classic"
            },
            e.$attrs.class
          ]]),
          style: ge({
            "--scalar-y-offset": `var(--scalar-custom-header-height, ${P.value}px)`
          })
        }, [
          p("div", rt, [
            t.value.layout === "modern" && (t.value.showSidebar ?? !0) ? (a(), b(ze, {
              key: 0,
              breadcrumb: u.value.breadcrumb
            }, null, 8, ["breadcrumb"])) : l("", !0),
            d(e.$slots, "header", g(h(u.value)), void 0, !0)
          ]),
          t.value.showSidebar ? (a(), m("aside", {
            key: 0,
            "aria-label": `Sidebar for ${(w = (n = r(v)) == null ? void 0 : n.info) == null ? void 0 : w.title}`,
            class: "references-navigation t-doc__sidebar"
          }, [
            p("div", nt, [
              f(r(Ce), null, {
                default: s(() => {
                  var i, c;
                  return [
                    f(r(xe), {
                      title: ((c = (i = r(v)) == null ? void 0 : i.info) == null ? void 0 : c.title) ?? "The OpenAPI Schema"
                    }, {
                      "sidebar-start": s(() => {
                        var O, N;
                        return [
                          e.$slots["document-selector"] ? (a(), m("div", lt, [
                            d(e.$slots, "document-selector", {}, void 0, !0)
                          ])) : l("", !0),
                          t.value.hideSearch ? l("", !0) : (a(), m("div", st, [
                            f(r(z), {
                              searchHotKey: (O = t.value) == null ? void 0 : O.searchHotKey,
                              hideModels: (N = t.value) == null ? void 0 : N.hideModels
                            }, null, 8, ["searchHotKey", "hideModels"])
                          ])),
                          d(e.$slots, "sidebar-start", g(h(u.value)), void 0, !0)
                        ];
                      }),
                      "sidebar-end": s(() => [
                        d(e.$slots, "sidebar-end", g(h(u.value)), () => [
                          f(r(Ee), { class: "darklight-reference" }, {
                            toggle: s(() => [
                              t.value.hideDarkModeToggle ? (a(), m("span", it)) : (a(), b(r(Oe), {
                                key: 0,
                                modelValue: e.isDark,
                                "onUpdate:modelValue": o[0] || (o[0] = (O) => e.$emit("toggleDarkMode"))
                              }, null, 8, ["modelValue"]))
                            ]),
                            default: s(() => [
                              t.value.hideClientButton ? l("", !0) : (a(), b(r(ke), {
                                key: 0,
                                buttonSource: "sidebar",
                                integration: t.value._integration,
                                isDevelopment: ce,
                                url: t.value.url
                              }, null, 8, ["integration", "url"]))
                            ]),
                            _: 1
                          })
                        ], !0)
                      ]),
                      _: 3
                    }, 8, ["title"])
                  ];
                }),
                _: 3
              })
            ])
          ], 8, at)) : l("", !0),
          Se(p("div", dt, [
            p("div", ut, [
              d(e.$slots, "editor", g(h(u.value)), void 0, !0)
            ])
          ], 512), [
            [be, t.value.isEditable]
          ]),
          se.value ? (a(), m(Y, { key: 1 }, [
            p("main", {
              "aria-label": `Open API Documentation for ${($ = (k = r(v)) == null ? void 0 : k.info) == null ? void 0 : $.title}`,
              class: "references-rendered"
            }, [
              f(r(et), {
                document: r(v),
                config: t.value,
                store: e.store
              }, ye({
                start: s(() => [
                  d(e.$slots, "content-start", g(h(u.value)), () => [
                    t.value.layout === "classic" ? (a(), b(Ue, { key: 0 }, {
                      "dark-mode-toggle": s(() => [
                        t.value.hideDarkModeToggle ? l("", !0) : (a(), b(r(Ie), {
                          key: 0,
                          class: "text-c-2 hover:text-c-1",
                          mode: e.isDark ? "dark" : "light",
                          style: { transform: "scale(1.4)" },
                          variant: "icon",
                          onClick: o[1] || (o[1] = (i) => e.$emit("toggleDarkMode"))
                        }, null, 8, ["mode"]))
                      ]),
                      default: s(() => {
                        var i;
                        return [
                          e.$slots["document-selector"] ? (a(), m("div", mt, [
                            d(e.$slots, "document-selector", {}, void 0, !0)
                          ])) : l("", !0),
                          t.value.hideSearch ? l("", !0) : (a(), b(r(z), {
                            key: 1,
                            class: "t-doc__sidebar max-w-64",
                            searchHotKey: t.value.searchHotKey,
                            hideModels: (i = t.value) == null ? void 0 : i.hideModels
                          }, null, 8, ["searchHotKey", "hideModels"]))
                        ];
                      }),
                      _: 3
                    })) : l("", !0)
                  ], !0)
                ]),
                end: s(() => [
                  d(e.$slots, "content-end", g(h(u.value)), void 0, !0)
                ]),
                _: 2
              }, [
                (F = t.value) != null && F.isEditable ? {
                  name: "empty-state",
                  fn: s(() => {
                    var i;
                    return [
                      f(Ye, {
                        theme: ((i = t.value) == null ? void 0 : i.theme) || "default",
                        onChangeTheme: o[2] || (o[2] = (c) => e.$emit("changeTheme", c)),
                        onLinkSwaggerFile: o[3] || (o[3] = (c) => e.$emit("linkSwaggerFile")),
                        onLoadSwaggerFile: o[4] || (o[4] = (c) => e.$emit("loadSwaggerFile")),
                        onUpdateContent: o[5] || (o[5] = (c) => e.$emit("updateContent", c))
                      }, null, 8, ["theme"])
                    ];
                  }),
                  key: "0"
                } : void 0
              ]), 1032, ["document", "config", "store"])
            ], 8, ct),
            e.$slots.footer ? (a(), m("div", ft, [
              d(e.$slots, "footer", g(h(u.value)), void 0, !0)
            ])) : l("", !0)
          ], 64)) : l("", !0),
          f(r(tt), {
            configuration: t.value,
            dereferencedDocument: r(v)
          }, null, 8, ["configuration", "dereferencedDocument"])
        ], 6),
        f(r(He))
      ], 64);
    };
  }
});
export {
  Kt as default
};
