/* * Nextedy docs — scoped search box. * * Mintlify auto-injects any .js committed to the repo on every page. This widget adds a * search box at the top of the article: * - On a page inside a top-level CATEGORY (a product or solution — derived from the first * URL path segment via /search-config.json) it searches ONLY that category. * - On a configured SUB-SECTION (e.g. /overview/security-and-privacy) — a coherent area * under a hub segment — it searches ONLY that section. * - On the hub/home (Introduction → /overview) and any page not inside a category/section * it does NOT mount at all; the global ⌘K search covers those. * Documents come from /search-index/.json (Mintlify serves .json same-origin); a * section reuses its parent segment's shard, filtered to the section's path prefix. Search * runs entirely client-side — no Pagefind, no external host. The global ⌘K search is left * untouched. * * Result items reuse Mintlify's built-in search-item markup (the same Tailwind utility * classes + data-component-part hooks), so they inherit the built-in styling with no * duplicated CSS: an icon, a title, and a breadcrumb trail. The breadcrumb is derived from * the result URL (product label + folder names) — no extra index data needed. * * All Mintlify-specific selectors are centralized in SEL (Mintlify warns these "may * change"); if anything is missing the widget simply doesn't mount — it never throws. * * The /search-config.json map and /search-index/ shards are generated by * scripts/build-search-index/ — re-run its build.sh after content changes. */ (function () { "use strict"; if (typeof window === "undefined" || window.__nxScopedSearch) return; window.__nxScopedSearch = true; // ---- config ---------------------------------------------------------------- var CONFIG_URL = "/search-config.json"; var SHARD_BASE = "/search-index"; // /search-index/.json var INITIAL_RESULTS = 8; // shown before "See all results" var MAX_RESULTS = 50; // hard cap rendered after "See all results" var DEBOUNCE_MS = 140; var MIN_QUERY = 2; var BOX_ID = "nx-scoped-search"; var SEL = { contentArea: "#content-area", body: "#content" }; // box anchors at top of the prose column var DEFAULT_HUB = ["overview"]; // fallback if config omits hubSegments (no box here) // Reused built-in styling. Same Tailwind classes Mintlify's own search-item uses, so the // CSS already exists on the page — no duplication. data-[highlighted] drives the active/hover row. var ITEM_CLASS = "nx-ss-result flex items-start gap-2 px-2 py-1.5 rounded-[calc(var(--rounded-search,1.25rem)-0.375rem)] cursor-pointer outline-none last:mb-2 data-[highlighted]:bg-black/[0.03] dark:data-[highlighted]:bg-white/5"; var ICON = ''; // ---- state ----------------------------------------------------------------- var configPromise = null; var cfgMap = {}; // segment -> product label (for breadcrumbs); set on load var shardCache = {}; // segment -> Promise var current = null; // { key } the mounted box is scoped to var activeIndex = -1; var syncTimer = null; var debounceTimer = null; // ---- helpers --------------------------------------------------------------- function escapeHtml(s) { return String(s).replace(/[&<>"']/g, function (c) { return { "&": "&", "<": "<", ">": ">", '"': """, "'": "'" }[c]; }); } function tokenize(s) { return (String(s).toLowerCase().match(/[a-z0-9]+/g) || []); } function humanize(s) { return String(s).replace(/-/g, " ").replace(/\b\w/g, function (c) { return c.toUpperCase(); }); } function loadConfig() { if (!configPromise) { configPromise = fetch(CONFIG_URL) .then(function (r) { return r.ok ? r.json() : {}; }) .then(function (j) { cfgMap = (j && j.segmentToProduct) || {}; return { map: cfgMap, hubSegments: (j && j.hubSegments) || DEFAULT_HUB, sections: (j && j.sections) || [] }; }) .catch(function () { return { map: {}, hubSegments: DEFAULT_HUB, sections: [] }; }); } return configPromise; } // Decide the search scope for the current URL. The box mounts inside a top-level category // (a product or solution: first path segment in the config and not a hub segment) OR inside // a configured sub-section (a coherent area under a hub segment, e.g. overview/security-and- // privacy). The hub/home (Introduction → /overview) and any unrecognized path return null → // no box mounts there; the global ⌘K search covers them. function scopeForPath(cfg) { var path = location.pathname.replace(/^\/+/, ""); // Sub-section scopes win over the first-segment rule (a section lives under a hub // segment). Longest matching prefix wins, so a nested section beats a shallower one. var sec = null; (cfg.sections || []).forEach(function (s) { if ((path === s.prefix || path.indexOf(s.prefix + "/") === 0) && (!sec || s.prefix.length > sec.prefix.length)) sec = s; }); if (sec) return { key: "sec:" + sec.prefix, searchSeg: sec.prefix, pill: sec.label, placeholder: "Search " + sec.label + " documentation…" }; var seg = path.split("/")[0]; if (!seg || cfg.hubSegments.indexOf(seg) !== -1 || !cfg.map[seg]) return null; return { key: seg, searchSeg: seg, pill: cfg.map[seg], placeholder: "Search " + cfg.map[seg] + " documentation…" }; } // Breadcrumb trail for a result, from its URL: [product label, ...humanized folders]. // For a page result the final path segment (the page slug) is omitted — its title is shown // separately. For an accordion result (URL carries a #hash) the shown title is the question, // so the page slug is kept as the last crumb (e.g. Gantt › Faq › Licensing). function breadcrumbFor(url) { var hashless = String(url).replace(/#.*$/, ""); var isAnchor = hashless.length !== String(url).length; var segs = hashless.replace(/^\/+/, "").split("/").filter(Boolean); if (!segs.length) return []; var product = cfgMap[segs[0]] || humanize(segs[0]); var mid = isAnchor ? segs.slice(1) : segs.slice(1, -1); return [product].concat(mid.map(humanize)); } // ---- search engine (tiny TF-IDF + prefix) ---------------------------------- function buildIndex(docs) { var postings = new Map(); // token -> Map(docIdx -> tf) var titleTokens = []; // docIdx -> Set(title tokens) docs.forEach(function (d, i) { titleTokens.push(new Set(tokenize(d.t))); var toks = tokenize(d.t + " " + (d.s || "") + " " + (d.x || "")); var tf = new Map(); for (var k = 0; k < toks.length; k++) tf.set(toks[k], (tf.get(toks[k]) || 0) + 1); tf.forEach(function (c, tk) { var m = postings.get(tk); if (!m) { m = new Map(); postings.set(tk, m); } m.set(i, c); }); }); return { docs: docs, postings: postings, vocab: Array.from(postings.keys()), titleTokens: titleTokens, N: docs.length }; } // seg is either a single segment (whole-product shard) or a sub-section prefix like // "overview/security-and-privacy" — the latter loads its parent segment's shard and keeps // only the pages under that prefix (the parent shard already holds them; no extra file). function loadShard(seg) { if (!shardCache[seg]) { var slash = seg.indexOf("/"); var file = slash === -1 ? seg : seg.slice(0, slash); shardCache[seg] = fetch(SHARD_BASE + "/" + file + ".json") .then(function (r) { if (!r.ok) throw new Error("shard " + r.status); return r.json(); }) .then(function (j) { var docs = j.d || []; if (slash !== -1) { var pfx = "/" + seg; // shard URLs carry a leading slash docs = docs.filter(function (d) { return d.u === pfx || d.u.indexOf(pfx + "/") === 0; }); } return buildIndex(docs); }) .catch(function (e) { console.warn("[scoped-search] shard load failed:", e); shardCache[seg] = null; return null; }); } return shardCache[seg]; } // Returns { total, hits } — total is the true match count; hits is the top MAX_RESULTS. function runQuery(idx, query) { var qtokens = Array.from(new Set(tokenize(query))).filter(function (t) { return t.length >= MIN_QUERY; }); if (!qtokens.length) return { total: 0, hits: [] }; var scores = new Map(); // docIdx -> { score, covered:Set } qtokens.forEach(function (qt) { var matched = []; if (idx.postings.has(qt)) matched.push([qt, 1.0]); for (var v = 0; v < idx.vocab.length; v++) { var t = idx.vocab[v]; if (t !== qt && t.indexOf(qt) === 0) matched.push([t, 0.6]); // prefix match (penalized) } matched.forEach(function (pair) { var it = pair[0], weight = pair[1]; var m = idx.postings.get(it), idf = Math.log(1 + idx.N / m.size); m.forEach(function (tf, i) { var add = idf * (1 + Math.log(tf)) * weight + (idx.titleTokens[i].has(it) ? 2.0 : 0); var e = scores.get(i); if (!e) { e = { score: 0, covered: new Set() }; scores.set(i, e); } e.score += add; e.covered.add(qt); }); }); }); var ranked = []; scores.forEach(function (e, i) { var coverage = e.covered.size / qtokens.length; ranked.push({ i: i, score: e.score * (0.5 + 0.5 * coverage) + coverage }); }); ranked.sort(function (a, b) { return b.score - a.score; }); return { total: scores.size, hits: ranked.slice(0, MAX_RESULTS).map(function (r) { return idx.docs[r.i]; }), }; } // ---- DOM ------------------------------------------------------------------- function buildBox(placeholder, pill) { var box = document.createElement("div"); box.id = BOX_ID; box.setAttribute("role", "search"); box.innerHTML = '

' + '' + '' + (pill ? '' + escapeHtml(pill) + "" : "") + "

" + ''; return box; } function getBox() { return document.getElementById(BOX_ID); } function setResults(box, html) { var panel = box.querySelector(".nx-ss-results"); if (html == null) { panel.hidden = true; panel.innerHTML = ""; activeIndex = -1; return; } panel.innerHTML = html; panel.hidden = false; } // Built-in-style result row: icon + title + breadcrumb trail (reuses Mintlify's classes). function resultAnchor(doc) { var crumbs = breadcrumbFor(doc.u); var trail = crumbs.map(function (c, idx) { return (idx ? '' : "") + '' + escapeHtml(c) + ""; }).join(""); return '' + '' + ICON + "" + '

' + '' + escapeHtml(doc.t) + "" + (crumbs.length ? '' + trail + "" : "") + "

" + ""; } // result = { total, hits }; label = the current category (product/solution) name. function renderResults(box, label, result, expanded) { activeIndex = -1; var hits = result.hits, total = result.total; if (!hits.length) { setResults(box, '

' + (label ? ("No matches in " + escapeHtml(label) + ".") : "No matches.") + "

"); return; } var shown = expanded ? hits : hits.slice(0, INITIAL_RESULTS); var html = shown.map(resultAnchor).join(""); if (!expanded && total > INITIAL_RESULTS) { html += '"; } else if (expanded && total > hits.length) { html += '

Showing the top ' + hits.length + " of " + total + " — refine your search to narrow.

"; } setResults(box, html); var more = box.querySelector(".nx-ss-more"); if (more) more.addEventListener("click", function (e) { e.stopPropagation(); // don't let the document outside-click handler clear the dropdown renderResults(box, label, result, true); }); } function doSearch(box, seg, label, term) { if (!term || term.trim().length < MIN_QUERY) { setResults(box, null); return; } loadShard(seg).then(function (idx) { var input = box.querySelector(".nx-ss-input"); if (!idx || !input || input.value.trim() !== term.trim()) { if (!idx) setResults(box, '

Search is unavailable.

'); return; } renderResults(box, label, runQuery(idx, term), false); }); } function highlight(box, el) { Array.prototype.forEach.call(box.querySelectorAll(".nx-ss-result"), function (x) { x.removeAttribute("data-highlighted"); }); if (el) { el.setAttribute("data-highlighted", ""); el.scrollIntoView({ block: "nearest" }); } } function moveSelection(box, delta) { var results = Array.prototype.slice.call(box.querySelectorAll(".nx-ss-result")); if (!results.length) return; activeIndex = (activeIndex + delta + results.length) % results.length; highlight(box, results[activeIndex]); } function wire(box, seg, label) { var input = box.querySelector(".nx-ss-input"); var panel = box.querySelector(".nx-ss-results"); input.addEventListener("input", function () { if (debounceTimer) clearTimeout(debounceTimer); var term = input.value; debounceTimer = setTimeout(function () { doSearch(box, seg, label, term); }, DEBOUNCE_MS); }); input.addEventListener("focus", function () { loadShard(seg); }); // prefetch the index input.addEventListener("keydown", function (e) { if (e.key === "ArrowDown") { e.preventDefault(); moveSelection(box, 1); } else if (e.key === "ArrowUp") { e.preventDefault(); moveSelection(box, -1); } else if (e.key === "Enter") { var sel = box.querySelector('.nx-ss-result[data-highlighted]') || box.querySelector(".nx-ss-result"); if (sel) { e.preventDefault(); window.location.href = sel.getAttribute("href"); } } else if (e.key === "Escape") { setResults(box, null); input.blur(); } }); // Mouse hover highlights the row using the same data-highlighted hook as keyboard nav. panel.addEventListener("mouseover", function (e) { var it = e.target.closest && e.target.closest(".nx-ss-result"); if (it) highlight(box, it); }); } // ---- mount / sync ---------------------------------------------------------- function sync() { loadConfig().then(function (cfg) { var area = document.querySelector(SEL.contentArea); if (!area) return; // article region not ready; a later mutation retriggers sync var box = getBox(); var scope = scopeForPath(cfg); if (!scope) { // hub/home or non-category page → no box here if (box) box.remove(); current = null; return; } if (box && current && current.key === scope.key && area.contains(box)) return; if (box) box.remove(); var fresh = buildBox(scope.placeholder, scope.pill); // Anchor at the top of the prose column (#content) so the box sits under the page // title and fills the same width as the body paragraphs. var body = area.querySelector(SEL.body) || area; body.insertBefore(fresh, body.firstChild); wire(fresh, scope.searchSeg, scope.pill || ""); // label for the empty-state message current = { key: scope.key }; // Warm the index right after mount (idle), so the first query doesn't wait on the // shard fetch. loadShard caches the in-flight promise, so the focus prefetch and the // first search reuse this — no double fetch, HTTP caching still applies. (Pavel, MR !3.) var warm = function () { loadShard(scope.searchSeg); }; if (window.requestIdleCallback) window.requestIdleCallback(warm, { timeout: 2000 }); else setTimeout(warm, 800); }); } function scheduleSync() { if (syncTimer) clearTimeout(syncTimer); syncTimer = setTimeout(sync, 120); } function start() { sync(); // Close the results dropdown on outside clicks. Attached ONCE here (not per-mount in // wire()) and resolves the current box dynamically, so SPA re-mounts never accumulate // document listeners (which would also pin detached boxes). Element-scoped listeners on // the box's input are released with the box when it is replaced. document.addEventListener("click", function (e) { var b = getBox(); if (b && !b.contains(e.target)) setResults(b, null); }); try { new MutationObserver(scheduleSync).observe(document.documentElement, { attributes: true, attributeFilter: ["data-current-path"] }); new MutationObserver(scheduleSync).observe(document.body, { childList: true, subtree: true }); } catch (e) { /* fail soft */ } } if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", start); else start(); })();

​See Also

See Also