@scalar/api-client
Version:
the open source API testing client
49 lines (48 loc) • 1.56 kB
JavaScript
import { themePresets as p, defaultFonts as g } from "@scalar/themes";
import { computed as d, toValue as a } from "vue";
const i = new Map(p.map((e) => [e.slug, e])), T = (e, l = "scalar-theme") => `<style id="scalar-theme" data-testid="${l}">${e}</style>`, o = (e, l) => {
const t = (r) => `${r}
${g}`;
if (i.has(e))
return t(i.get(e)?.theme ?? "");
const s = l.find((r) => r.slug === e);
if (s)
return t(s.theme);
}, w = ({
fallbackThemeSlug: e,
store: l,
customThemes: t
}) => {
const s = d(() => {
const u = { themeStyles: o("default", []), themeSlug: "default" }, c = a(l), n = a(e);
if (c === null)
return u;
const h = c.workspace["x-scalar-theme"], m = h === "none" ? n : h;
if (!m) {
const y = o(n, a(t));
return y ? { themeStyles: y, themeSlug: n } : u;
}
const S = o(m, a(t));
if (S)
return { themeStyles: S, themeSlug: m };
const f = o(n, a(t));
return f ? { themeStyles: f, themeSlug: n } : u;
}), r = d(() => T(s.value.themeStyles, s.value.themeSlug));
return {
/**
* Computed ref containing the resolved theme styles object
* for the currently active theme. Always returns a style object,
* never null, with proper fallback logic if custom or workspace themes are missing.
*/
themeStyles: s,
/**
* Computed ref containing a <style> tag as a string,
* ready to be injected into the DOM.
* This wraps the currently active theme CSS variables/styles.
*/
themeStyleTag: r
};
};
export {
w as useTheme
};