@scalar/api-reference/dist/v2/ApiReferenceWorkspace.vue.js

Generate beautiful API references from OpenAPI documents

import { defineComponent as w, ref as m, toRef as I, provide as N, useTemplateRef as P, onBeforeMount as L, watch as s, computed as U, createElementBlock as V, openBlock as C, createBlock as A, createCommentVNode as B, createVNode as f, unref as n, resolveDynamicComponent as _, withCtx as i, createTextVNode as H, toDisplayString as K, renderSlot as u, isRef as O } from "vue";
import { isClient as D } from "@scalar/api-client/v2/blocks/operation-code-sample";
import { safeLocalStorage as F, REFERENCE_LS_KEYS as W } from "@scalar/helpers/object/local-storage";
import { makeUrlAbsolute as Y } from "@scalar/helpers/url/make-url-absolute";
import { redirectToProxy as z } from "@scalar/oas-utils/helpers";
import { useColorMode as j } from "@scalar/use-hooks/useColorMode";
import { useSeoMeta as q } from "@unhead/vue";
import { useFavicon as G } from "@vueuse/core";
import J from "../components/ApiReferenceLayout.vue.js";
import Q from "../features/toolbar/ApiReferenceToolbar.vue.js";
import { NAV_STATE_SYMBOL as X } from "../hooks/useNavState.js";
import { getDocumentName as Z } from "./helpers/get-document-name.js";
import { mapConfiguration as E } from "./helpers/map-configuration.js";
import { normalizeContent as ee } from "./helpers/normalize-content.js";
import { useWorkspaceStoreEvents as te } from "./hooks/use-workspace-store-events.js";
import { useMultipleDocuments as oe } from "../features/multiple-documents/useMultipleDocuments.js";
import re from "../features/multiple-documents/DocumentSelector.vue.js";
const Se = /* @__PURE__ */ w({
  __name: "ApiReferenceWorkspace",
  props: {
    configuration: {},
    store: {}
  },
  emits: ["updateContent"],
  setup(S) {
    const p = S, d = m({}), {
      availableDocuments: v,
      selectedConfiguration: o,
      selectedDocumentIndex: l,
      isIntersectionEnabled: c,
      hash: h,
      hashPrefix: M
    } = oe({
      configuration: I(p, "configuration"),
      configurationOverrides: d,
      isIntersectionEnabled: m(!1),
      hash: m(""),
      hashPrefix: m("")
    }), b = (e, t) => fetch(
      z(o.value.proxyUrl, e.toString()),
      t
    );
    N(X, {
      isIntersectionEnabled: c,
      hash: h,
      hashPrefix: M,
      basePath: () => o.value.pathRouting?.basePath,
      generateHeadingSlug: () => o.value.generateHeadingSlug
    });
    const g = P("root"), r = p.store;
    L(() => {
      const e = F().getItem(
        W.SELECTED_CLIENT
      );
      D(e) && !r.workspace["x-scalar-default-client"] && r.update("x-scalar-default-client", e);
    });
    const x = async (e) => {
      const t = ee(e.content), a = Z({
        name: e.slug || e.title,
        url: e.url,
        document: t
      });
      if (r.workspace.documents[a]) {
        t && (c.value = !1, r.replaceDocument(a, t), r.update("x-scalar-active-document", a), setTimeout(() => {
          c.value = !0;
        }, 300));
        return;
      }
      if (t)
        return await r.addDocument({
          name: a,
          document: t,
          config: E(e)
        });
      if (e.url)
        return await r.addDocument({
          name: e.slug ?? "default",
          url: Y(e.url, {
            basePath: o.value.pathRouting?.basePath
          }),
          fetch: e.fetch ?? b,
          config: E(e)
        });
    };
    s(
      [
        () => o.value.slug,
        () => o.value.url,
        () => o.value.content
      ],
      ([e, t, a]) => {
        (e || t || a) && x(o.value);
      },
      { immediate: !0 }
    ), te(r, g), s(
      () => o.value.defaultHttpClient,
      (e) => {
        if (e) {
          const { targetKey: t, clientKey: a } = e, k = `${t}/${a}`;
          D(k) && r.update("x-scalar-default-client", k);
        }
      },
      { immediate: !0 }
    );
    function y(e) {
      if (e === !0)
        return "dark";
      if (e === !1)
        return "light";
    }
    const { toggleColorMode: $, isDarkMode: R } = j({
      initialColorMode: y(o.value.darkMode),
      overrideColorMode: o.value.forceDarkModeState
    });
    s(
      () => o.value.darkMode,
      (e) => r.update("x-scalar-dark-mode", !!e)
    ), s(
      () => R.value,
      (e) => r.update("x-scalar-dark-mode", e),
      { immediate: !0 }
    ), s(
      () => l.value,
      (e) => r.update(
        "x-scalar-active-document",
        v.value[e]?.slug
      ),
      { immediate: !0 }
    ), o.value.metaData && q(o.value.metaData);
    const T = U(() => o.value.favicon);
    return G(T), (e, t) => (C(), V("div", {
      ref_key: "root",
      ref: g
    }, [
      n(o)?.customCss ? (C(), A(_("style"), { key: 0 }, {
        default: i(() => [
          H(K(n(o).customCss), 1)
        ]),
        _: 1
      })) : B("", !0),
      f(J, {
        configuration: n(o),
        isDark: !!n(r).workspace["x-scalar-dark-mode"],
        store: n(r),
        onToggleDarkMode: t[2] || (t[2] = () => n($)()),
        onUpdateContent: t[3] || (t[3] = (a) => e.$emit("updateContent", a))
      }, {
        "document-selector": i(() => [
          f(n(re), {
            modelValue: n(l),
            "onUpdate:modelValue": t[0] || (t[0] = (a) => O(l) ? l.value = a : null),
            options: n(v)
          }, null, 8, ["modelValue", "options"])
        ]),
        "content-start": i(() => [
          f(Q, {
            overrides: d.value,
            "onUpdate:overrides": t[1] || (t[1] = (a) => d.value = a),
            configuration: n(o),
            workspace: n(r)
          }, null, 8, ["overrides", "configuration", "workspace"]),
          u(e.$slots, "content-start")
        ]),
        "content-end": i(() => [
          u(e.$slots, "content-end")
        ]),
        "sidebar-start": i(() => [
          u(e.$slots, "sidebar-start")
        ]),
        "sidebar-end": i(() => [
          u(e.$slots, "sidebar-end")
        ]),
        footer: i(() => [
          u(e.$slots, "footer")
        ]),
        _: 3
      }, 8, ["configuration", "isDark", "store"])
    ], 512));
  }
});
export {
  Se as default
};