@clarify-labs/renderer 0.6.6 → 0.7.0

package/output/{shell-DvTfFx6M.js → shell-CumiARRe.js}

@@ -3,7 +3,7 @@ import { Fragment, Suspense, createContext, forwardRef, useContext, useEffect, u
 import { Link, useLocation, useNavigate } from "react-router-dom";
 import { CloseButton, Dialog, DialogBackdrop, DialogPanel, Menu, MenuButton, MenuItem, MenuItems, TransitionChild } from "@headlessui/react";
 import * as LucideIcons from "lucide-react";
-import { Check, ChevronDown, Copy, ExternalLink, FileText, Globe2, Link2, Menu as Menu$1, Moon, MoreHorizontal, PencilLine, Search, SearchX, Sun, X } from "lucide-react";
+import { Check, ChevronDown, Copy, ExternalLink, FileText, Globe2, Link2, LoaderCircle, Menu as Menu$1, Moon, MoreHorizontal, PencilLine, Search, SearchX, Sun, X } from "lucide-react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { AnimatePresence, motion, useIsPresent, useScroll, useTransform } from "framer-motion";
 import { create, createStore, useStore } from "zustand";
@@ -16,6 +16,9 @@ function useClarifyConfig() {
 	if (!config) throw new Error("[clarify] useClarifyConfig must be used within a ClarifyConfigContext.Provider");
 	return config;
 }
+function useClarifyLocale() {
+	return useContext(ClarifyLocaleContext);
+}
 function useOpenApis() {
 	return useContext(OpenApisContext);
 }
@@ -328,10 +331,10 @@ function ContentActions(arg0) {
 	const primaryAction = actions[0];
 	const PrimaryIcon = primaryAction && copied === primaryAction.key ? Check : primaryAction?.icon ?? PencilLine;
 	return /* @__PURE__ */ jsx("div", {
-		className: `clarify-content-actions sticky z-20 flex justify-end py-4 ${hasTabs ? "top-16 lg:top-30" : "top-16"}`,
+		className: `clarify-content-actions pointer-events-none sticky z-20 flex justify-end py-4 ${hasTabs ? "top-16 lg:top-30" : "top-16"}`,
 		children: /* @__PURE__ */ jsxs(Menu, {
 			as: "div",
-			className: "clarify-content-actions-menu relative inline-flex text-sm font-medium",
+			className: "clarify-content-actions-menu pointer-events-auto relative inline-flex text-sm font-medium",
 			children: [/* @__PURE__ */ jsxs("div", {
 				className: "clarify-content-actions-group inline-flex overflow-hidden rounded-full border border-(--clarify-theme-tokens-colors-border) bg-(--clarify-theme-tokens-colors-surface)/90 shadow-sm shadow-zinc-900/5 backdrop-blur",
 				children: [primaryAction ? /* @__PURE__ */ jsxs("button", {
@@ -480,9 +483,178 @@ function ContentActions(arg0) {
 	});
 }
 //#endregion
+//#region source/theme/variables.ts
+var themeStorageKey = "clarify:theme";
+var clarifyThemePresets = {
+	default: {
+		preset: "default",
+		tokens: {
+			colors: {
+				primary: "#047857",
+				accent: "#0D9488",
+				background: "#ffffff",
+				foreground: "#111827",
+				surface: "#ffffff",
+				muted: "#64748b",
+				border: "rgb(15 23 42 / 0.12)",
+				codeBackground: "#f6fbf8"
+			},
+			radius: {
+				sm: "6px",
+				md: "10px",
+				lg: "14px",
+				xl: "18px"
+			}
+		},
+		layout: { maxWidth: "82rem" },
+		editor: false
+	},
+	base: {
+		preset: "base",
+		tokens: {
+			colors: {
+				primary: "#18181b",
+				accent: "#52525b",
+				background: "#ffffff",
+				foreground: "#18181b",
+				surface: "#ffffff",
+				muted: "#71717a",
+				border: "rgb(24 24 27 / 0.12)",
+				codeBackground: "#f4f4f5"
+			},
+			radius: {
+				sm: "6px",
+				md: "8px",
+				lg: "12px",
+				xl: "16px"
+			}
+		},
+		layout: { maxWidth: "80rem" },
+		editor: false
+	}
+};
+function cloneThemeColorValue(value) {
+	return typeof value === "string" ? value : { ...value };
+}
+function cloneTheme(theme) {
+	return {
+		preset: theme.preset,
+		tokens: {
+			colors: {
+				primary: cloneThemeColorValue(theme.tokens.colors.primary),
+				accent: cloneThemeColorValue(theme.tokens.colors.accent),
+				background: cloneThemeColorValue(theme.tokens.colors.background),
+				foreground: cloneThemeColorValue(theme.tokens.colors.foreground),
+				surface: cloneThemeColorValue(theme.tokens.colors.surface),
+				muted: cloneThemeColorValue(theme.tokens.colors.muted),
+				border: cloneThemeColorValue(theme.tokens.colors.border),
+				codeBackground: cloneThemeColorValue(theme.tokens.colors.codeBackground)
+			},
+			radius: { ...theme.tokens.radius }
+		},
+		layout: { ...theme.layout },
+		editor: theme.editor
+	};
+}
+function isModeColorValue(value) {
+	return typeof value === "object" && value !== null;
+}
+function resolveThemeColorValue(value, resolvedTheme = "light") {
+	if (!isModeColorValue(value)) return value;
+	return value[resolvedTheme] ?? value.light ?? value.dark ?? "";
+}
+function resolveThemeColors(colors, resolvedTheme = "light") {
+	return {
+		primary: resolveThemeColorValue(colors.primary, resolvedTheme),
+		accent: resolveThemeColorValue(colors.accent, resolvedTheme),
+		background: resolveThemeColorValue(colors.background, resolvedTheme),
+		foreground: resolveThemeColorValue(colors.foreground, resolvedTheme),
+		surface: resolveThemeColorValue(colors.surface, resolvedTheme),
+		muted: resolveThemeColorValue(colors.muted, resolvedTheme),
+		border: resolveThemeColorValue(colors.border, resolvedTheme),
+		codeBackground: resolveThemeColorValue(colors.codeBackground, resolvedTheme)
+	};
+}
+function matchesPresetTheme(theme) {
+	const preset = clarifyThemePresets[theme.preset];
+	return JSON.stringify({
+		tokens: theme.tokens,
+		layout: theme.layout
+	}) === JSON.stringify({
+		tokens: preset.tokens,
+		layout: preset.layout
+	});
+}
+function effectiveTheme(theme, resolvedTheme) {
+	if (resolvedTheme !== "dark" || !matchesPresetTheme(theme)) return theme;
+	return {
+		...theme,
+		tokens: {
+			...theme.tokens,
+			colors: {
+				...theme.tokens.colors,
+				background: "#09090b",
+				foreground: "#ffffff",
+				surface: "#18181b",
+				muted: "#a1a1aa",
+				border: "rgb(255 255 255 / 0.1)",
+				codeBackground: "#18181b"
+			}
+		}
+	};
+}
+function themeToCssVariables(theme, resolvedTheme) {
+	const resolved = effectiveTheme(theme, resolvedTheme);
+	const colors = resolveThemeColors(resolved.tokens.colors, resolvedTheme);
+	const { radius } = resolved.tokens;
+	return {
+		"--clarify-theme-tokens-colors-primary": colors.primary,
+		"--clarify-theme-tokens-colors-accent": colors.accent,
+		"--clarify-theme-tokens-colors-background": colors.background,
+		"--clarify-theme-tokens-colors-foreground": colors.foreground,
+		"--clarify-theme-tokens-colors-surface": colors.surface,
+		"--clarify-theme-tokens-colors-muted": colors.muted,
+		"--clarify-theme-tokens-colors-border": colors.border,
+		"--clarify-theme-tokens-colors-code-background": colors.codeBackground,
+		"--clarify-theme-tokens-radius-sm": radius.sm,
+		"--clarify-theme-tokens-radius-md": radius.md,
+		"--clarify-theme-tokens-radius-lg": radius.lg,
+		"--clarify-theme-tokens-radius-xl": radius.xl,
+		"--clarify-theme-layout-max-width": resolved.layout.maxWidth
+	};
+}
+function themeBootstrapScript(theme = clarifyThemePresets.default) {
+	const darkVariables = themeToCssVariables(theme, "dark");
+	const lightVariables = themeToCssVariables(theme, "light");
+	return `(function(){try{var e=localStorage.getItem(${JSON.stringify(themeStorageKey)});var t=e==='dark'||e==='light'||e==='system'?e:'system';var r=t==='system'?window.matchMedia('(prefers-color-scheme: dark)').matches:t==='dark';var v=r?${JSON.stringify(darkVariables)}:${JSON.stringify(lightVariables)};var s=document.documentElement.style;for(var k in v)s.setProperty(k,v[k]);document.documentElement.classList.toggle('dark',r);document.documentElement.style.colorScheme=r?'dark':'light'}catch(e){}})();`;
+}
+function uniqueElements(elements) {
+	return Array.from(new Set(elements));
+}
+function resolveThemeVariableTargets(target) {
+	if (typeof document === "undefined") return [];
+	if (target instanceof HTMLElement) return [target];
+	if (typeof target === "string") return Array.from(document.querySelectorAll(target));
+	return uniqueElements([document.documentElement, ...Array.from(document.querySelectorAll(".clarify-app"))]);
+}
+function applyThemeCssVariables(variables, targets) {
+	const previousValues = /* @__PURE__ */ new Map();
+	for (const element of targets) {
+		const elementPreviousValues = /* @__PURE__ */ new Map();
+		for (const [property, value] of Object.entries(variables)) {
+			elementPreviousValues.set(property, element.style.getPropertyValue(property));
+			element.style.setProperty(property, value);
+		}
+		previousValues.set(element, elementPreviousValues);
+	}
+	return () => {
+		for (const [element, elementPreviousValues] of previousValues) for (const [property, previousValue] of elementPreviousValues) if (previousValue) element.style.setProperty(property, previousValue);
+		else element.style.removeProperty(property);
+	};
+}
+//#endregion
 //#region source/theme/ThemeProvider.tsx
 var ThemeContext = createContext(null);
-var storageKey = "clarify:theme";
 function getSystemTheme() {
 	if (typeof window === "undefined") return "light";
 	return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
@@ -490,7 +662,7 @@ function getSystemTheme() {
 function getStoredTheme() {
 	if (typeof window === "undefined") return "system";
 	try {
-		const storedTheme = window.localStorage.getItem(storageKey);
+		const storedTheme = window.localStorage.getItem(themeStorageKey);
 		return storedTheme === "light" || storedTheme === "dark" || storedTheme === "system" ? storedTheme : "system";
 	} catch {
 		return "system";
@@ -499,7 +671,7 @@ function getStoredTheme() {
 function storeTheme(theme) {
 	if (typeof window === "undefined") return;
 	try {
-		window.localStorage.setItem(storageKey, theme);
+		window.localStorage.setItem(themeStorageKey, theme);
 	} catch {}
 }
 function applyTheme(resolvedTheme) {
@@ -844,7 +1016,7 @@ function NavigationGroup(arg0) {
 	const [pathname, sections] = useInitialValue([normalizeRoutePath(useLocation().pathname), useSectionStore((s) => s.sections)], isInsideMobileNavigation);
 	const isActiveGroup = group.links.findIndex((link) => isSameRoutePath(link.href, pathname)) !== -1;
 	return /* @__PURE__ */ jsxs("li", {
-		className: clsx("clarify-navigation-group relative mt-6", className),
+		className: clsx("clarify-navigation-group relative mb-6", className),
 		children: [/* @__PURE__ */ jsxs("h2", {
 			className: "clarify-navigation-group-title flex items-center gap-2",
 			children: [/* @__PURE__ */ jsx(NavigationIcon, {
@@ -1043,7 +1215,7 @@ function MobileNavigation(arg0) {
 	});
 }
 //#endregion
-//#region source/shell/Search.tsx
+//#region source/shell/search/items.ts
 function routeGroupTitles(navigation) {
 	const titles = /* @__PURE__ */ new Map();
 	for (const node of navigation) if (node.children?.length) for (const child of node.children) titles.set(child.path, node.title);
@@ -1080,53 +1252,85 @@ function buildSearchItems(routes, navigation) {
 		})) ?? []];
 	});
 }
-function escapeRegExp(value) {
-	return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-}
-function HighlightQuery(arg0) {
-	const { text, query } = arg0;
-	if (!query) return text;
-	return /* @__PURE__ */ jsx(Fragment$1, { children: text.split(new RegExp(`(${escapeRegExp(query)})`, "ig")).map((part, index) => part.toLowerCase() === query.toLowerCase() ? /* @__PURE__ */ jsx("mark", {
-		className: "bg-transparent text-(--clarify-theme-tokens-colors-primary) underline",
-		children: part
-	}, index) : /* @__PURE__ */ jsx(Fragment, { children: part }, index)) });
+//#endregion
+//#region source/shell/search/pagefind.ts
+var pagefindPromises = /* @__PURE__ */ new Map();
+function pagefindCacheKey(routePrefix, locale) {
+	return `${routePrefix || "/"}:${locale || "default"}`;
 }
-function SearchResult(arg0) {
-	const { result, query, active, onSelect } = arg0;
-	const id = useId();
-	const hierarchy = [result.sectionTitle, result.pageTitle].filter((value) => typeof value === "string");
-	return /* @__PURE__ */ jsxs("li", {
-		id,
-		className: clsx("clarify-search-result group block cursor-default px-4 py-3", active && "clarify-search-result-active"),
-		"aria-selected": active,
-		onMouseDown: (event) => {
-			event.preventDefault();
-			onSelect();
-		},
-		children: [/* @__PURE__ */ jsx("div", {
-			className: "clarify-search-result-title",
-			children: /* @__PURE__ */ jsx(HighlightQuery, {
-				text: result.title,
-				query
-			})
-		}), hierarchy.length > 0 ? /* @__PURE__ */ jsx("div", {
-			className: "clarify-search-result-hierarchy mt-1 truncate whitespace-nowrap",
-			children: hierarchy.map((item, itemIndex, items) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(HighlightQuery, {
-				text: item,
-				query
-			}), /* @__PURE__ */ jsx("span", {
-				className: itemIndex === items.length - 1 ? "sr-only" : "clarify-search-result-separator mx-2",
-				children: "/"
-			})] }, `${item}-${itemIndex}`))
-		}) : null]
+function logSearchDebug(message, data) {
+	if (typeof window === "undefined") return;
+	console.info(`[clarify:search] ${message}`, data ?? "");
+}
+function loadPagefind(routePrefix, locale) {
+	if (typeof window === "undefined") return Promise.resolve(null);
+	const language = locale ?? document.documentElement.lang;
+	const cacheKey = pagefindCacheKey(routePrefix, language);
+	const cachedPagefind = pagefindPromises.get(cacheKey);
+	if (cachedPagefind) {
+		logSearchDebug("reuse Pagefind instance promise", {
+			cacheKey,
+			language,
+			routePrefix
+		});
+		return cachedPagefind;
+	}
+	const pagefindUrl = prefixHref("/pagefind/pagefind.js", routePrefix);
+	logSearchDebug("create Pagefind instance promise", {
+		cacheKey,
+		language,
+		pagefindUrl,
+		routePrefix
+	});
+	const pagefindPromise = import(
+		/* @vite-ignore */
+		pagefindUrl
+).then(async (module) => {
+		const previousLanguage = document.documentElement.lang;
+		if (language) document.documentElement.lang = language;
+		logSearchDebug("create Pagefind instance", {
+			cacheKey,
+			detectedLanguage: document.documentElement.lang,
+			previousLanguage
+		});
+		const pagefind = module.createInstance();
+		if (previousLanguage && previousLanguage !== language) document.documentElement.lang = previousLanguage;
+		await pagefind.init?.();
+		logSearchDebug("Pagefind instance ready", {
+			cacheKey,
+			language
+		});
+		return pagefind;
+	}).catch((error) => {
+		pagefindPromises.delete(cacheKey);
+		console.warn("[clarify:search] Pagefind instance failed", {
+			cacheKey,
+			language,
+			error
+		});
+		return null;
 	});
+	pagefindPromises.set(cacheKey, pagefindPromise);
+	return pagefindPromise;
+}
+function normalizePagefindUrl(url, routePrefix) {
+	const parsedUrl = new URL(url, window.location.origin);
+	let pathname = parsedUrl.pathname;
+	const prefix = routePrefix && routePrefix !== "/" ? `/${routePrefix.replace(/^\/+|\/+$/g, "")}` : "";
+	if (prefix && (pathname === prefix || pathname.startsWith(`${prefix}/`))) pathname = pathname.slice(prefix.length) || "/";
+	return `${pathname}${parsedUrl.search}${parsedUrl.hash}`;
 }
+//#endregion
+//#region source/shell/search/SearchInput.tsx
 var SearchInput = forwardRef(function SearchInput(arg0, inputRef) {
-	const { query, setQuery, onClose, onSubmit, activeDescendantId } = arg0;
+	const { query, setQuery, onClose, onSubmit, activeDescendantId, loading = false } = arg0;
 	const t = useBuiltInText();
 	return /* @__PURE__ */ jsxs("div", {
 		className: "clarify-search-input group relative flex h-12",
-		children: [/* @__PURE__ */ jsx(Search, { className: "pointer-events-none absolute top-0 left-3 h-full w-5 stroke-(--clarify-theme-tokens-colors-muted)" }), /* @__PURE__ */ jsx("input", {
+		children: [/* @__PURE__ */ jsx(loading ? LoaderCircle : Search, {
+			"aria-hidden": "true",
+			className: clsx("pointer-events-none absolute top-0 left-3 h-full w-5 stroke-(--clarify-theme-tokens-colors-muted)", loading && "animate-spin")
+		}), /* @__PURE__ */ jsx("input", {
 			ref: inputRef,
 			"data-autofocus": true,
 			role: "combobox",
@@ -1148,20 +1352,120 @@ var SearchInput = forwardRef(function SearchInput(arg0, inputRef) {
 		})]
 	});
 });
+//#endregion
+//#region source/shell/search/Highlight.tsx
+function stripHtml(value) {
+	if (typeof document === "undefined") return value.replace(/<[^>]*>/g, "");
+	const template = document.createElement("template");
+	template.innerHTML = value;
+	return template.content.textContent ?? "";
+}
+function escapeRegExp(value) {
+	return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function HighlightQuery(arg0) {
+	const { text, query } = arg0;
+	if (!query) return text;
+	return /* @__PURE__ */ jsx(Fragment$1, { children: text.split(new RegExp(`(${escapeRegExp(query)})`, "ig")).map((part, index) => part.toLowerCase() === query.toLowerCase() ? /* @__PURE__ */ jsx("mark", {
+		className: "bg-transparent text-(--clarify-theme-tokens-colors-primary) underline",
+		children: part
+	}, index) : /* @__PURE__ */ jsx(Fragment, { children: part }, index)) });
+}
+function renderExcerptNode(node, key) {
+	if (node.nodeType === Node.TEXT_NODE) return node.textContent;
+	if (node.nodeType !== Node.ELEMENT_NODE) return null;
+	const element = node;
+	const children = Array.from(element.childNodes).map((child, index) => renderExcerptNode(child, `${key}-${index}`));
+	if (element.tagName.toLowerCase() === "mark") return /* @__PURE__ */ jsx("mark", {
+		className: "bg-transparent text-(--clarify-theme-tokens-colors-primary) underline",
+		children
+	}, key);
+	return /* @__PURE__ */ jsx(Fragment, { children }, key);
+}
+function HighlightExcerpt(arg0) {
+	const { excerpt, query } = arg0;
+	if (typeof document === "undefined" || !excerpt.includes("<mark")) return /* @__PURE__ */ jsx(HighlightQuery, {
+		text: stripHtml(excerpt),
+		query
+	});
+	const template = document.createElement("template");
+	template.innerHTML = excerpt;
+	return /* @__PURE__ */ jsx(Fragment$1, { children: Array.from(template.content.childNodes).map((node, index) => renderExcerptNode(node, String(index))) });
+}
+//#endregion
+//#region source/shell/search/SearchResult.tsx
+function SearchResult(arg0) {
+	const { result, query, active, onActive, onSelect } = arg0;
+	const id = useId();
+	const hierarchy = result.type === "quick" ? [result.sectionTitle, result.pageTitle].filter((value) => typeof value === "string") : [];
+	return /* @__PURE__ */ jsxs("li", {
+		id,
+		className: clsx("clarify-search-result group block cursor-pointer px-4 py-3", active && "clarify-search-result-active"),
+		"aria-selected": active,
+		onMouseEnter: onActive,
+		onMouseMove: onActive,
+		onMouseDown: (event) => {
+			event.preventDefault();
+			onSelect();
+		},
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "clarify-search-result-title",
+				children: /* @__PURE__ */ jsx(HighlightQuery, {
+					text: result.title,
+					query
+				})
+			}),
+			hierarchy.length > 0 ? /* @__PURE__ */ jsx("div", {
+				className: "clarify-search-result-hierarchy mt-1 truncate whitespace-nowrap",
+				children: hierarchy.map((item, itemIndex, items) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(HighlightQuery, {
+					text: item,
+					query
+				}), /* @__PURE__ */ jsx("span", {
+					className: itemIndex === items.length - 1 ? "sr-only" : "clarify-search-result-separator mx-2",
+					children: "/"
+				})] }, `${item}-${itemIndex}`))
+			}) : null,
+			result.type === "full-text" && result.excerpt ? /* @__PURE__ */ jsx("p", {
+				className: "clarify-search-result-excerpt mt-1 line-clamp-2 text-xs leading-5 text-(--clarify-theme-tokens-colors-muted)",
+				children: /* @__PURE__ */ jsx(HighlightExcerpt, {
+					excerpt: result.excerpt,
+					query
+				})
+			}) : null
+		]
+	});
+}
+//#endregion
+//#region source/shell/search/SearchDialog.tsx
 function SearchDialog(arg0) {
-	const { open, setOpen, routes, navigation, className, onNavigate = () => {} } = arg0;
+	const { open, setOpen, routes, navigation, routePrefix = "/", currentLocale, className, onNavigate = () => {} } = arg0;
 	const t = useBuiltInText();
 	const navigate = useNavigate();
 	const location = useLocation();
 	const inputRef = useRef(null);
 	const [query, setQuery] = useState("");
 	const [activeIndex, setActiveIndex] = useState(0);
+	const [fullTextState, setFullTextState] = useState(null);
+	const [pagefindState, setPagefindState] = useState(null);
 	const searchItems = useMemo(() => buildSearchItems(routes, navigation), [navigation, routes]);
-	const results = useMemo(() => {
+	const quickResults = useMemo(() => {
 		const normalizedQuery = query.trim().toLowerCase();
 		if (!normalizedQuery) return [];
-		return searchItems.filter((item) => item.keywords.includes(normalizedQuery)).slice(0, 8);
+		return searchItems.filter((item) => item.keywords.includes(normalizedQuery)).slice(0, 8).map((item) => ({
+			...item,
+			type: "quick"
+		}));
 	}, [query, searchItems]);
+	const pagefindKey = pagefindCacheKey(routePrefix, currentLocale);
+	const activePagefindState = pagefindState?.key === pagefindKey ? pagefindState : null;
+	const pagefind = activePagefindState?.pagefind ?? null;
+	const pagefindAvailable = activePagefindState?.available ?? null;
+	const trimmedQuery = query.trim();
+	const fullTextKey = `${pagefindKey}:${trimmedQuery}`;
+	const results = (fullTextState?.key === fullTextKey ? fullTextState.results : null) ?? quickResults;
+	const searchInputLoading = pagefindAvailable === null || Boolean(trimmedQuery && pagefind && fullTextState?.key !== fullTextKey);
+	const showNoResults = query && results.length === 0 && pagefindAvailable !== null;
 	useEffect(() => {
 		setOpen(false);
 	}, [
@@ -1170,6 +1474,98 @@ function SearchDialog(arg0) {
 		location.hash,
 		setOpen
 	]);
+	useEffect(() => {
+		let cancelled = false;
+		logSearchDebug("locale or route prefix changed; reload Pagefind", {
+			currentLocale,
+			routePrefix,
+			documentLanguage: document.documentElement.lang
+		});
+		loadPagefind(routePrefix, currentLocale).then((loadedPagefind) => {
+			if (cancelled) {
+				logSearchDebug("ignore stale Pagefind load", {
+					currentLocale,
+					routePrefix
+				});
+				return;
+			}
+			logSearchDebug("Pagefind load applied", {
+				currentLocale,
+				routePrefix,
+				available: Boolean(loadedPagefind)
+			});
+			setPagefindState({
+				key: pagefindKey,
+				pagefind: loadedPagefind,
+				available: Boolean(loadedPagefind)
+			});
+		});
+		return () => {
+			cancelled = true;
+			logSearchDebug("cancel Pagefind load effect", {
+				currentLocale,
+				routePrefix
+			});
+		};
+	}, [
+		currentLocale,
+		pagefindKey,
+		routePrefix
+	]);
+	useEffect(() => {
+		let cancelled = false;
+		if (!trimmedQuery || !pagefind) return void 0;
+		Promise.resolve().then(async () => {
+			if (cancelled) return;
+			try {
+				logSearchDebug("run Pagefind search", {
+					currentLocale,
+					query: trimmedQuery,
+					routePrefix
+				});
+				const search = await pagefind.search(trimmedQuery, { limit: 8 });
+				const data = await Promise.all(search.results.map(async (result) => ({
+					id: result.id,
+					data: await result.data()
+				})));
+				if (cancelled) return;
+				logSearchDebug("Pagefind search results", {
+					currentLocale,
+					query: trimmedQuery,
+					count: data.length
+				});
+				setFullTextState({
+					key: fullTextKey,
+					results: data.map(({ id, data }) => ({
+						type: "full-text",
+						id,
+						title: data.meta.title || data.url,
+						url: normalizePagefindUrl(data.url, routePrefix),
+						excerpt: data.excerpt
+					}))
+				});
+			} catch (error) {
+				console.warn("[clarify:search] Pagefind search failed", {
+					currentLocale,
+					query: trimmedQuery,
+					error
+				});
+				if (!cancelled) setFullTextState({
+					key: fullTextKey,
+					results: null
+				});
+			}
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, [
+		currentLocale,
+		fullTextKey,
+		pagefind,
+		routePrefix,
+		trimmedQuery
+	]);
 	useEffect(() => {
 		if (open) return void 0;
 		function onKeyDown(event) {
@@ -1222,10 +1618,11 @@ function SearchDialog(arg0) {
 					query,
 					setQuery: updateQuery,
 					onClose: closeDialog,
-					onSubmit: () => selectResult()
+					onSubmit: () => selectResult(),
+					loading: searchInputLoading
 				}), /* @__PURE__ */ jsxs("div", {
 					className: "border-t border-(--clarify-theme-tokens-colors-border) bg-(--clarify-theme-tokens-colors-background) empty:hidden dark:border-zinc-100/5 dark:bg-white/2.5",
-					children: [query && results.length === 0 ? /* @__PURE__ */ jsxs("div", {
+					children: [showNoResults ? /* @__PURE__ */ jsxs("div", {
 						className: "p-6 text-center",
 						children: [/* @__PURE__ */ jsx(SearchX, { className: "mx-auto h-5 w-5 stroke-(--clarify-theme-tokens-colors-foreground) dark:stroke-zinc-600" }), /* @__PURE__ */ jsx("p", {
 							className: "mt-2 text-xs text-(--clarify-theme-tokens-colors-muted) dark:text-zinc-400",
@@ -1239,14 +1636,17 @@ function SearchDialog(arg0) {
 							result,
 							query,
 							active: resultIndex === activeIndex,
+							onActive: () => setActiveIndex(resultIndex),
 							onSelect: () => selectResult(result)
-						}, result.url))
+						}, result.type === "full-text" ? result.id : result.url))
 					}) : null]
 				})]
 			})
 		})]
 	});
 }
+//#endregion
+//#region source/shell/search/useSearchProps.ts
 function useSearchProps() {
 	const buttonRef = useRef(null);
 	const [open, setOpen] = useState(false);
@@ -1263,12 +1663,14 @@ function useSearchProps() {
 		}
 	};
 }
+//#endregion
+//#region source/shell/Search.tsx
 function getModifierKey() {
 	if (typeof navigator === "undefined") return "Ctrl ";
 	return /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform) ? "⌘" : "Ctrl ";
 }
 function Search$1(arg0) {
-	const { routes, navigation } = arg0;
+	const { routes, navigation, routePrefix, currentLocale } = arg0;
 	const t = useBuiltInText();
 	const modifierKey = getModifierKey();
 	const { buttonProps, dialogProps } = useSearchProps();
@@ -1298,13 +1700,15 @@ function Search$1(arg0) {
 				className: "hidden lg:block",
 				routes,
 				navigation,
+				routePrefix,
+				currentLocale,
 				...dialogProps
 			})
 		})]
 	});
 }
 function MobileSearch(arg0) {
-	const { routes, navigation, onNavigate } = arg0;
+	const { routes, navigation, routePrefix, currentLocale, onNavigate } = arg0;
 	const t = useBuiltInText();
 	const { buttonProps, dialogProps } = useSearchProps();
 	return /* @__PURE__ */ jsxs("div", {
@@ -1321,6 +1725,8 @@ function MobileSearch(arg0) {
 				className: "lg:hidden",
 				routes,
 				navigation,
+				routePrefix,
+				currentLocale,
 				onNavigate,
 				...dialogProps
 			})
@@ -1518,6 +1924,7 @@ var Header = forwardRef(function Header(arg0, ref) {
 	return /* @__PURE__ */ jsxs(motion.header, {
 		...props,
 		ref,
+		"data-pagefind-ignore": true,
 		className: clsx(className, "clarify-header fixed inset-x-0 top-0 z-50 border-b border-(--clarify-theme-tokens-colors-border) bg-(--clarify-theme-tokens-colors-background)/(--bg-opacity-light) backdrop-blur-xs transition dark:border-white/10 dark:bg-zinc-950/(--bg-opacity-dark) dark:backdrop-blur-sm", isInsideMobileNavigation && "bg-(--clarify-theme-tokens-colors-background) dark:bg-zinc-950"),
 		style: {
 			"--bg-opacity-light": bgOpacityLight,
@@ -1545,7 +1952,7 @@ var Header = forwardRef(function Header(arg0, ref) {
 						className: "clarify-brand flex min-w-0 items-center gap-2 no-underline",
 						children: [/* @__PURE__ */ jsx(SiteLogo, {
 							logo: config.logo,
-							className: "h-6 w-6 shrink-0"
+							className: "h-6 w-auto shrink-0 object-contain"
 						}), /* @__PURE__ */ jsx("span", {
 							className: "clarify-brand-title truncate font-semibold",
 							children: config.title
@@ -1556,7 +1963,9 @@ var Header = forwardRef(function Header(arg0, ref) {
 					className: "clarify-header-center absolute left-1/2 hidden -translate-x-1/2 lg:block",
 					children: /* @__PURE__ */ jsx(Search$1, {
 						routes,
-						navigation
+						navigation,
+						routePrefix: config.routePrefix,
+						currentLocale
 					})
 				}),
 				/* @__PURE__ */ jsxs("div", {
@@ -1576,7 +1985,9 @@ var Header = forwardRef(function Header(arg0, ref) {
 						config.navbar?.links?.length ? /* @__PURE__ */ jsx("div", { className: "hidden md:block md:h-5 md:w-px md:bg-(--clarify-theme-tokens-colors-border) md:dark:bg-white/15" }) : null,
 						/* @__PURE__ */ jsx(MobileSearch, {
 							routes,
-							navigation
+							navigation,
+							routePrefix: config.routePrefix,
+							currentLocale
 						}),
 						/* @__PURE__ */ jsx(LanguageSwitcher, {
 							config,
@@ -1596,6 +2007,6 @@ var Header = forwardRef(function Header(arg0, ref) {
 	});
 });
 //#endregion
-export { useClarifyConfig as C, OpenApisContext as S, prefixHref as _, useSectionStore as a, ClarifyConfigContext as b, resolveLucideIconName as c, ThemeToggle as d, ThemeProvider as f, localizeHref as g, isExternalHref as h, SectionProvider as i, isSameRoutePath as l, ContentActions as m, Navigation as n, remToPx as o, useTheme as p, safeDecodeURIComponent as r, lucideIconRegistry as s, Header as t, normalizeRoutePath as u, copyTextToClipboard as v, useOpenApis as w, ClarifyLocaleContext as x, useBuiltInText as y };
+export { OpenApisContext as A, isExternalHref as C, useBuiltInText as D, copyTextToClipboard as E, useClarifyLocale as M, useOpenApis as N, ClarifyConfigContext as O, ContentActions as S, prefixHref as T, resolveThemeColorValue as _, useSectionStore as a, themeStorageKey as b, resolveLucideIconName as c, ThemeToggle as d, ThemeProvider as f, cloneTheme as g, clarifyThemePresets as h, SectionProvider as i, useClarifyConfig as j, ClarifyLocaleContext as k, isSameRoutePath as l, applyThemeCssVariables as m, Navigation as n, remToPx as o, useTheme as p, safeDecodeURIComponent as r, lucideIconRegistry as s, Header as t, normalizeRoutePath as u, resolveThemeVariableTargets as v, localizeHref as w, themeToCssVariables as x, themeBootstrapScript as y };
 
-//# sourceMappingURL=shell-DvTfFx6M.js.map
+//# sourceMappingURL=shell-CumiARRe.js.map