@openrails/contentkit-ui 0.89.1 → 0.89.2

package/dist/components/content/search.js

@@ -5,160 +5,357 @@ import { ContentKitContext as r } from "../../react/context.js";
 import { Input as i } from "../../ui/input.js";
 import { useRecentSearches as a, useTypeahead as o } from "../../react/discovery.js";
 import { labelOf as s } from "../groups/parts.js";
-import { useContext as c, useId as l, useMemo as u, useState as d } from "react";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { cn as h } from "cn";
-import { Cancel01Icon as g, Clock01Icon as _, Search01Icon as v } from "@hugeicons/core-free-icons";
-import { HugeiconsIcon as y } from "@hugeicons/react";
+import { useContext as c, useEffect as ee, useId as te, useLayoutEffect as l, useMemo as u, useRef as d, useState as f } from "react";
+import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
+import { cn as g } from "cn";
+import { Cancel01Icon as _, Clock01Icon as v, File01Icon as y, Folder01Icon as b, Image01Icon as x, Search01Icon as S, TagsIcon as C, UserIcon as w } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as T } from "@hugeicons/react";
+import { createPortal as E } from "react-dom";
 //#region src/components/content/search.tsx
-function b(b) {
-	let { t: x } = t(), S = l(), C = c(r)?.navigate, [w, T] = d(b.defaultValue ?? ""), [E, D] = d(!1), [O, k] = d(-1), [A, j] = d(!1), M = !w.trim(), N = o(w, {
-		kind: b.kind,
-		group_kinds: b.groupKinds,
-		client: b.client
-	}), P = a({
-		enabled: b.recent !== !1 && A,
-		client: b.client
-	}), F = u(() => M ? P.searches.map((e) => ({
+var D = {
+	artist: {
+		icon: w,
+		color: "text-blue-500 dark:text-blue-400"
+	},
+	series: {
+		icon: b,
+		color: "text-yellow-600 dark:text-yellow-400"
+	},
+	gallery: {
+		icon: x,
+		color: "text-green-600 dark:text-green-400"
+	},
+	post: {
+		icon: y,
+		color: "text-purple-500 dark:text-purple-400"
+	},
+	blog: {
+		icon: y,
+		color: "text-purple-500 dark:text-purple-400"
+	},
+	poll: {
+		icon: y,
+		color: "text-purple-500 dark:text-purple-400"
+	},
+	character: {
+		icon: w,
+		color: "text-purple-500 dark:text-purple-400"
+	},
+	tag: {
+		icon: C,
+		color: "text-orange-500 dark:text-orange-400"
+	}
+};
+function O(e, t, n, r) {
+	let [i, a] = f(0);
+	return l(() => {
+		if (!e || !t || !n.current) return;
+		let i = n.current.closest("header, [role=\"banner\"]") ?? r.current ?? n.current, o = n.current.ownerDocument.defaultView;
+		if (!o) return;
+		let s = () => a(Math.max(0, Math.min(o.innerHeight, i.getBoundingClientRect().bottom)));
+		s();
+		let c = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(s);
+		return c?.observe(i), o.addEventListener("resize", s), o.addEventListener("scroll", s, !0), o.visualViewport?.addEventListener("resize", s), o.visualViewport?.addEventListener("scroll", s), () => {
+			c?.disconnect(), o.removeEventListener("resize", s), o.removeEventListener("scroll", s, !0), o.visualViewport?.removeEventListener("resize", s), o.visualViewport?.removeEventListener("scroll", s);
+		};
+	}, [
+		e,
+		t,
+		n,
+		r
+	]), i;
+}
+function k({ kind: e }) {
+	let t = D[e];
+	return /* @__PURE__ */ m(T, {
+		icon: t?.icon ?? S,
+		strokeWidth: 2,
+		className: g("size-4 shrink-0", t?.color ?? "text-muted-foreground"),
+		"data-search-kind": e,
+		"aria-hidden": !0
+	});
+}
+function A({ value: e, formatter: t }) {
+	return !e || Number.isNaN(Date.parse(e)) ? null : /* @__PURE__ */ m("time", {
+		dateTime: e,
+		className: "shrink-0 text-xs text-muted-foreground",
+		children: t.format(new Date(e))
+	});
+}
+function j(l) {
+	let { t: y, error: b, language: x } = t(), C = te(), w = c(r)?.navigate, [D, j] = f(l.defaultValue ?? ""), [M, N] = f(!1), [P, F] = f(-1), I = d(null), L = d(null), R = d(null), z = l.presentation === "header", B = O(M, z, I, R), V = u(() => new Intl.DateTimeFormat(x, { dateStyle: "short" }), [x]), H = !D.trim(), U = o(D, {
+		kind: l.kind,
+		group_kinds: l.groupKinds,
+		client: l.client
+	}), W = a({
+		enabled: l.recent !== !1 && M && H,
+		client: l.client
+	}), ne = u(() => H ? W.searches.map((e) => ({
 		type: "recent",
-		query: e.query
-	})) : [...N.contents.map((e) => ({
+		query: e.query,
+		searchedAt: e.searched_at
+	})) : [...U.contents.map((e) => ({
 		type: "content",
 		card: e
-	})), ...N.groups.map((e) => ({
+	})), ...U.groups.map((e) => ({
 		type: "group",
 		group: e
 	}))], [
-		M,
-		P.searches,
-		N.contents,
-		N.groups
-	]), I = E && F.length > 0 && (M || N.query === w.trim()), L = (e) => {
-		D(!1), e && b.onSearch(e);
-	}, R = (e) => {
-		if (e.type === "recent") return T(e.query), L(e.query);
-		let t = b.href ? b.href(e.type === "content" ? e.card : e.group) : e.type === "content" ? e.card.path : e.group.path;
-		D(!1), t && (C ? C(t) : location.assign(t));
-	};
-	return /* @__PURE__ */ m(n, {
-		appearance: b.appearance,
-		className: h("relative text-sm", b.className),
-		"data-ckui": "search-box",
-		children: [/* @__PURE__ */ m("form", {
-			role: "search",
-			onSubmit: (e) => {
-				if (e.preventDefault(), I && O >= 0) return R(F[O]);
-				L(w.trim());
-			},
-			children: [/* @__PURE__ */ p(y, {
-				icon: v,
-				strokeWidth: 2,
-				className: "pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2 text-muted-foreground",
-				"aria-hidden": !0
-			}), /* @__PURE__ */ p(i, {
-				type: "search",
-				role: "combobox",
-				"aria-label": x("contents.search"),
-				"aria-expanded": I,
-				"aria-controls": `${S}-list`,
-				"aria-activedescendant": I && O >= 0 ? `${S}-${O}` : void 0,
-				"aria-autocomplete": "list",
-				autoComplete: "off",
-				className: "h-9 ps-8",
-				value: w,
-				placeholder: b.placeholder ?? x("contents.searchPlaceholder"),
-				onChange: (e) => {
-					T(e.target.value), D(!0), k(-1);
-				},
-				onFocus: () => {
-					D(!0), j(!0);
+		H,
+		W.searches,
+		U.contents,
+		U.groups
+	]), G = H || U.query === D.trim(), K = G ? ne : [], q = K[P], re = H ? W.loading : !G || U.loading, J = H && l.recent !== !1, ie = H ? !z && J && !W.error ? "contents.noRecentSearches" : "contents.searchHint" : "contents.noResults";
+	ee(() => {
+		if (!M) return;
+		let e = (e) => {
+			!I.current?.contains(e.target) && !L.current?.contains(e.target) && N(!1);
+		};
+		return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
+	}, [M]);
+	let Y = () => {
+		N(!0);
+	}, X = (e) => {
+		N(!1), e && l.onSearch(e);
+	}, Z = (e) => {
+		if (e.type === "recent") return j(e.query), X(e.query);
+		let t = l.href ? l.href(e.type === "content" ? e.card : e.group) : e.type === "content" ? e.card.path : e.group.path;
+		N(!1), t && (w ? w(t) : location.assign(t));
+	}, Q = (e) => {
+		e.key === "Escape" && (e.preventDefault(), R.current?.focus(), N(!1), F(-1));
+	}, $ = /* @__PURE__ */ h(p, { children: [
+		J && /* @__PURE__ */ h("div", {
+			className: g("flex items-center justify-between gap-2 text-muted-foreground", z ? "mb-4 text-base font-semibold" : "px-2 py-1 text-xs"),
+			children: [/* @__PURE__ */ h("span", {
+				id: `${C}-recent`,
+				className: "flex items-center gap-2",
+				children: [z && /* @__PURE__ */ m(T, {
+					icon: v,
+					strokeWidth: 2,
+					className: "size-5",
+					"aria-hidden": !0
+				}), y("contents.recentSearches")]
+			}), K.length > 0 && /* @__PURE__ */ m("button", {
+				type: "button",
+				className: "rounded px-1 hover:text-foreground",
+				onMouseDown: (e) => {
+					e.preventDefault();
 				},
-				onBlur: () => D(!1),
-				onKeyDown: (e) => {
-					if (e.key === "Escape") return D(!1);
-					I && (e.key === "ArrowDown" ? (e.preventDefault(), k((e) => Math.min(F.length - 1, e + 1))) : e.key === "ArrowUp" && (e.preventDefault(), k((e) => Math.max(-1, e - 1))));
-				}
+				onClick: () => void W.clear(),
+				children: y(z ? "contents.clearAllRecent" : "contents.clearRecent")
 			})]
-		}), I && /* @__PURE__ */ m("div", {
-			className: "absolute top-full z-20 mt-1 grid max-h-96 w-full overflow-auto rounded-md border border-border bg-popover py-1 text-popover-foreground shadow-md",
-			children: [M && /* @__PURE__ */ m("div", {
-				className: "flex items-center justify-between gap-2 px-2 py-1 text-xs text-muted-foreground",
-				children: [/* @__PURE__ */ p("span", {
-					id: `${S}-recent`,
-					children: x("contents.recentSearches")
-				}), /* @__PURE__ */ p("button", {
-					type: "button",
-					className: "rounded px-1 hover:text-foreground",
-					onMouseDown: (e) => {
-						e.preventDefault(), P.clear();
-					},
-					children: x("contents.clearRecent")
-				})]
-			}), /* @__PURE__ */ p("ul", {
-				id: `${S}-list`,
-				role: "listbox",
-				"aria-label": x(M ? "contents.recentSearches" : "contents.suggestions"),
-				className: "grid",
-				children: F.map((t, n) => /* @__PURE__ */ p("li", {
-					id: `${S}-${n}`,
-					role: "option",
-					"aria-selected": n === O,
-					"data-ckui": "suggestion",
-					"data-type": t.type,
-					className: h("flex cursor-pointer items-center gap-2 px-2 py-1.5", n === O && "bg-accent text-accent-foreground"),
-					onMouseEnter: () => k(n),
-					onMouseDown: (e) => {
-						e.preventDefault(), R(t);
-					},
-					children: t.type === "content" ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("span", {
-						className: "h-10 w-8 shrink-0 overflow-hidden rounded bg-muted",
-						children: /* @__PURE__ */ p(e, {
-							outputs: t.card.cover,
-							alt: "",
-							fit: "cover",
-							className: "size-full"
-						})
-					}), /* @__PURE__ */ p("span", {
-						className: "min-w-0 truncate",
-						children: t.card.title || t.card.code
-					})] }) : t.type === "group" ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("span", {
+		}),
+		/* @__PURE__ */ m("ul", {
+			id: `${C}-list`,
+			role: "listbox",
+			"aria-label": y(H ? "contents.recentSearches" : "contents.suggestions"),
+			className: g("grid", z && "gap-2"),
+			children: K.map((t, n) => /* @__PURE__ */ m("li", {
+				id: `${C}-${n}`,
+				role: "option",
+				"aria-selected": n === P,
+				"data-ckui": "suggestion",
+				"data-type": t.type,
+				className: g("flex cursor-pointer items-center", z ? t.type === "recent" ? "gap-2 rounded-md p-3 text-base hover:bg-foreground/10" : "gap-3 rounded-md px-4 py-1 text-base font-medium hover:bg-foreground/10" : "gap-2 px-2 py-1.5", n === P && "bg-accent text-accent-foreground"),
+				onMouseEnter: () => F(n),
+				onMouseDown: (e) => {
+					e.preventDefault(), Z(t);
+				},
+				children: z && t.type !== "recent" ? /* @__PURE__ */ h(p, { children: [
+					/* @__PURE__ */ m(k, { kind: t.type === "content" ? t.card.kind : t.group.kind }),
+					/* @__PURE__ */ m("span", {
+						className: "sr-only",
+						children: s(l.labels, t.type === "content" ? t.card.kind : t.group.kind)
+					}),
+					/* @__PURE__ */ m("span", {
 						className: "min-w-0 flex-1 truncate",
-						children: t.group.name || t.group.slug
-					}), /* @__PURE__ */ p("span", {
-						className: "text-xs text-muted-foreground",
-						children: s(b.labels, t.group.kind)
-					})] }) : /* @__PURE__ */ m(f, { children: [
-						/* @__PURE__ */ p(y, {
+						children: t.type === "content" ? t.card.title || t.card.code : t.group.name || t.group.slug
+					})
+				] }) : t.type === "content" ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("span", {
+					className: "h-10 w-8 shrink-0 overflow-hidden rounded bg-muted",
+					children: /* @__PURE__ */ m(e, {
+						outputs: t.card.cover,
+						alt: "",
+						fit: "cover",
+						className: "size-full"
+					})
+				}), /* @__PURE__ */ m("span", {
+					className: "min-w-0 truncate",
+					children: t.card.title || t.card.code
+				})] }) : t.type === "group" ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("span", {
+					className: "min-w-0 flex-1 truncate",
+					children: t.group.name || t.group.slug
+				}), /* @__PURE__ */ m("span", {
+					className: "text-xs text-muted-foreground",
+					children: s(l.labels, t.group.kind)
+				})] }) : /* @__PURE__ */ h(p, { children: [
+					/* @__PURE__ */ m(T, {
+						icon: z ? S : v,
+						strokeWidth: 2,
+						className: "size-4 shrink-0 text-muted-foreground",
+						"aria-hidden": !0
+					}),
+					/* @__PURE__ */ m("span", {
+						className: "min-w-0 flex-1 truncate",
+						children: t.query
+					}),
+					z && /* @__PURE__ */ m(A, {
+						value: t.searchedAt,
+						formatter: V
+					}),
+					/* @__PURE__ */ m("button", {
+						type: "button",
+						className: "rounded p-0.5 text-muted-foreground hover:text-foreground",
+						"aria-label": y("contents.removeRecent", { q: t.query }),
+						onMouseDown: (e) => {
+							e.preventDefault(), e.stopPropagation();
+						},
+						onClick: () => void W.clear(t.query),
+						children: /* @__PURE__ */ m(T, {
 							icon: _,
 							strokeWidth: 2,
-							className: "size-4 shrink-0 text-muted-foreground",
+							className: "size-3.5",
 							"aria-hidden": !0
-						}),
-						/* @__PURE__ */ p("span", {
-							className: "min-w-0 flex-1 truncate",
-							children: t.query
-						}),
-						/* @__PURE__ */ p("button", {
-							type: "button",
-							className: "rounded p-0.5 text-muted-foreground hover:text-foreground",
-							"aria-label": x("contents.removeRecent", { q: t.query }),
-							onMouseDown: (e) => {
-								e.preventDefault(), e.stopPropagation(), P.clear(t.query);
-							},
-							children: /* @__PURE__ */ p(y, {
-								icon: g,
-								strokeWidth: 2,
-								className: "size-3.5",
-								"aria-hidden": !0
-							})
 						})
-					] })
-				}, t.type === "content" ? `c:${t.card.id}` : t.type === "group" ? `g:${t.group.id}` : `r:${t.query}`))
+					})
+				] })
+			}, t.type === "content" ? `c:${t.card.id}` : t.type === "group" ? `g:${t.group.id}` : `r:${t.query}`))
+		}),
+		re ? /* @__PURE__ */ m("div", {
+			role: "status",
+			className: g("text-muted-foreground", z ? "flex justify-center py-4" : "px-3 py-2"),
+			children: z ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("span", {
+				className: "size-6 animate-spin rounded-full border-2 border-muted border-t-foreground motion-reduce:animate-none",
+				"aria-hidden": !0
+			}), /* @__PURE__ */ m("span", {
+				className: "sr-only",
+				children: y("contents.loading")
+			})] }) : y("contents.loading")
+		}) : !H && U.error ? /* @__PURE__ */ m("p", {
+			role: "alert",
+			className: g("px-3 py-2 text-destructive", z && "text-center"),
+			children: b(U.error)
+		}) : K.length === 0 && /* @__PURE__ */ h("div", {
+			role: "status",
+			className: g("text-muted-foreground", z ? "flex flex-col items-center gap-2 py-8 text-center" : "px-3 py-2"),
+			children: [z && /* @__PURE__ */ m(T, {
+				icon: S,
+				strokeWidth: 2,
+				className: "size-8",
+				"aria-hidden": !0
+			}), /* @__PURE__ */ m("p", { children: y(ie, { q: D.trim() }) })]
+		})
+	] });
+	return /* @__PURE__ */ h(n, {
+		ref: I,
+		appearance: l.appearance,
+		className: g("relative text-sm", l.className),
+		"data-ckui": "search-box",
+		onBlur: (e) => {
+			!e.currentTarget.contains(e.relatedTarget) && !L.current?.contains(e.relatedTarget) && N(!1);
+		},
+		children: [/* @__PURE__ */ h("form", {
+			role: "search",
+			className: "relative",
+			onSubmit: (e) => {
+				if (e.preventDefault(), M && q) return Z(q);
+				X(D.trim());
+			},
+			children: [
+				z ? /* @__PURE__ */ m("button", {
+					type: "submit",
+					className: "absolute top-1/2 left-2.5 -translate-y-1/2 rounded text-muted-foreground hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring",
+					"aria-label": y("contents.search"),
+					children: /* @__PURE__ */ m(T, {
+						icon: S,
+						strokeWidth: 2,
+						className: "size-4",
+						"aria-hidden": !0
+					})
+				}) : /* @__PURE__ */ m(T, {
+					icon: S,
+					strokeWidth: 2,
+					className: "pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2 text-muted-foreground",
+					"aria-hidden": !0
+				}),
+				/* @__PURE__ */ m(i, {
+					ref: R,
+					type: z ? "text" : "search",
+					role: "combobox",
+					"aria-label": y("contents.search"),
+					"aria-expanded": M,
+					"aria-controls": `${C}-list`,
+					"aria-activedescendant": M && q ? `${C}-${P}` : void 0,
+					"aria-autocomplete": "list",
+					autoComplete: "off",
+					className: g("h-9 ps-8", z && "rounded-full border-border/50 bg-foreground/10 pe-9 text-base shadow-none md:text-base"),
+					value: D,
+					placeholder: l.placeholder ?? y("contents.searchPlaceholder"),
+					onChange: (e) => {
+						j(e.target.value), N(!0), F(-1);
+					},
+					onFocus: Y,
+					onClick: Y,
+					onKeyDown: (e) => {
+						if (e.key === "Escape") {
+							e.preventDefault(), N(!1), F(-1);
+							return;
+						}
+						e.key === "ArrowDown" ? (e.preventDefault(), Y(), F((e) => M ? Math.min(K.length - 1, e + 1) : 0)) : e.key === "ArrowUp" && M && (e.preventDefault(), F((e) => Math.max(-1, e - 1)));
+					}
+				}),
+				z && (D || M) && /* @__PURE__ */ m("button", {
+					type: "button",
+					className: "absolute top-1/2 right-2.5 -translate-y-1/2 rounded p-0.5 text-muted-foreground hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring",
+					"aria-label": y(D ? "contents.clearSearch" : "common.close"),
+					onMouseDown: (e) => e.preventDefault(),
+					onClick: () => {
+						R.current?.focus(), F(-1), D ? (j(""), N(!0)) : N(!1);
+					},
+					children: /* @__PURE__ */ m(T, {
+						icon: _,
+						strokeWidth: 2,
+						className: "size-4",
+						"aria-hidden": !0
+					})
+				})
+			]
+		}), M && (z ? E(/* @__PURE__ */ h(n, {
+			appearance: l.appearance,
+			className: "fixed inset-x-0 bottom-0 z-[70] text-sm",
+			style: { top: B },
+			"data-ckui": "search-layer",
+			children: [/* @__PURE__ */ m("div", {
+				className: "absolute inset-0 bg-black/30 backdrop-blur-sm",
+				"data-ckui": "search-backdrop",
+				"aria-hidden": !0
+			}), /* @__PURE__ */ m("div", {
+				ref: L,
+				className: "relative w-full bg-background pt-1.5 text-foreground shadow-lg",
+				"data-ckui": "search-panel",
+				onKeyDown: Q,
+				children: /* @__PURE__ */ m("div", {
+					className: "mx-auto w-full max-w-[71rem] px-4 pt-5 md:px-[10%]",
+					children: /* @__PURE__ */ m("div", {
+						className: "[--search-max-height:70vh] overflow-y-auto pb-7 md:[--search-max-height:60vh]",
+						style: { maxHeight: `min(var(--search-max-height), calc(100dvh - ${B}px - 1.875rem))` },
+						children: /* @__PURE__ */ m("div", {
+							className: H ? "px-4 py-4" : "px-4",
+							children: $
+						})
+					})
+				})
 			})]
-		})]
+		}), document.body) : /* @__PURE__ */ m("div", {
+			ref: L,
+			className: "absolute top-full z-20 mt-1 grid max-h-96 w-full overflow-auto rounded-md border border-border bg-popover py-1 text-popover-foreground shadow-md",
+			"data-ckui": "search-panel",
+			onKeyDown: Q,
+			children: $
+		}))]
 	});
 }
 //#endregion
-export { b as SearchBox };
+export { j as SearchBox };
 
 //# sourceMappingURL=search.js.map

package/dist/components/content/search.js.map

@@ -1 +1 @@
-{"version":3,"file":"search.js","names":[],"sources":["../../../src/components/content/search.tsx"],"sourcesContent":["import { Cancel01Icon, Clock01Icon, Search01Icon } from \"@hugeicons/core-free-icons\";\nimport { HugeiconsIcon } from \"@hugeicons/react\";\nimport { cn } from \"cn\";\nimport { useContext, useId, useMemo, useState } from \"react\";\nimport type { ContentKitUiAppearance } from \"../../appearance.js\";\nimport type { ContentKitClient } from \"../../client/client.js\";\nimport type { Card, GroupCard } from \"../../client/generated/wire.js\";\nimport { useMessages } from \"../../i18n/context.js\";\nimport { ContentKitContext } from \"../../react/context.js\";\nimport { useRecentSearches, useTypeahead } from \"../../react/discovery.js\";\nimport { ContentKitUiRoot } from \"../../scope.js\";\nimport { Input } from \"#ckui/ui/input\";\nimport { RenditionImg } from \"../rendition-img.js\";\nimport { labelOf, type Labels } from \"../groups/parts.js\";\n\nexport interface SearchBoxProps {\n  /** Submits the text: the host shows its search page. */\n  onSearch: (q: string) => void;\n  /** Suggest contents of this kind only. */\n  kind?: string;\n  /** The group kinds suggested; every kind with a page by default. */\n  groupKinds?: readonly string[];\n  defaultValue?: string;\n  placeholder?: string;\n  /** A suggestion's link; default its canonical path. */\n  href?: (item: Card | GroupCard) => string | undefined;\n  labels?: Labels;\n  /** The reader's recent searches while the box is empty. Default true. */\n  recent?: boolean;\n  client?: ContentKitClient;\n  className?: string;\n  appearance?: ContentKitUiAppearance;\n}\n\ntype Suggestion = { type: \"content\"; card: Card } | { type: \"group\"; group: GroupCard } | { type: \"recent\"; query: string };\n\n/**\n * A search field suggesting contents and groups as the reader types, and\n * recent searches while it is empty; Enter searches, or opens the suggestion chosen.\n */\nexport function SearchBox(p: SearchBoxProps) {\n  const { t } = useMessages();\n  const id = useId();\n  const navigate = useContext(ContentKitContext)?.navigate;\n  const [text, setText] = useState(p.defaultValue ?? \"\");\n  const [open, setOpen] = useState(false);\n  const [active, setActive] = useState(-1);\n  const [touched, setTouched] = useState(false);\n  const empty = !text.trim();\n  const found = useTypeahead(text, { kind: p.kind, group_kinds: p.groupKinds, client: p.client });\n  const recent = useRecentSearches({ enabled: p.recent !== false && touched, client: p.client });\n  const items = useMemo<Suggestion[]>(\n    () =>\n      empty\n        ? recent.searches.map((r) => ({ type: \"recent\" as const, query: r.query }))\n        : [...found.contents.map((card) => ({ type: \"content\" as const, card })), ...found.groups.map((group) => ({ type: \"group\" as const, group }))],\n    [empty, recent.searches, found.contents, found.groups],\n  );\n  const shown = open && items.length > 0 && (empty || found.query === text.trim());\n  const search = (q: string) => {\n    setOpen(false);\n    if (q) p.onSearch(q);\n  };\n  const go = (s: Suggestion) => {\n    if (s.type === \"recent\") {\n      setText(s.query);\n      return search(s.query);\n    }\n    const url = p.href ? p.href(s.type === \"content\" ? s.card : s.group) : s.type === \"content\" ? s.card.path : s.group.path;\n    setOpen(false);\n    if (!url) return;\n    if (navigate) navigate(url);\n    else location.assign(url);\n  };\n  return (\n    <ContentKitUiRoot appearance={p.appearance} className={cn(\"relative text-sm\", p.className)} data-ckui=\"search-box\">\n      <form\n        role=\"search\"\n        onSubmit={(e) => {\n          e.preventDefault();\n          if (shown && active >= 0) return go(items[active]!);\n          search(text.trim());\n        }}\n      >\n        <HugeiconsIcon icon={Search01Icon} strokeWidth={2} className=\"pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2 text-muted-foreground\" aria-hidden />\n        <Input\n          type=\"search\"\n          role=\"combobox\"\n          aria-label={t(\"contents.search\")}\n          aria-expanded={shown}\n          aria-controls={`${id}-list`}\n          aria-activedescendant={shown && active >= 0 ? `${id}-${active}` : undefined}\n          aria-autocomplete=\"list\"\n          autoComplete=\"off\"\n          className=\"h-9 ps-8\"\n          value={text}\n          placeholder={p.placeholder ?? t(\"contents.searchPlaceholder\")}\n          onChange={(e) => {\n            setText(e.target.value);\n            setOpen(true);\n            setActive(-1);\n          }}\n          onFocus={() => {\n            setOpen(true);\n            setTouched(true);\n          }}\n          onBlur={() => setOpen(false)}\n          onKeyDown={(e) => {\n            if (e.key === \"Escape\") return setOpen(false);\n            if (!shown) return;\n            if (e.key === \"ArrowDown\") {\n              e.preventDefault();\n              setActive((a) => Math.min(items.length - 1, a + 1));\n            } else if (e.key === \"ArrowUp\") {\n              e.preventDefault();\n              setActive((a) => Math.max(-1, a - 1));\n            }\n          }}\n        />\n      </form>\n      {shown && (\n        <div className=\"absolute top-full z-20 mt-1 grid max-h-96 w-full overflow-auto rounded-md border border-border bg-popover py-1 text-popover-foreground shadow-md\">\n          {empty && (\n            <div className=\"flex items-center justify-between gap-2 px-2 py-1 text-xs text-muted-foreground\">\n              <span id={`${id}-recent`}>{t(\"contents.recentSearches\")}</span>\n              <button\n                type=\"button\"\n                className=\"rounded px-1 hover:text-foreground\"\n                onMouseDown={(e) => {\n                  e.preventDefault();\n                  void recent.clear();\n                }}\n              >\n                {t(\"contents.clearRecent\")}\n              </button>\n            </div>\n          )}\n          <ul id={`${id}-list`} role=\"listbox\" aria-label={empty ? t(\"contents.recentSearches\") : t(\"contents.suggestions\")} className=\"grid\">\n            {items.map((s, i) => (\n              <li\n                key={s.type === \"content\" ? `c:${s.card.id}` : s.type === \"group\" ? `g:${s.group.id}` : `r:${s.query}`}\n                id={`${id}-${i}`}\n                role=\"option\"\n                aria-selected={i === active}\n                data-ckui=\"suggestion\"\n                data-type={s.type}\n                className={cn(\"flex cursor-pointer items-center gap-2 px-2 py-1.5\", i === active && \"bg-accent text-accent-foreground\")}\n                onMouseEnter={() => setActive(i)}\n                onMouseDown={(e) => {\n                  e.preventDefault();\n                  go(s);\n                }}\n              >\n                {s.type === \"content\" ? (\n                  <>\n                    <span className=\"h-10 w-8 shrink-0 overflow-hidden rounded bg-muted\">\n                      <RenditionImg outputs={s.card.cover} alt=\"\" fit=\"cover\" className=\"size-full\" />\n                    </span>\n                    <span className=\"min-w-0 truncate\">{s.card.title || s.card.code}</span>\n                  </>\n                ) : s.type === \"group\" ? (\n                  <>\n                    <span className=\"min-w-0 flex-1 truncate\">{s.group.name || s.group.slug}</span>\n                    <span className=\"text-xs text-muted-foreground\">{labelOf(p.labels, s.group.kind)}</span>\n                  </>\n                ) : (\n                  <>\n                    <HugeiconsIcon icon={Clock01Icon} strokeWidth={2} className=\"size-4 shrink-0 text-muted-foreground\" aria-hidden />\n                    <span className=\"min-w-0 flex-1 truncate\">{s.query}</span>\n                    <button\n                      type=\"button\"\n                      className=\"rounded p-0.5 text-muted-foreground hover:text-foreground\"\n                      aria-label={t(\"contents.removeRecent\", { q: s.query })}\n                      onMouseDown={(e) => {\n                        e.preventDefault();\n                        e.stopPropagation();\n                        void recent.clear(s.query);\n                      }}\n                    >\n                      <HugeiconsIcon icon={Cancel01Icon} strokeWidth={2} className=\"size-3.5\" aria-hidden />\n                    </button>\n                  </>\n                )}\n              </li>\n            ))}\n          </ul>\n        </div>\n      )}\n    </ContentKitUiRoot>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"search.js","names":[],"sources":["../../../src/components/content/search.tsx"],"sourcesContent":["import { Cancel01Icon, Clock01Icon, File01Icon, Folder01Icon, Image01Icon, Search01Icon, TagsIcon, UserIcon } from \"@hugeicons/core-free-icons\";\nimport { HugeiconsIcon, type IconSvgElement } from \"@hugeicons/react\";\nimport { cn } from \"cn\";\nimport { useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, type RefObject, type KeyboardEvent } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport type { ContentKitUiAppearance } from \"../../appearance.js\";\nimport type { ContentKitClient } from \"../../client/client.js\";\nimport type { Card, GroupCard } from \"../../client/generated/wire.js\";\nimport { useMessages } from \"../../i18n/context.js\";\nimport { ContentKitContext } from \"../../react/context.js\";\nimport { useRecentSearches, useTypeahead } from \"../../react/discovery.js\";\nimport { ContentKitUiRoot } from \"../../scope.js\";\nimport { Input } from \"#ckui/ui/input\";\nimport { RenditionImg } from \"../rendition-img.js\";\nimport { labelOf, type Labels } from \"../groups/parts.js\";\n\nexport interface SearchBoxProps {\n  /** Submits the text: the host shows its search page. */\n  onSearch: (q: string) => void;\n  /** Suggest contents of this kind only. */\n  kind?: string;\n  /** The group kinds suggested; every kind with a page by default. */\n  groupKinds?: readonly string[];\n  defaultValue?: string;\n  placeholder?: string;\n  /** A suggestion's link; default its canonical path. */\n  href?: (item: Card | GroupCard) => string | undefined;\n  labels?: Labels;\n  /** The reader's recent searches while the box is empty. Default true. */\n  recent?: boolean;\n  /** Header-wide dropdown under the nearest header/banner; default stays inline. */\n  presentation?: \"inline\" | \"header\";\n  client?: ContentKitClient;\n  className?: string;\n  appearance?: ContentKitUiAppearance;\n}\n\ntype Suggestion = { type: \"content\"; card: Card } | { type: \"group\"; group: GroupCard } | { type: \"recent\"; query: string; searchedAt?: string };\n\nconst TYPE_ICONS: Record<string, { icon: IconSvgElement; color: string }> = {\n  artist: { icon: UserIcon, color: \"text-blue-500 dark:text-blue-400\" },\n  series: { icon: Folder01Icon, color: \"text-yellow-600 dark:text-yellow-400\" },\n  gallery: { icon: Image01Icon, color: \"text-green-600 dark:text-green-400\" },\n  post: { icon: File01Icon, color: \"text-purple-500 dark:text-purple-400\" },\n  blog: { icon: File01Icon, color: \"text-purple-500 dark:text-purple-400\" },\n  poll: { icon: File01Icon, color: \"text-purple-500 dark:text-purple-400\" },\n  character: { icon: UserIcon, color: \"text-purple-500 dark:text-purple-400\" },\n  tag: { icon: TagsIcon, color: \"text-orange-500 dark:text-orange-400\" },\n};\n\nfunction useHeaderTop(open: boolean, enabled: boolean, root: RefObject<HTMLDivElement | null>, input: RefObject<HTMLInputElement | null>): number {\n  const [top, setTop] = useState(0);\n  useLayoutEffect(() => {\n    if (!open || !enabled || !root.current) return;\n    const anchor = root.current.closest('header, [role=\"banner\"]') ?? input.current ?? root.current;\n    const view = root.current.ownerDocument.defaultView;\n    if (!view) return;\n    const measure = () => setTop(Math.max(0, Math.min(view.innerHeight, anchor.getBoundingClientRect().bottom)));\n    measure();\n    const observer = typeof ResizeObserver === \"undefined\" ? undefined : new ResizeObserver(measure);\n    observer?.observe(anchor);\n    view.addEventListener(\"resize\", measure);\n    view.addEventListener(\"scroll\", measure, true);\n    view.visualViewport?.addEventListener(\"resize\", measure);\n    view.visualViewport?.addEventListener(\"scroll\", measure);\n    return () => {\n      observer?.disconnect();\n      view.removeEventListener(\"resize\", measure);\n      view.removeEventListener(\"scroll\", measure, true);\n      view.visualViewport?.removeEventListener(\"resize\", measure);\n      view.visualViewport?.removeEventListener(\"scroll\", measure);\n    };\n  }, [open, enabled, root, input]);\n  return top;\n}\n\nfunction SearchTypeIcon({ kind }: { kind: string }) {\n  const type = TYPE_ICONS[kind];\n  return <HugeiconsIcon icon={type?.icon ?? Search01Icon} strokeWidth={2} className={cn(\"size-4 shrink-0\", type?.color ?? \"text-muted-foreground\")} data-search-kind={kind} aria-hidden />;\n}\n\nfunction SearchDate({ value, formatter }: { value?: string; formatter: Intl.DateTimeFormat }) {\n  if (!value || Number.isNaN(Date.parse(value))) return null;\n  return <time dateTime={value} className=\"shrink-0 text-xs text-muted-foreground\">{formatter.format(new Date(value))}</time>;\n}\n\n/**\n * A search field suggesting contents and groups as the reader types, and\n * recent searches while it is empty; Enter searches, or opens the suggestion chosen.\n */\nexport function SearchBox(p: SearchBoxProps) {\n  const { t, error, language } = useMessages();\n  const id = useId();\n  const navigate = useContext(ContentKitContext)?.navigate;\n  const [text, setText] = useState(p.defaultValue ?? \"\");\n  const [open, setOpen] = useState(false);\n  const [active, setActive] = useState(-1);\n  const root = useRef<HTMLDivElement>(null);\n  const panel = useRef<HTMLDivElement>(null);\n  const input = useRef<HTMLInputElement>(null);\n  const header = p.presentation === \"header\";\n  const top = useHeaderTop(open, header, root, input);\n  const dates = useMemo(() => new Intl.DateTimeFormat(language, { dateStyle: \"short\" }), [language]);\n  const empty = !text.trim();\n  const found = useTypeahead(text, { kind: p.kind, group_kinds: p.groupKinds, client: p.client });\n  const recent = useRecentSearches({ enabled: p.recent !== false && open && empty, client: p.client });\n  const items = useMemo<Suggestion[]>(\n    () =>\n      empty\n        ? recent.searches.map((r) => ({ type: \"recent\" as const, query: r.query, searchedAt: r.searched_at }))\n        : [...found.contents.map((card) => ({ type: \"content\" as const, card })), ...found.groups.map((group) => ({ type: \"group\" as const, group }))],\n    [empty, recent.searches, found.contents, found.groups],\n  );\n  const current = empty || found.query === text.trim();\n  const visible = current ? items : [];\n  const selected = visible[active];\n  const loading = empty ? recent.loading : !current || found.loading;\n  const showRecent = empty && p.recent !== false;\n  const emptyMessage = empty ? !header && showRecent && !recent.error ? \"contents.noRecentSearches\" : \"contents.searchHint\" : \"contents.noResults\";\n  useEffect(() => {\n    if (!open) return;\n    const outside = (event: PointerEvent) => {\n      if (!root.current?.contains(event.target as Node) && !panel.current?.contains(event.target as Node)) setOpen(false);\n    };\n    document.addEventListener(\"pointerdown\", outside);\n    return () => document.removeEventListener(\"pointerdown\", outside);\n  }, [open]);\n  const reveal = () => {\n    setOpen(true);\n  };\n  const search = (q: string) => {\n    setOpen(false);\n    if (q) p.onSearch(q);\n  };\n  const go = (s: Suggestion) => {\n    if (s.type === \"recent\") {\n      setText(s.query);\n      return search(s.query);\n    }\n    const url = p.href ? p.href(s.type === \"content\" ? s.card : s.group) : s.type === \"content\" ? s.card.path : s.group.path;\n    setOpen(false);\n    if (!url) return;\n    if (navigate) navigate(url);\n    else location.assign(url);\n  };\n  const panelKeyDown = (event: KeyboardEvent) => {\n    if (event.key !== \"Escape\") return;\n    event.preventDefault();\n    input.current?.focus();\n    setOpen(false);\n    setActive(-1);\n  };\n  const results = (<>\n    {showRecent && (\n      <div className={cn(\"flex items-center justify-between gap-2 text-muted-foreground\", header ? \"mb-4 text-base font-semibold\" : \"px-2 py-1 text-xs\")}>\n        <span id={`${id}-recent`} className=\"flex items-center gap-2\">{header && <HugeiconsIcon icon={Clock01Icon} strokeWidth={2} className=\"size-5\" aria-hidden />}{t(\"contents.recentSearches\")}</span>\n        {visible.length > 0 && <button\n          type=\"button\"\n          className=\"rounded px-1 hover:text-foreground\"\n          onMouseDown={(e) => {\n            e.preventDefault();\n          }}\n          onClick={() => void recent.clear()}\n        >\n          {t(header ? \"contents.clearAllRecent\" : \"contents.clearRecent\")}\n        </button>}\n      </div>\n    )}\n    <ul id={`${id}-list`} role=\"listbox\" aria-label={empty ? t(\"contents.recentSearches\") : t(\"contents.suggestions\")} className={cn(\"grid\", header && \"gap-2\")}>\n      {visible.map((s, i) => (\n        <li\n          key={s.type === \"content\" ? `c:${s.card.id}` : s.type === \"group\" ? `g:${s.group.id}` : `r:${s.query}`}\n          id={`${id}-${i}`}\n          role=\"option\"\n          aria-selected={i === active}\n          data-ckui=\"suggestion\"\n          data-type={s.type}\n          className={cn(\"flex cursor-pointer items-center\", header ? s.type === \"recent\" ? \"gap-2 rounded-md p-3 text-base hover:bg-foreground/10\" : \"gap-3 rounded-md px-4 py-1 text-base font-medium hover:bg-foreground/10\" : \"gap-2 px-2 py-1.5\", i === active && \"bg-accent text-accent-foreground\")}\n          onMouseEnter={() => setActive(i)}\n          onMouseDown={(e) => {\n            e.preventDefault();\n            go(s);\n          }}\n        >\n          {header && s.type !== \"recent\" ? (\n            <>\n              <SearchTypeIcon kind={s.type === \"content\" ? s.card.kind : s.group.kind} />\n              <span className=\"sr-only\">{labelOf(p.labels, s.type === \"content\" ? s.card.kind : s.group.kind)}</span>\n              <span className=\"min-w-0 flex-1 truncate\">{s.type === \"content\" ? s.card.title || s.card.code : s.group.name || s.group.slug}</span>\n            </>\n          ) : s.type === \"content\" ? (\n            <>\n              <span className=\"h-10 w-8 shrink-0 overflow-hidden rounded bg-muted\">\n                <RenditionImg outputs={s.card.cover} alt=\"\" fit=\"cover\" className=\"size-full\" />\n              </span>\n              <span className=\"min-w-0 truncate\">{s.card.title || s.card.code}</span>\n            </>\n          ) : s.type === \"group\" ? (\n            <>\n              <span className=\"min-w-0 flex-1 truncate\">{s.group.name || s.group.slug}</span>\n              <span className=\"text-xs text-muted-foreground\">{labelOf(p.labels, s.group.kind)}</span>\n            </>\n          ) : (\n            <>\n              <HugeiconsIcon icon={header ? Search01Icon : Clock01Icon} strokeWidth={2} className=\"size-4 shrink-0 text-muted-foreground\" aria-hidden />\n              <span className=\"min-w-0 flex-1 truncate\">{s.query}</span>\n              {header && <SearchDate value={s.searchedAt} formatter={dates} />}\n              <button\n                type=\"button\"\n                className=\"rounded p-0.5 text-muted-foreground hover:text-foreground\"\n                aria-label={t(\"contents.removeRecent\", { q: s.query })}\n                onMouseDown={(e) => {\n                  e.preventDefault();\n                  e.stopPropagation();\n                }}\n                onClick={() => void recent.clear(s.query)}\n              >\n                <HugeiconsIcon icon={Cancel01Icon} strokeWidth={2} className=\"size-3.5\" aria-hidden />\n              </button>\n            </>\n          )}\n        </li>\n      ))}\n    </ul>\n    {loading ? <div role=\"status\" className={cn(\"text-muted-foreground\", header ? \"flex justify-center py-4\" : \"px-3 py-2\")}>{header ? <><span className=\"size-6 animate-spin rounded-full border-2 border-muted border-t-foreground motion-reduce:animate-none\" aria-hidden /><span className=\"sr-only\">{t(\"contents.loading\")}</span></> : t(\"contents.loading\")}</div>\n      : !empty && found.error ? <p role=\"alert\" className={cn(\"px-3 py-2 text-destructive\", header && \"text-center\")}>{error(found.error)}</p>\n      : visible.length === 0 && <div role=\"status\" className={cn(\"text-muted-foreground\", header ? \"flex flex-col items-center gap-2 py-8 text-center\" : \"px-3 py-2\")}>{header && <HugeiconsIcon icon={Search01Icon} strokeWidth={2} className=\"size-8\" aria-hidden />}<p>{t(emptyMessage, { q: text.trim() })}</p></div>}\n  </>);\n  return (\n    <ContentKitUiRoot ref={root} appearance={p.appearance} className={cn(\"relative text-sm\", p.className)} data-ckui=\"search-box\" onBlur={(event) => { if (!event.currentTarget.contains(event.relatedTarget) && !panel.current?.contains(event.relatedTarget)) setOpen(false); }}>\n      <form\n        role=\"search\"\n        className=\"relative\"\n        onSubmit={(e) => {\n          e.preventDefault();\n          if (open && selected) return go(selected);\n          search(text.trim());\n        }}\n      >\n        {header ? <button type=\"submit\" className=\"absolute top-1/2 left-2.5 -translate-y-1/2 rounded text-muted-foreground hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring\" aria-label={t(\"contents.search\")}><HugeiconsIcon icon={Search01Icon} strokeWidth={2} className=\"size-4\" aria-hidden /></button>\n          : <HugeiconsIcon icon={Search01Icon} strokeWidth={2} className=\"pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2 text-muted-foreground\" aria-hidden />}\n        <Input\n          ref={input}\n          type={header ? \"text\" : \"search\"}\n          role=\"combobox\"\n          aria-label={t(\"contents.search\")}\n          aria-expanded={open}\n          aria-controls={`${id}-list`}\n          aria-activedescendant={open && selected ? `${id}-${active}` : undefined}\n          aria-autocomplete=\"list\"\n          autoComplete=\"off\"\n          className={cn(\"h-9 ps-8\", header && \"rounded-full border-border/50 bg-foreground/10 pe-9 text-base shadow-none md:text-base\")}\n          value={text}\n          placeholder={p.placeholder ?? t(\"contents.searchPlaceholder\")}\n          onChange={(e) => {\n            setText(e.target.value);\n            setOpen(true);\n            setActive(-1);\n          }}\n          onFocus={reveal}\n          onClick={reveal}\n          onKeyDown={(e) => {\n            if (e.key === \"Escape\") {\n              e.preventDefault();\n              setOpen(false);\n              setActive(-1);\n              return;\n            }\n            if (e.key === \"ArrowDown\") {\n              e.preventDefault();\n              reveal();\n              setActive((a) => open ? Math.min(visible.length - 1, a + 1) : 0);\n            } else if (e.key === \"ArrowUp\" && open) {\n              e.preventDefault();\n              setActive((a) => Math.max(-1, a - 1));\n            }\n          }}\n        />\n        {header && (text || open) && (\n          <button\n            type=\"button\"\n            className=\"absolute top-1/2 right-2.5 -translate-y-1/2 rounded p-0.5 text-muted-foreground hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring\"\n            aria-label={text ? t(\"contents.clearSearch\") : t(\"common.close\")}\n            onMouseDown={(event) => event.preventDefault()}\n            onClick={() => {\n              input.current?.focus();\n              setActive(-1);\n              if (text) { setText(\"\"); setOpen(true); }\n              else setOpen(false);\n            }}\n          ><HugeiconsIcon icon={Cancel01Icon} strokeWidth={2} className=\"size-4\" aria-hidden /></button>\n        )}\n      </form>\n      {open && (header ? createPortal(\n        <ContentKitUiRoot appearance={p.appearance} className=\"fixed inset-x-0 bottom-0 z-[70] text-sm\" style={{ top }} data-ckui=\"search-layer\">\n          <div className=\"absolute inset-0 bg-black/30 backdrop-blur-sm\" data-ckui=\"search-backdrop\" aria-hidden />\n          <div ref={panel} className=\"relative w-full bg-background pt-1.5 text-foreground shadow-lg\" data-ckui=\"search-panel\" onKeyDown={panelKeyDown}>\n            <div className=\"mx-auto w-full max-w-[71rem] px-4 pt-5 md:px-[10%]\">\n              <div className=\"[--search-max-height:70vh] overflow-y-auto pb-7 md:[--search-max-height:60vh]\" style={{ maxHeight: `min(var(--search-max-height), calc(100dvh - ${top}px - 1.875rem))` }}>\n                <div className={empty ? \"px-4 py-4\" : \"px-4\"}>{results}</div>\n              </div>\n            </div>\n          </div>\n        </ContentKitUiRoot>, document.body,\n      ) : <div ref={panel} className=\"absolute top-full z-20 mt-1 grid max-h-96 w-full overflow-auto rounded-md border border-border bg-popover py-1 text-popover-foreground shadow-md\" data-ckui=\"search-panel\" onKeyDown={panelKeyDown}>{results}</div>)}\n\n    </ContentKitUiRoot>\n  );\n}\n"],"mappings":"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"}