// Spec Version Warning Banner // Displays a warning banner on older spec versions and draft pages. // // Mintlify automatically loads all .js files in the docs directory, // and it maintains a /specification/latest/* redirect that always points // to the current latest version. We use that redirect as the source of // truth, so this script requires no updates when a new spec version is // published. Styling re-uses Mintlify's native callout classes. const DRAFT_VERSION = "draft"; const LATEST_ALIAS_PATH = "/specification/latest"; const SPEC_PATH_REGEX = /\/specification\/([\w-]+)(\/.*)?$/; const BANNER_ATTR = "data-spec-version-banner"; const CALLOUT_CLASS_WARNING = "callout my-4 px-5 py-4 overflow-hidden rounded-2xl flex gap-3 " + "border border-yellow-200 bg-yellow-50 " + "dark:border-yellow-900 dark:bg-yellow-600/20 " + "[&_[data-component-part='callout-icon']]:mt-px"; const CALLOUT_CLASS_INFO = "callout my-4 px-5 py-4 overflow-hidden rounded-2xl flex gap-3 " + "border border-neutral-200 bg-neutral-50 " + "dark:border-neutral-700 dark:bg-white/10"; const CONTENT_CLASS_BASE = "text-sm prose dark:prose-invert min-w-0 w-full " + "[&_a]:!text-current [&_a]:border-current [&_strong]:!text-current "; const CONTENT_CLASS_WARNING = CONTENT_CLASS_BASE + "text-yellow-800 dark:text-yellow-300"; const CONTENT_CLASS_INFO = CONTENT_CLASS_BASE + "text-neutral-800 dark:text-neutral-300"; const ICON_WRAPPER_CLASS = "mt-0.5 w-4"; const ICON_SVG_WARNING = ''; const ICON_SVG_INFO = ''; function parseSpecPath(pathname) { const match = pathname.match(SPEC_PATH_REGEX); if (!match) return null; return { version: match[1], subPath: match[2] || "" }; } async function resolveLatestVersion() { const cached = sessionStorage.getItem("mcp-latest-spec-version"); if (cached) return cached; const response = await fetch(LATEST_ALIAS_PATH, { method: "HEAD" }); const resolved = parseSpecPath(new URL(response.url).pathname); const version = resolved ? resolved.version : null; if (version && version !== "latest") { sessionStorage.setItem("mcp-latest-spec-version", version); } return version; } function createBanner(message, linkHref, linkText, isDraft) { const banner = document.createElement("div"); banner.className = isDraft ? CALLOUT_CLASS_INFO : CALLOUT_CLASS_WARNING; banner.setAttribute("role", "alert"); banner.setAttribute(BANNER_ATTR, ""); banner.setAttribute("data-callout-type", isDraft ? "info" : "warning"); const iconWrapper = document.createElement("div"); iconWrapper.className = ICON_WRAPPER_CLASS; iconWrapper.setAttribute("data-component-part", "callout-icon"); iconWrapper.innerHTML = isDraft ? ICON_SVG_INFO : ICON_SVG_WARNING; const content = document.createElement("div"); content.className = isDraft ? CONTENT_CLASS_INFO : CONTENT_CLASS_WARNING; content.setAttribute("data-component-part", "callout-content"); const text = document.createElement("span"); text.textContent = message + " "; const link = document.createElement("a"); link.href = linkHref; link.textContent = linkText; content.appendChild(text); content.appendChild(link); banner.appendChild(iconWrapper); banner.appendChild(content); return banner; } let inserting = false; async function insertWarningBanner() { if (inserting) return; if (document.querySelector(`[${BANNER_ATTR}]`)) return; const current = parseSpecPath(window.location.pathname); if (!current) return; inserting = true; try { const latest = await resolveLatestVersion().catch(() => null); if (!latest || current.version === latest) return; // Re-check after the await — a concurrent call may have already // inserted a banner, or SPA navigation may have changed the page. if (document.querySelector(`[${BANNER_ATTR}]`)) return; if (parseSpecPath(window.location.pathname)?.version !== current.version) return; const contentArea = document.querySelector( "#content-area, main, article, .content", ); if (!contentArea) return; // Mintlify redirects /specification/latest/ to the actual // version, so users land on the equivalent page in the latest spec. const latestHref = LATEST_ALIAS_PATH + current.subPath; const linkText = `View the latest version (${latest})`; const isDraft = current.version === DRAFT_VERSION; const message = isDraft ? "You are viewing a draft of a not-yet-finalized specification." : `You are viewing an older version (${current.version}) of the specification.`; const banner = createBanner(message, latestHref, linkText, isDraft); // Place the banner just below the page title block. Mintlify wraps // the H1 in

; fall back to a raw

or the // top of the content area. const header = contentArea.querySelector("header#header") || contentArea.querySelector("h1"); if (header) { header.insertAdjacentElement("afterend", banner); } else { contentArea.insertBefore(banner, contentArea.firstChild); } } finally { inserting = false; } } if (document.readyState === "loading") { document.addEventListener("DOMContentLoaded", insertWarningBanner); } else { insertWarningBanner(); } // Re-insert after SPA navigation. const observer = new MutationObserver(() => { if ( !document.querySelector(`[${BANNER_ATTR}]`) && parseSpecPath(window.location.pathname) ) { insertWarningBanner(); } }); observer.observe(document.body, { childList: true, subtree: true });

Get started

About MCP

Develop with MCP

Developer tools

​📢 Documentation Has Moved

📢 Documentation Has Moved