npm - @driftime/sanity-plugin-handbook - Versions diffs - 0.3.2 → 0.4.1 - Mend

@driftime/sanity-plugin-handbook 0.3.2 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/index.js CHANGED Viewed

@@ -1,9 +1,8 @@
+import { createContext, createElement, useContext, useEffect, useRef, useState } from "react";
 import { CommandList, PreviewCard, SanityDefaultPreview, defineArrayMember, defineField, definePlugin, defineType, useClient, useCurrentUser, useSchema } from "sanity";
 import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { createContext, createElement, useContext, useEffect, useRef, useState } from "react";
 import { Box, Button, Card, Flex, Heading, Layer, LayerProvider, Stack, Text, useClickOutsideEvent, useElementSize, useTheme_v2 } from "@sanity/ui";
-import { Code } from "@sanity/ui/code";
 import { Pane, PaneContent, PaneLayout } from "sanity/structure";
 import { PaneContext, PaneLayoutContext } from "sanity/_singletons";
 import { ArrowLeftIcon } from "@sanity/icons/ArrowLeft";
@@ -11,43 +10,19 @@ import { ChevronDownIcon } from "@sanity/icons/ChevronDown";
 import { ChevronRightIcon } from "@sanity/icons/ChevronRight";
 import { Popover } from "@sanity/ui/popover";
 import { PortableText } from "@portabletext/react";
-/** Properties every icon the plugin draws is rendered with. */
+import { Code } from "@sanity/ui/code";
+/** Default props for the plugin's own icons. Icons from `@sanity/icons` already match the Studio. */
 const defaultIconProps = {
 	width: "1em",
 	height: "1em",
 	strokeWidth: 1.5
 };
-function BookOpenTextIcon(props) {
-	let $ = c(8), t0, t1, t2, t3, t4, t5;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M12 7v14" }), t1 = /* @__PURE__ */ jsx("path", { d: "M16 12h2" }), t2 = /* @__PURE__ */ jsx("path", { d: "M16 8h2" }), t3 = /* @__PURE__ */ jsx("path", { d: "M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z" }), t4 = /* @__PURE__ */ jsx("path", { d: "M6 12h2" }), t5 = /* @__PURE__ */ jsx("path", { d: "M6 8h2" }), $[0] = t0, $[1] = t1, $[2] = t2, $[3] = t3, $[4] = t4, $[5] = t5) : (t0 = $[0], t1 = $[1], t2 = $[2], t3 = $[3], t4 = $[4], t5 = $[5]);
-	let t6;
-	return $[6] === props ? t6 = $[7] : (t6 = /* @__PURE__ */ jsxs("svg", {
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: 2,
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			t0,
-			t1,
-			t2,
-			t3,
-			t4,
-			t5
-		]
-	}), $[6] = props, $[7] = t6), t6;
-}
 /**
-* Creates a Sanity Studio icon component from an SVG icon.
+* Wraps an SVG icon component for use in the Studio.
 *
-* @param icon - The icon component to wrap.
-* @param props - Additional props merged over the default properties a Studio icon is drawn with.
-* @returns A Studio icon component.
+* @param icon - The icon to wrap.
+* @param props - Props that override the Studio icon defaults.
+* @returns An icon component.
 */
 function createSanityIcon(icon, props) {
 	let Icon = icon;
@@ -59,123 +34,59 @@ function createSanityIcon(icon, props) {
 	}
 	return SanityIcon;
 }
-function PortableCode(t0) {
-	let $ = c(8), props, style;
-	$[0] === t0 ? (props = $[1], style = $[2]) : ({style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style);
-	let t1;
-	$[3] === style ? t1 = $[4] : (t1 = {
-		paddingBlock: 2,
-		paddingInline: 4,
-		fontSize: "0.875em",
-		backgroundColor: "var(--card-code-bg-color)",
-		borderRadius: 2,
-		...style
-	}, $[3] = style, $[4] = t1);
-	let t2;
-	return $[5] !== props || $[6] !== t1 ? (t2 = /* @__PURE__ */ jsx("code", {
-		style: t1,
-		...props
-	}), $[5] = props, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
-}
-function CodeDecorator(t0) {
-	let $ = c(2), { children } = t0, t1;
-	return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(PortableCode, { children }), $[0] = children, $[1] = t1), t1;
-}
-function ListItemStyle(t0) {
-	let $ = c(3), { children } = t0, t1;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { marginTop: "0.375em" }, $[0] = t1) : t1 = $[0];
-	let t2;
-	return $[1] === children ? t2 = $[2] : (t2 = /* @__PURE__ */ jsx(Text, {
-		size: 1,
-		style: t1,
-		children
-	}), $[1] = children, $[2] = t2), t2;
-}
-function PortableBlockquote(t0) {
-	let $ = c(15), children, muted, props, style;
-	$[0] === t0 ? (children = $[1], muted = $[2], props = $[3], style = $[4]) : ({muted, children, style, ...props} = t0, $[0] = t0, $[1] = children, $[2] = muted, $[3] = props, $[4] = style);
-	let t1;
-	$[5] === style ? t1 = $[6] : (t1 = {
-		borderLeft: "2px solid var(--card-border-color)",
-		...style
-	}, $[5] = style, $[6] = t1);
-	let t2;
-	$[7] === Symbol.for("react.memo_cache_sentinel") ? (t2 = { fontStyle: "italic" }, $[7] = t2) : t2 = $[7];
-	let t3;
-	$[8] !== children || $[9] !== muted ? (t3 = /* @__PURE__ */ jsx(Text, {
-		size: 1,
-		muted,
-		style: t2,
-		children
-	}), $[8] = children, $[9] = muted, $[10] = t3) : t3 = $[10];
-	let t4;
-	return $[11] !== props || $[12] !== t1 || $[13] !== t3 ? (t4 = /* @__PURE__ */ jsx(Box, {
-		paddingY: 1,
-		paddingLeft: 3,
-		style: t1,
-		...props,
-		children: t3
-	}), $[11] = props, $[12] = t1, $[13] = t3, $[14] = t4) : t4 = $[14], t4;
-}
-function PortableHeading(props) {
-	let $ = c(2), t0;
-	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Text, {
-		as: "h2",
-		size: 1,
-		weight: "medium",
-		...props
-	}), $[0] = props, $[1] = t0), t0;
-}
-function PortableParagraph(props) {
-	let $ = c(2), t0;
-	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Text, {
-		size: 1,
-		...props
-	}), $[0] = props, $[1] = t0), t0;
-}
-function ParagraphStyle(t0) {
-	let $ = c(2), { children } = t0, t1;
-	return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(PortableParagraph, { children }), $[0] = children, $[1] = t1), t1;
-}
-function HeadingStyle(t0) {
-	let $ = c(2), { children } = t0, t1;
-	return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(PortableHeading, { children }), $[0] = children, $[1] = t1), t1;
-}
-function BlockquoteStyle(t0) {
-	let $ = c(2), { children } = t0, t1;
-	return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(PortableBlockquote, { children }), $[0] = children, $[1] = t1), t1;
+/** Whether this is a development build, the only kind in which the plugin logs. */
+const isDevelopment = process.env.NODE_ENV === "development", prefixStyle = "color: #2276fc";
+/**
+* Creates a logger that prefixes messages with the plugin's name and only logs in development builds.
+* Browser consoles show the prefix in blue.
+*
+* @param name - The package name to prefix messages with.
+* @returns Functions that log progress, a warning, or an error, or format a message to throw.
+*/
+function createLogger(name) {
+	let prefix = `[${name}]`;
+	/**
+	* Prefixes a message with the package name.
+	*
+	* @param message - The message.
+	* @returns The prefixed message.
+	*/
+	function format(message) {
+		return `${prefix} ${message}`;
+	}
+	return {
+		/**
+		* Logs progress worth seeing, such as what a build step did, in development builds only.
+		*
+		* @param message - What happened.
+		*/
+		info(message) {
+			isDevelopment && console.info(`%c${prefix}%c ${message}`, prefixStyle, "");
+		},
+		/**
+		* Logs a warning about something the plugin recovered from, in development builds only.
+		*
+		* @param message - What happened and what to do about it.
+		*/
+		warn(message) {
+			isDevelopment && console.warn(`%c${prefix}%c ${message}`, prefixStyle, "");
+		},
+		/**
+		* Logs an error the plugin couldn't recover from, in development builds only.
+		*
+		* @param message - What went wrong and what to do about it.
+		*/
+		error(message) {
+			isDevelopment && console.error(`%c${prefix}%c ${message}`, prefixStyle, "");
+		},
+		format
+	};
 }
-const linkAnnotation = defineArrayMember({
-	name: "link",
-	type: "object",
-	description: "Link applied to the selected text.",
-	preview: {
-		select: { href: "href" },
-		prepare(selection) {
-			let { href } = selection;
-			return { title: href ?? "Link" };
-		}
-	},
-	fields: [defineField({
-		name: "href",
-		title: "URL",
-		type: "url",
-		description: "Web address destination for this link. Supports http, https, mailto, and tel schemes.",
-		validation: (rule) => rule.uri({ scheme: [
-			"http",
-			"https",
-			"mailto",
-			"tel"
-		] })
-	})]
-});
-function InfoIcon(props) {
+/** Package name, used as the prefix on every logged message. */
+const pluginName = "@driftime/sanity-plugin-handbook", logger = createLogger(pluginName), guideTypeName = "handbook.guide", handbookTypeName = "handbook.handbook", imageTypeName = "handbook.image", videoTypeName = "handbook.video", codeTypeName = "handbook.code", calloutTypeName = "handbook.callout", horizontalRuleTypeName = "handbook.horizontalRule", singletonTypes = /* @__PURE__ */ new Set([handbookTypeName]), documentTypes = /* @__PURE__ */ new Set([handbookTypeName, guideTypeName]);
+function BookTextIcon(props) {
 	let $ = c(5), t0, t1, t2;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("circle", {
-		cx: "12",
-		cy: "12",
-		r: "10"
-	}), t1 = /* @__PURE__ */ jsx("path", { d: "M12 16v-4" }), t2 = /* @__PURE__ */ jsx("path", { d: "M12 8h.01" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20" }), t1 = /* @__PURE__ */ jsx("path", { d: "M8 11h8" }), t2 = /* @__PURE__ */ jsx("path", { d: "M8 7h6" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
 	let t3;
 	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
 		xmlns: "http://www.w3.org/2000/svg",
@@ -195,310 +106,410 @@ function InfoIcon(props) {
 		]
 	}), $[3] = props, $[4] = t3), t3;
 }
-function LightbulbIcon(props) {
-	let $ = c(5), t0, t1, t2;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5" }), t1 = /* @__PURE__ */ jsx("path", { d: "M9 18h6" }), t2 = /* @__PURE__ */ jsx("path", { d: "M10 22h4" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
-	let t3;
-	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: 2,
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			t0,
-			t1,
-			t2
-		]
-	}), $[3] = props, $[4] = t3), t3;
+/**
+* Checks whether a value is present. `false`, blank strings, and empty plain objects count as absent,
+* as does an array with no present elements.
+*
+* @param value - The value to check.
+* @returns True if the value is present.
+*/
+function isDefined(value) {
+	if (value == null || value === !1) return !1;
+	if (typeof value == "string") return value.trim() !== "";
+	if (Array.isArray(value)) return value.some((element) => isDefined(element));
+	if (typeof value == "object") {
+		let prototype = Reflect.getPrototypeOf(value);
+		return prototype !== Object.prototype && prototype !== null || Object.keys(value).length > 0;
+	}
+	return !0;
 }
-function TriangleAlertIcon(props) {
-	let $ = c(5), t0, t1, t2;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }), t1 = /* @__PURE__ */ jsx("path", { d: "M12 9v4" }), t2 = /* @__PURE__ */ jsx("path", { d: "M12 17h.01" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
-	let t3;
-	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: 2,
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			t0,
-			t1,
-			t2
-		]
-	}), $[3] = props, $[4] = t3), t3;
+/**
+* Converts a string to another case.
+*
+* @param value - The string to convert.
+* @param format - The case to convert to.
+* @returns The converted string.
+*/
+function convertCase(value, format) {
+	let words = value.replaceAll(/(?<lower>[a-z0-9])(?<upper>[A-Z])/gu, "$<lower> $<upper>").replaceAll(/[-_\s]+/gu, " ").trim().toLowerCase();
+	switch (format) {
+		case "kebab": return words.replaceAll(/\s+/gu, "-");
+		case "snake": return words.replaceAll(/\s+/gu, "_");
+		case "camel": return words.replaceAll(/\s+(?<character>.)/gu, (_match, character) => character.toUpperCase());
+		case "pascal": return words.replaceAll(/(?:^|\s+)(?<character>.)/gu, (_match, character) => character.toUpperCase());
+		case "title": return words.replaceAll(/\b\w/gu, (character) => character.toUpperCase());
+		case "sentence": return words.replaceAll(/^(?<character>.)/gu, (character) => character.toUpperCase());
+		default: return value;
+	}
 }
-/** Presentation for each callout variant. */
-const presentation = {
-	tip: {
-		icon: LightbulbIcon,
-		tone: "positive"
-	},
-	info: {
-		icon: InfoIcon,
-		tone: "primary"
-	},
-	warning: {
-		icon: TriangleAlertIcon,
-		tone: "caution"
+/**
+* Checks whether a value is an object whose keys can be read.
+*
+* @param value - The value to check.
+* @returns True if the value is an object.
+*/
+function isRecord(value) {
+	return typeof value == "object" && !!value;
+}
+/**
+* Reads a nested value by following a path of keys.
+*
+* @param value - The object to read from.
+* @param path - The keys to follow.
+* @returns The value, or undefined when the path doesn't exist.
+*/
+function readPath(value, path) {
+	let current = value;
+	for (let segment of path) {
+		if (!isRecord(current)) return;
+		current = current[segment];
 	}
-};
-function CalloutContent(t0) {
-	let $ = c(17), children, props, variant;
-	$[0] === t0 ? (children = $[1], props = $[2], variant = $[3]) : ({variant, children, ...props} = t0, $[0] = t0, $[1] = children, $[2] = props, $[3] = variant);
-	let { icon: Icon, tone } = presentation[variant], t1;
-	$[4] === Symbol.for("react.memo_cache_sentinel") ? (t1 = {
-		flexShrink: 0,
-		marginTop: "-2px",
-		fontSize: "16px",
-		color: "var(--card-icon-color)"
-	}, $[4] = t1) : t1 = $[4];
-	let t2;
-	$[5] === Icon ? t2 = $[6] : (t2 = /* @__PURE__ */ jsx("div", {
-		style: t1,
-		children: /* @__PURE__ */ jsx(Icon, { ...defaultIconProps })
-	}), $[5] = Icon, $[6] = t2);
-	let t3;
-	$[7] === Symbol.for("react.memo_cache_sentinel") ? (t3 = { color: "var(--card-icon-color)" }, $[7] = t3) : t3 = $[7];
-	let t4;
-	$[8] === children ? t4 = $[9] : (t4 = /* @__PURE__ */ jsx(Text, {
-		size: 1,
-		style: t3,
-		children
-	}), $[8] = children, $[9] = t4);
-	let t5;
-	$[10] !== t2 || $[11] !== t4 ? (t5 = /* @__PURE__ */ jsxs(Flex, {
-		align: "flex-start",
-		gap: 3,
-		children: [t2, t4]
-	}), $[10] = t2, $[11] = t4, $[12] = t5) : t5 = $[12];
-	let t6;
-	return $[13] !== props || $[14] !== t5 || $[15] !== tone ? (t6 = /* @__PURE__ */ jsx(Card, {
-		padding: 4,
-		radius: 2,
-		tone,
-		...props,
-		children: t5
-	}), $[13] = props, $[14] = t5, $[15] = tone, $[16] = t6) : t6 = $[16], t6;
-}
-function CalloutPreview(t0) {
-	let $ = c(8), { variant, body } = t0, t1 = variant ?? "tip", t2;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t2 = {
-		display: "flex",
-		flexDirection: "column",
-		gap: 12
-	}, $[0] = t2) : t2 = $[0];
-	let t3;
-	$[1] === body ? t3 = $[2] : (t3 = body?.map(_temp2$1), $[1] = body, $[2] = t3);
-	let t4;
-	$[3] === t3 ? t4 = $[4] : (t4 = /* @__PURE__ */ jsx("div", {
-		style: t2,
-		children: t3
-	}), $[3] = t3, $[4] = t4);
-	let t5;
-	return $[5] !== t1 || $[6] !== t4 ? (t5 = /* @__PURE__ */ jsx(CalloutContent, {
-		variant: t1,
-		children: t4
-	}), $[5] = t1, $[6] = t4, $[7] = t5) : t5 = $[7], t5;
-}
-function _temp2$1(t0) {
-	let { _key, children } = t0;
-	return /* @__PURE__ */ jsx("div", {
-		style: { whiteSpace: "pre-wrap" },
-		children: children.map(_temp$3).join("")
-	}, _key);
+	return current;
 }
-function _temp$3(child) {
-	return child.text;
+/** Share of the space the content pane takes relative to the sidebar. */
+const contentSpacing = {
+	section: 48,
+	paragraph: 16,
+	heading: 48,
+	media: 24,
+	callout: 32,
+	blockquote: 32,
+	list: 32,
+	nestedList: 12,
+	rule: 40
+}, assetUrlFragment = "\"asset\": { \"url\": asset.asset->url }", guideFragment = `...@-> {
+  ...,
+  content[] { ..., ${`
+  _type == "${imageTypeName}" => { ..., ${assetUrlFragment} },
+  _type == "${videoTypeName}" => { ..., ${assetUrlFragment} }
+`} }
+}`;
+/**
+* Defines a GROQ query typed with its result, so fetches infer the result type.
+*
+* @param query - The GROQ query.
+* @returns The query, typed with its result.
+*/
+function defineTypedQuery(query) {
+	return query;
 }
-function MessageCircleIcon(props) {
-	let $ = c(3), t0;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719" }), $[0] = t0) : t0 = $[0];
-	let t1;
-	return $[1] === props ? t1 = $[2] : (t1 = /* @__PURE__ */ jsx("svg", {
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: 2,
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: t0
-	}), $[1] = props, $[2] = t1), t1;
+/**
+* Runs a typed query, returning undefined instead of null when nothing matches.
+*
+* @param client - The Sanity client.
+* @param query - The typed query.
+* @returns The result, or undefined when nothing matches.
+*/
+async function fetchQuery(client, query) {
+	return await client.fetch(query) ?? void 0;
 }
-/** Type name of the callout block. */
-const calloutTypeName = "handbook.callout", calloutType = defineType({
-	name: calloutTypeName,
-	type: "object",
-	title: "Callout",
-	icon: createSanityIcon(MessageCircleIcon),
-	description: "Highlighted message block drawing attention to tips, supplementary information, or warnings.",
-	components: { preview: CalloutPreview },
-	preview: {
-		select: {
-			variant: "variant",
-			body: "body"
-		},
-		prepare(selection) {
-			let { variant, body } = selection;
-			return {
-				title: "Callout",
-				variant,
-				body
-			};
-		}
-	},
-	fields: [defineField({
-		name: "variant",
-		type: "string",
-		description: "Visual style and intent of the callout.",
-		initialValue: "tip",
-		validation: (rule) => rule.required(),
-		options: {
-			list: [
-				{
-					title: "Tip",
-					value: "tip"
-				},
-				{
-					title: "Information",
-					value: "info"
-				},
-				{
-					title: "Warning",
-					value: "warning"
-				}
-			],
-			layout: "radio",
-			direction: "horizontal"
-		}
-	}), defineField({
-		name: "body",
-		type: "array",
-		description: "Content displayed inside the callout. Supports inline formatting and links.",
-		of: [defineArrayMember({
-			name: "block",
-			type: "block",
-			styles: [{
-				title: "Normal",
-				value: "normal",
-				component: ParagraphStyle
-			}],
-			lists: [],
-			marks: {
-				decorators: [
-					{
-						title: "Bold",
-						value: "strong"
-					},
-					{
-						title: "Italic",
-						value: "em"
-					},
-					{
-						title: "Strikethrough",
-						value: "strike-through"
-					},
-					{
-						title: "Code",
-						value: "code",
-						component: CodeDecorator
-					}
-				],
-				annotations: [linkAnnotation]
-			}
-		})]
-	})]
-});
-function CodeContent(t0) {
-	let $ = c(14), code, language, props, style;
-	$[0] === t0 ? (code = $[1], language = $[2], props = $[3], style = $[4]) : ({code, language, style, ...props} = t0, $[0] = t0, $[1] = code, $[2] = language, $[3] = props, $[4] = style);
-	let t1;
-	$[5] === style ? t1 = $[6] : (t1 = {
-		overflowX: "auto",
-		...style
-	}, $[5] = style, $[6] = t1);
-	let t2;
-	$[7] !== code || $[8] !== language ? (t2 = /* @__PURE__ */ jsx(Code, {
-		size: 1,
-		language,
-		children: code
-	}), $[7] = code, $[8] = language, $[9] = t2) : t2 = $[9];
+/** Handbook document with its guide references expanded. */
+const handbookQuery = defineTypedQuery(`
+  *[_type == "${handbookTypeName}"][0] {
+    ...,
+    groups[] {
+      ...,
+      guides[] {
+        ...,
+        ${guideFragment}
+      }
+    }
+  }
+`), handbookDocumentsQuery = defineTypedQuery(`*[_type == "${handbookTypeName}" || _type == "${guideTypeName}"]`);
+/**
+* Fetches the Handbook document with its guides expanded, refetching when any Handbook document changes.
+*
+* @returns The Handbook document, and whether it's still loading.
+*/
+function useHandbookDocument() {
+	let $ = c(7), t0;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = { apiVersion: "2026-01-01" }, $[0] = t0) : t0 = $[0];
+	let client = useClient(t0), [handbook, setHandbook] = useState(void 0), [loading, setLoading] = useState(!0), t1, t2;
+	$[1] === client ? (t1 = $[2], t2 = $[3]) : (t1 = () => {
+		let fetchHandbook = async function fetchHandbook() {
+			setHandbook(await fetchQuery(client, handbookQuery)), setLoading(!1);
+		};
+		fetchHandbook();
+		let subscription = client.listen(handbookDocumentsQuery).subscribe(() => {
+			fetchHandbook();
+		});
+		return () => {
+			subscription.unsubscribe();
+		};
+	}, t2 = [client], $[1] = client, $[2] = t1, $[3] = t2), useEffect(t1, t2);
 	let t3;
-	return $[10] !== props || $[11] !== t1 || $[12] !== t2 ? (t3 = /* @__PURE__ */ jsx(Card, {
-		padding: 4,
-		radius: 2,
-		tone: "transparent",
-		style: t1,
-		...props,
-		children: t2
-	}), $[10] = props, $[11] = t1, $[12] = t2, $[13] = t3) : t3 = $[13], t3;
+	return $[4] !== handbook || $[5] !== loading ? (t3 = {
+		handbook,
+		loading
+	}, $[4] = handbook, $[5] = loading, $[6] = t3) : t3 = $[6], t3;
 }
+const HandbookContext = createContext(void 0);
 /**
-* Checks whether a value is defined and non-empty, treating `false`, empty strings, and objects with
-* no keys as absent. An array is absent unless one of its elements is itself present, while anything
-* built from a class counts as present on existence alone. Not intended for boolean flags.
+* Reads the Handbook context.
 *
-* @param value - The value to check.
-* @returns True if the value is defined and not empty.
+* @returns The plugin configuration and the shared pane state.
+* @throws When used outside the provider.
 */
-function isDefined(value) {
-	if (value == null || value === !1) return !1;
-	if (typeof value == "string") return value.trim() !== "";
-	if (Array.isArray(value)) return value.some((element) => isDefined(element));
-	if (typeof value == "object") {
-		let prototype = Reflect.getPrototypeOf(value);
-		return prototype !== Object.prototype && prototype !== null || Object.keys(value).length > 0;
-	}
-	return !0;
+function useHandbookContext() {
+	let handbookContext = useContext(HandbookContext);
+	if (!isDefined(handbookContext)) throw Error(logger.format("Handbook context is only available inside the Handbook provider."));
+	return handbookContext;
 }
 /**
-* Converts a string between different casing formats.
+* Provides the plugin configuration, the Handbook document, and the tab state shared by the sidebar and
+* content panes.
 *
-* @param value - The string to convert.
-* @param format - The target casing format.
-* @returns The converted string.
+* @returns The provider.
 */
-function convertCase(value, format) {
-	let words = value.replaceAll(/(?<lower>[a-z0-9])(?<upper>[A-Z])/gu, "$<lower> $<upper>").replaceAll(/[-_\s]+/gu, " ").trim().toLowerCase();
-	switch (format) {
-		case "kebab": return words.replaceAll(/\s+/gu, "-");
-		case "snake": return words.replaceAll(/\s+/gu, "_");
-		case "camel": return words.replaceAll(/\s+(?<character>.)/gu, (_match, character) => character.toUpperCase());
-		case "pascal": return words.replaceAll(/(?:^|\s+)(?<character>.)/gu, (_match, character) => character.toUpperCase());
-		case "title": return words.replaceAll(/\b\w/gu, (character) => character.toUpperCase());
-		case "sentence": return words.replaceAll(/^(?<character>.)/gu, (character) => character.toUpperCase());
-		default: return value;
-	}
-}
-function CodePreview(t0) {
-	let $ = c(3), { code, language } = t0;
-	if (!isDefined(code)) return null;
-	let t1;
-	return $[0] !== code || $[1] !== language ? (t1 = /* @__PURE__ */ jsx(CodeContent, {
-		code,
-		language
-	}), $[0] = code, $[1] = language, $[2] = t1) : t1 = $[2], t1;
+function HandbookProvider(t0) {
+	let $ = c(12), { sidebarTitle, roles, blocks, undocumentedFieldMessage, children } = t0, [activeTab, setActiveTab] = useState(void 0), [sidebarExpanded, setSidebarExpanded] = useState(!0), { handbook, loading } = useHandbookDocument(), t1;
+	$[0] !== activeTab || $[1] !== blocks || $[2] !== handbook || $[3] !== loading || $[4] !== roles || $[5] !== sidebarExpanded || $[6] !== sidebarTitle || $[7] !== undocumentedFieldMessage ? (t1 = {
+		sidebarTitle,
+		roles,
+		blocks,
+		undocumentedFieldMessage,
+		activeTab,
+		sidebarExpanded,
+		loading,
+		handbook,
+		setActiveTab,
+		setSidebarExpanded
+	}, $[0] = activeTab, $[1] = blocks, $[2] = handbook, $[3] = loading, $[4] = roles, $[5] = sidebarExpanded, $[6] = sidebarTitle, $[7] = undocumentedFieldMessage, $[8] = t1) : t1 = $[8];
+	let t2;
+	return $[9] !== children || $[10] !== t1 ? (t2 = /* @__PURE__ */ jsx(HandbookContext, {
+		value: t1,
+		children
+	}), $[9] = children, $[10] = t1, $[11] = t2) : t2 = $[11], t2;
 }
-function CodeIcon(props) {
-	let $ = c(4), t0, t1;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "m16 18 6-6-6-6" }), t1 = /* @__PURE__ */ jsx("path", { d: "m8 6-6 6 6 6" }), $[0] = t0, $[1] = t1) : (t0 = $[0], t1 = $[1]);
+function PaneHeader(t0) {
+	let $ = c(46), backButton, props, style, title;
+	$[0] === t0 ? (backButton = $[1], props = $[2], style = $[3], title = $[4]) : ({title, backButton, style, ...props} = t0, $[0] = t0, $[1] = backButton, $[2] = props, $[3] = style, $[4] = title);
+	let { color } = useTheme_v2(), pane = useContext(PaneContext), paneSize = useElementSize(pane?.rootElement ?? null), collapsed = pane?.collapsed ?? !1, isLast = pane?.isLast ?? !1, paneHeight = paneSize?.border.height ?? 0, collapsedWidth = paneHeight > 0 ? paneHeight : window.innerHeight, { bg, fg } = color.selectable.default.enabled, t1;
+	$[5] !== collapsed || $[6] !== pane ? (t1 = function handleTitleClick() {
+		collapsed || pane?.collapse();
+	}, $[5] = collapsed, $[6] = pane, $[7] = t1) : t1 = $[7];
+	let handleTitleClick = t1, t2;
+	$[8] !== collapsed || $[9] !== pane ? (t2 = function handleLayoutClick() {
+		collapsed && pane?.expand();
+	}, $[8] = collapsed, $[9] = pane, $[10] = t2) : t2 = $[10];
+	let handleLayoutClick = t2, t3 = collapsed ? "" : void 0, t4;
+	$[11] === style ? t4 = $[12] : (t4 = {
+		lineHeight: 0,
+		position: "sticky",
+		top: 0,
+		...style
+	}, $[11] = style, $[12] = t4);
+	let t5 = collapsed ? "" : void 0, t6 = collapsed ? collapsedWidth : void 0, t7 = collapsed ? "rotate(90deg)" : void 0, t8;
+	$[13] !== t6 || $[14] !== t7 ? (t8 = {
+		width: t6,
+		transform: t7,
+		transformOrigin: "calc(51px / 2)"
+	}, $[13] = t6, $[14] = t7, $[15] = t8) : t8 = $[15];
+	let t9;
+	$[16] === backButton ? t9 = $[17] : (t9 = isDefined(backButton) && /* @__PURE__ */ jsx(Box, {
+		flex: "none",
+		children: backButton
+	}), $[16] = backButton, $[17] = t9);
+	let t10 = isDefined(backButton) ? 1 : 2, t11 = isLast && !collapsed ? -1 : 0, t12;
+	$[18] === bg ? t12 = $[19] : (t12 = {
+		backgroundColor: bg,
+		minWidth: 0
+	}, $[18] = bg, $[19] = t12);
+	let t13;
+	$[20] === fg ? t13 = $[21] : (t13 = {
+		color: fg,
+		cursor: "default",
+		minWidth: 0,
+		outline: "none"
+	}, $[20] = fg, $[21] = t13);
+	let t14;
+	$[22] !== t13 || $[23] !== title ? (t14 = /* @__PURE__ */ jsx(Flex, {
+		align: "center",
+		gap: 1,
+		children: /* @__PURE__ */ jsx(Text, {
+			size: 1,
+			textOverflow: "ellipsis",
+			weight: "semibold",
+			style: t13,
+			children: title
+		})
+	}), $[22] = t13, $[23] = title, $[24] = t14) : t14 = $[24];
+	let t15;
+	$[25] !== handleTitleClick || $[26] !== t10 || $[27] !== t11 || $[28] !== t12 || $[29] !== t14 ? (t15 = /* @__PURE__ */ jsx(Card, {
+		flex: 1,
+		onClick: handleTitleClick,
+		padding: 2,
+		paddingLeft: t10,
+		tabIndex: t11,
+		style: t12,
+		__unstable_focusRing: !0,
+		children: t14
+	}), $[25] = handleTitleClick, $[26] = t10, $[27] = t11, $[28] = t12, $[29] = t14, $[30] = t15) : t15 = $[30];
+	let t16;
+	$[31] !== t15 || $[32] !== t9 ? (t16 = /* @__PURE__ */ jsxs(Flex, {
+		align: "flex-start",
+		gap: 3,
+		children: [t9, t15]
+	}), $[31] = t15, $[32] = t9, $[33] = t16) : t16 = $[33];
+	let t17;
+	$[34] !== handleLayoutClick || $[35] !== t16 || $[36] !== t8 ? (t17 = /* @__PURE__ */ jsx(Flex, {
+		direction: "column",
+		gap: 3,
+		onClick: handleLayoutClick,
+		padding: 3,
+		sizing: "border",
+		style: t8,
+		children: t16
+	}), $[34] = handleLayoutClick, $[35] = t16, $[36] = t8, $[37] = t17) : t17 = $[37];
+	let t18;
+	$[38] !== t17 || $[39] !== t5 ? (t18 = /* @__PURE__ */ jsx(Card, {
+		tone: "inherit",
+		"data-collapsed": t5,
+		children: t17
+	}), $[38] = t17, $[39] = t5, $[40] = t18) : t18 = $[40];
+	let t19;
+	return $[41] !== props || $[42] !== t18 || $[43] !== t3 || $[44] !== t4 ? (t19 = /* @__PURE__ */ jsx(LayerProvider, {
+		zOffset: 100,
+		children: /* @__PURE__ */ jsx(Layer, {
+			"data-collapsed": t3,
+			style: t4,
+			...props,
+			children: t18
+		})
+	}), $[41] = props, $[42] = t18, $[43] = t3, $[44] = t4, $[45] = t19) : t19 = $[45], t19;
+}
+function ContentPanel(t0) {
+	let $ = c(31), children, description, id, props, title;
+	$[0] === t0 ? (children = $[1], description = $[2], id = $[3], props = $[4], title = $[5]) : ({id, title, description, children, ...props} = t0, $[0] = t0, $[1] = children, $[2] = description, $[3] = id, $[4] = props, $[5] = title);
+	let { setSidebarExpanded } = useHandbookContext(), paneLayout = useContext(PaneLayoutContext), t1;
+	$[6] !== paneLayout?.collapsed || $[7] !== setSidebarExpanded ? (t1 = paneLayout?.collapsed === !0 && /* @__PURE__ */ jsx(Button, {
+		"aria-label": "Back",
+		icon: ArrowLeftIcon,
+		mode: "bleed",
+		onClick: () => {
+			setSidebarExpanded(!0);
+		}
+	}), $[6] = paneLayout?.collapsed, $[7] = setSidebarExpanded, $[8] = t1) : t1 = $[8];
 	let t2;
-	return $[2] === props ? t2 = $[3] : (t2 = /* @__PURE__ */ jsxs("svg", {
+	$[9] !== t1 || $[10] !== title ? (t2 = /* @__PURE__ */ jsx(PaneHeader, {
+		title,
+		backButton: t1
+	}), $[9] = t1, $[10] = title, $[11] = t2) : t2 = $[11];
+	let t3 = `panel-${id}`, t4;
+	$[12] === Symbol.for("react.memo_cache_sentinel") ? (t4 = {
+		maxWidth: 640,
+		boxSizing: "border-box",
+		marginInline: "auto",
+		paddingInline: 20,
+		paddingBlockStart: 32,
+		paddingBlockEnd: 220
+	}, $[12] = t4) : t4 = $[12];
+	let t5;
+	$[13] === title ? t5 = $[14] : (t5 = /* @__PURE__ */ jsx(Heading, {
+		as: "h2",
+		size: 4,
+		children: title
+	}), $[13] = title, $[14] = t5);
+	let t6;
+	$[15] === description ? t6 = $[16] : (t6 = isDefined(description) && /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		muted: !0,
+		children: description
+	}), $[15] = description, $[16] = t6);
+	let t7;
+	$[17] !== t5 || $[18] !== t6 ? (t7 = /* @__PURE__ */ jsxs(Stack, {
+		marginBottom: 6,
+		gap: 5,
+		children: [t5, t6]
+	}), $[17] = t5, $[18] = t6, $[19] = t7) : t7 = $[19];
+	let t8;
+	$[20] !== children || $[21] !== t7 ? (t8 = /* @__PURE__ */ jsxs(Box, {
+		style: t4,
+		children: [t7, children]
+	}), $[20] = children, $[21] = t7, $[22] = t8) : t8 = $[22];
+	let t9;
+	$[23] !== id || $[24] !== props || $[25] !== t3 || $[26] !== t8 ? (t9 = /* @__PURE__ */ jsx(PaneContent, {
+		id: t3,
+		"aria-labelledby": id,
+		overflow: "auto",
+		...props,
+		children: t8
+	}), $[23] = id, $[24] = props, $[25] = t3, $[26] = t8, $[27] = t9) : t9 = $[27];
+	let t10;
+	return $[28] !== t2 || $[29] !== t9 ? (t10 = /* @__PURE__ */ jsxs(Fragment, { children: [t2, t9] }), $[28] = t2, $[29] = t9, $[30] = t10) : t10 = $[30], t10;
+}
+function FieldHint(t0) {
+	let $ = c(32), children, icon, label, onClose, onOpen, open, props;
+	$[0] === t0 ? (children = $[1], icon = $[2], label = $[3], onClose = $[4], onOpen = $[5], open = $[6], props = $[7]) : ({label, icon, open, children, onOpen, onClose, ...props} = t0, $[0] = t0, $[1] = children, $[2] = icon, $[3] = label, $[4] = onClose, $[5] = onOpen, $[6] = open, $[7] = props);
+	let buttonReference = useRef(null), popoverReference = useRef(null), t1;
+	$[8] === Symbol.for("react.memo_cache_sentinel") ? (t1 = () => [buttonReference.current, popoverReference.current], $[8] = t1) : t1 = $[8], useClickOutsideEvent(open ? onClose : void 0, t1);
+	let t2;
+	$[9] === Symbol.for("react.memo_cache_sentinel") ? (t2 = { maxWidth: 280 }, $[9] = t2) : t2 = $[9];
+	let t3;
+	$[10] === label ? t3 = $[11] : (t3 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		weight: "semibold",
+		children: label
+	}), $[10] = label, $[11] = t3);
+	let t4;
+	$[12] === children ? t4 = $[13] : (t4 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		muted: !0,
+		children
+	}), $[12] = children, $[13] = t4);
+	let t5;
+	$[14] !== t3 || $[15] !== t4 ? (t5 = /* @__PURE__ */ jsx("div", {
+		ref: popoverReference,
+		children: /* @__PURE__ */ jsx(Box, {
+			padding: 3,
+			style: t2,
+			children: /* @__PURE__ */ jsxs(Stack, {
+				gap: 3,
+				children: [t3, t4]
+			})
+		})
+	}), $[14] = t3, $[15] = t4, $[16] = t5) : t5 = $[16];
+	let t6 = open ? onClose : onOpen, t7;
+	$[17] === onOpen ? t7 = $[18] : (t7 = (event) => {
+		event.pointerType === "mouse" && onOpen();
+	}, $[17] = onOpen, $[18] = t7);
+	let t8;
+	$[19] === onClose ? t8 = $[20] : (t8 = (event_0) => {
+		event_0.pointerType === "mouse" && onClose();
+	}, $[19] = onClose, $[20] = t8);
+	let t9;
+	$[21] !== icon || $[22] !== label || $[23] !== t6 || $[24] !== t7 || $[25] !== t8 ? (t9 = /* @__PURE__ */ jsx(Button, {
+		ref: buttonReference,
+		"aria-label": label,
+		fontSize: 2,
+		icon,
+		mode: "bleed",
+		padding: 1,
+		onClick: t6,
+		onPointerEnter: t7,
+		onPointerLeave: t8
+	}), $[21] = icon, $[22] = label, $[23] = t6, $[24] = t7, $[25] = t8, $[26] = t9) : t9 = $[26];
+	let t10;
+	return $[27] !== open || $[28] !== props || $[29] !== t5 || $[30] !== t9 ? (t10 = /* @__PURE__ */ jsx(Popover, {
+		open,
+		placement: "top",
+		portal: !0,
+		radius: 2,
+		shadow: 2,
+		content: t5,
+		...props,
+		children: t9
+	}), $[27] = open, $[28] = props, $[29] = t5, $[30] = t9, $[31] = t10) : t10 = $[31], t10;
+}
+function InfoIcon(props) {
+	let $ = c(5), t0, t1, t2;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("circle", {
+		cx: "12",
+		cy: "12",
+		r: "10"
+	}), t1 = /* @__PURE__ */ jsx("path", { d: "M12 16v-4" }), t2 = /* @__PURE__ */ jsx("path", { d: "M12 8h.01" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
+	let t3;
+	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
 		xmlns: "http://www.w3.org/2000/svg",
 		width: 24,
 		height: 24,
@@ -509,91 +520,16 @@ function CodeIcon(props) {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		...props,
-		children: [t0, t1]
-	}), $[2] = props, $[3] = t2), t2;
+		children: [
+			t0,
+			t1,
+			t2
+		]
+	}), $[3] = props, $[4] = t3), t3;
 }
-/** Type name of the code block. */
-const codeTypeName = "handbook.code", codeType = defineType({
-	name: codeTypeName,
-	type: "object",
-	title: "Code",
-	icon: createSanityIcon(CodeIcon),
-	description: "Syntax-highlighted code block with language selection.",
-	components: { preview: CodePreview },
-	preview: { select: {
-		code: "code",
-		language: "language"
-	} },
-	fields: [defineField({
-		name: "code",
-		type: "text",
-		description: "The source code to display."
-	}), defineField({
-		name: "language",
-		type: "string",
-		description: "Programming language used for syntax highlighting.",
-		options: { list: [
-			{
-				title: "CSS",
-				value: "css"
-			},
-			{
-				title: "GROQ",
-				value: "groq"
-			},
-			{
-				title: "HTML",
-				value: "html"
-			},
-			{
-				title: "JavaScript",
-				value: "javascript"
-			},
-			{
-				title: "JSON",
-				value: "json"
-			},
-			{
-				title: "Plain Text",
-				value: "text"
-			},
-			{
-				title: "React",
-				value: "tsx"
-			},
-			{
-				title: "Shell",
-				value: "shell"
-			},
-			{
-				title: "TypeScript",
-				value: "typescript"
-			}
-		] }
-	})]
-});
-function HorizontalRuleContent(t0) {
-	let $ = c(8), props, style;
-	$[0] === t0 ? (props = $[1], style = $[2]) : ({style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style);
-	let t1;
-	$[3] === style ? t1 = $[4] : (t1 = {
-		border: "none",
-		borderTop: "1px solid var(--card-border-color)",
-		...style
-	}, $[3] = style, $[4] = t1);
-	let t2;
-	return $[5] !== props || $[6] !== t1 ? (t2 = /* @__PURE__ */ jsx("hr", {
-		style: t1,
-		...props
-	}), $[5] = props, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
-}
-function HorizontalRulePreview(_props) {
-	let $ = c(1), t0;
-	return $[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx(HorizontalRuleContent, { style: { marginBlock: 8 } }), $[0] = t0) : t0 = $[0], t0;
-}
-function SeparatorHorizontalIcon(props) {
+function LightbulbIcon(props) {
 	let $ = c(5), t0, t1, t2;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "m16 16-4 4-4-4" }), t1 = /* @__PURE__ */ jsx("path", { d: "M3 12h18" }), t2 = /* @__PURE__ */ jsx("path", { d: "m8 8 4-4 4 4" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5" }), t1 = /* @__PURE__ */ jsx("path", { d: "M9 18h6" }), t2 = /* @__PURE__ */ jsx("path", { d: "M10 22h4" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
 	let t3;
 	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
 		xmlns: "http://www.w3.org/2000/svg",
@@ -613,98 +549,9 @@ function SeparatorHorizontalIcon(props) {
 		]
 	}), $[3] = props, $[4] = t3), t3;
 }
-/** Type name of the horizontal rule block. */
-const horizontalRuleTypeName = "handbook.horizontalRule", horizontalRuleType = defineType({
-	name: horizontalRuleTypeName,
-	type: "object",
-	title: "Horizontal Rule",
-	icon: createSanityIcon(SeparatorHorizontalIcon),
-	description: "Visual divider between sections of content.",
-	components: { preview: HorizontalRulePreview },
-	preview: { prepare() {
-		return { title: "Horizontal Rule" };
-	} },
-	fields: [defineField({
-		name: "style",
-		type: "string",
-		description: "Reserved. A horizontal rule carries no authored content.",
-		hidden: !0
-	})]
-});
-function Caption(t0) {
-	let $ = c(13), children, props, style;
-	$[0] === t0 ? (children = $[1], props = $[2], style = $[3]) : ({children, style, ...props} = t0, $[0] = t0, $[1] = children, $[2] = props, $[3] = style);
-	let t1;
-	$[4] === style ? t1 = $[5] : (t1 = {
-		marginBlockStart: 12,
-		...style
-	}, $[4] = style, $[5] = t1);
-	let t2;
-	$[6] === Symbol.for("react.memo_cache_sentinel") ? (t2 = { fontStyle: "italic" }, $[6] = t2) : t2 = $[6];
-	let t3;
-	$[7] === children ? t3 = $[8] : (t3 = /* @__PURE__ */ jsx(Text, {
-		size: 1,
-		muted: !0,
-		style: t2,
-		children
-	}), $[7] = children, $[8] = t3);
-	let t4;
-	return $[9] !== props || $[10] !== t1 || $[11] !== t3 ? (t4 = /* @__PURE__ */ jsx("div", {
-		style: t1,
-		...props,
-		children: t3
-	}), $[9] = props, $[10] = t1, $[11] = t3, $[12] = t4) : t4 = $[12], t4;
-}
-function ImageContent(t0) {
-	let $ = c(15), alt, caption, props, url;
-	$[0] === t0 ? (alt = $[1], caption = $[2], props = $[3], url = $[4]) : ({url, alt, caption, ...props} = t0, $[0] = t0, $[1] = alt, $[2] = caption, $[3] = props, $[4] = url);
-	let t1 = alt ?? "", t2;
-	$[5] === Symbol.for("react.memo_cache_sentinel") ? (t2 = {
-		display: "block",
-		maxWidth: "100%",
-		borderRadius: 4
-	}, $[5] = t2) : t2 = $[5];
-	let t3;
-	$[6] !== t1 || $[7] !== url ? (t3 = /* @__PURE__ */ jsx("img", {
-		src: url,
-		alt: t1,
-		style: t2
-	}), $[6] = t1, $[7] = url, $[8] = t3) : t3 = $[8];
-	let t4;
-	$[9] === caption ? t4 = $[10] : (t4 = isDefined(caption) && /* @__PURE__ */ jsx(Caption, { children: caption }), $[9] = caption, $[10] = t4);
-	let t5;
-	return $[11] !== props || $[12] !== t3 || $[13] !== t4 ? (t5 = /* @__PURE__ */ jsxs("div", {
-		...props,
-		children: [t3, t4]
-	}), $[11] = props, $[12] = t3, $[13] = t4, $[14] = t5) : t5 = $[14], t5;
-}
-function ImagePreview(t0) {
-	let $ = c(5), { url, alt, caption } = t0;
-	if (!isDefined(url)) return null;
-	let t1;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { padding: 8 }, $[0] = t1) : t1 = $[0];
-	let t2;
-	return $[1] !== alt || $[2] !== caption || $[3] !== url ? (t2 = /* @__PURE__ */ jsx(ImageContent, {
-		url,
-		alt,
-		caption,
-		style: t1
-	}), $[1] = alt, $[2] = caption, $[3] = url, $[4] = t2) : t2 = $[4], t2;
-}
-function ImageIcon(props) {
+function TriangleAlertIcon(props) {
 	let $ = c(5), t0, t1, t2;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("rect", {
-		width: "18",
-		height: "18",
-		x: "3",
-		y: "3",
-		rx: "2",
-		ry: "2"
-	}), t1 = /* @__PURE__ */ jsx("circle", {
-		cx: "9",
-		cy: "9",
-		r: "2"
-	}), t2 = /* @__PURE__ */ jsx("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }), t1 = /* @__PURE__ */ jsx("path", { d: "M12 9v4" }), t2 = /* @__PURE__ */ jsx("path", { d: "M12 17h.01" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
 	let t3;
 	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
 		xmlns: "http://www.w3.org/2000/svg",
@@ -724,1018 +571,295 @@ function ImageIcon(props) {
 		]
 	}), $[3] = props, $[4] = t3), t3;
 }
-/** Type name of the image block. */
-const imageTypeName = "handbook.image", imageType = defineType({
-	name: imageTypeName,
-	type: "object",
-	title: "Image",
-	icon: createSanityIcon(ImageIcon),
-	description: "Image with an optional caption and alternative text.",
-	components: { preview: ImagePreview },
-	preview: { select: {
-		caption: "caption",
-		alt: "alt",
-		url: "asset.asset.url"
-	} },
-	fields: [
-		defineField({
-			name: "asset",
-			title: "Image",
-			type: "image",
-			description: "Upload or select an image from the media library.",
-			options: { hotspot: !0 }
-		}),
-		defineField({
-			name: "caption",
-			type: "string",
-			description: "Caption text displayed below the image, such as a credit or a note."
-		}),
-		defineField({
-			name: "alt",
-			title: "Alternative Text",
-			type: "string",
-			description: "Describes what the image shows for people who cannot see it. Don't repeat the caption here."
-		})
-	]
-});
-function VideoContent(t0) {
-	let $ = c(16), caption, props, url;
-	$[0] === t0 ? (caption = $[1], props = $[2], url = $[3]) : ({url, caption, ...props} = t0, $[0] = t0, $[1] = caption, $[2] = props, $[3] = url);
-	let t1;
-	$[4] === Symbol.for("react.memo_cache_sentinel") ? (t1 = {
-		display: "block",
-		maxWidth: "100%",
-		borderRadius: 4,
-		WebkitTransform: "translateZ(0)"
-	}, $[4] = t1) : t1 = $[4];
-	let t2 = caption ?? "Video", t3;
-	$[5] === t2 ? t3 = $[6] : (t3 = /* @__PURE__ */ jsx("track", {
-		kind: "captions",
-		label: t2
-	}), $[5] = t2, $[6] = t3);
-	let t4;
-	$[7] !== t3 || $[8] !== url ? (t4 = /* @__PURE__ */ jsx("video", {
-		src: url,
-		controls: !0,
-		style: t1,
-		children: t3
-	}), $[7] = t3, $[8] = url, $[9] = t4) : t4 = $[9];
+/** Hint kinds, in display order. */
+const hintKinds = [
+	{
+		name: "tip",
+		label: "Tip",
+		icon: LightbulbIcon
+	},
+	{
+		name: "info",
+		label: "Information",
+		icon: InfoIcon
+	},
+	{
+		name: "caution",
+		label: "Caution",
+		icon: TriangleAlertIcon
+	}
+];
+function FieldHints(t0) {
+	let $ = c(22), caution, info, props, tip;
+	$[0] === t0 ? (caution = $[1], info = $[2], props = $[3], tip = $[4]) : ({tip, info, caution, ...props} = t0, $[0] = t0, $[1] = caution, $[2] = info, $[3] = props, $[4] = tip);
+	let [openHint, setOpenHint] = useState(void 0), T0, t1, t2, t3, t4;
+	if ($[5] !== caution || $[6] !== info || $[7] !== openHint || $[8] !== props || $[9] !== tip) {
+		let hints = {
+			tip,
+			info,
+			caution
+		}, t5;
+		$[15] === Symbol.for("react.memo_cache_sentinel") ? (t5 = function closeHint() {
+			setOpenHint(void 0);
+		}, $[15] = t5) : t5 = $[15];
+		let closeHint = t5;
+		T0 = Flex, t1 = "center", t2 = 2, t3 = props, t4 = hintKinds.flatMap((t6) => {
+			let { name, label, icon: Icon } = t6, hint = hints[name];
+			return isDefined(hint) ? /* @__PURE__ */ jsx(FieldHint, {
+				label,
+				icon: /* @__PURE__ */ jsx(Icon, { ...defaultIconProps }),
+				open: openHint === name,
+				onOpen: () => {
+					setOpenHint(name);
+				},
+				onClose: closeHint,
+				children: hint
+			}, name) : [];
+		}), $[5] = caution, $[6] = info, $[7] = openHint, $[8] = props, $[9] = tip, $[10] = T0, $[11] = t1, $[12] = t2, $[13] = t3, $[14] = t4;
+	} else T0 = $[10], t1 = $[11], t2 = $[12], t3 = $[13], t4 = $[14];
 	let t5;
-	$[10] === caption ? t5 = $[11] : (t5 = isDefined(caption) && /* @__PURE__ */ jsx(Caption, { children: caption }), $[10] = caption, $[11] = t5);
-	let t6;
-	return $[12] !== props || $[13] !== t4 || $[14] !== t5 ? (t6 = /* @__PURE__ */ jsxs("div", {
-		...props,
-		children: [t4, t5]
-	}), $[12] = props, $[13] = t4, $[14] = t5, $[15] = t6) : t6 = $[15], t6;
+	return $[16] !== T0 || $[17] !== t1 || $[18] !== t2 || $[19] !== t3 || $[20] !== t4 ? (t5 = /* @__PURE__ */ jsx(T0, {
+		align: t1,
+		gap: t2,
+		...t3,
+		children: t4
+	}), $[16] = T0, $[17] = t1, $[18] = t2, $[19] = t3, $[20] = t4, $[21] = t5) : t5 = $[21], t5;
 }
-function VideoPreview(t0) {
-	let $ = c(4), { url, caption } = t0;
-	if (!isDefined(url)) return null;
-	let t1;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { padding: 8 }, $[0] = t1) : t1 = $[0];
-	let t2;
-	return $[1] !== caption || $[2] !== url ? (t2 = /* @__PURE__ */ jsx(VideoContent, {
-		url,
-		caption,
-		style: t1
-	}), $[1] = caption, $[2] = url, $[3] = t2) : t2 = $[3], t2;
+/**
+* Works out a schema type's label: its Handbook title, then its schema title, then its name in title case.
+*
+* @param type - The schema type or field.
+* @returns The label.
+*/
+function resolveTitle(type) {
+	let { name, title, handbook } = type;
+	return handbook?.title ?? title ?? convertCase(name, "title");
 }
-function FilmIcon(props) {
-	let $ = c(10), t0, t1, t2, t3, t4, t5, t6, t7;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("rect", {
-		x: "3",
-		y: "3",
-		width: "18",
-		height: "18",
-		rx: "2"
-	}), t1 = /* @__PURE__ */ jsx("path", { d: "M7 3v18" }), t2 = /* @__PURE__ */ jsx("path", { d: "M3 7.5h4" }), t3 = /* @__PURE__ */ jsx("path", { d: "M3 12h18" }), t4 = /* @__PURE__ */ jsx("path", { d: "M3 16.5h4" }), t5 = /* @__PURE__ */ jsx("path", { d: "M17 3v18" }), t6 = /* @__PURE__ */ jsx("path", { d: "M17 7.5h4" }), t7 = /* @__PURE__ */ jsx("path", { d: "M17 16.5h4" }), $[0] = t0, $[1] = t1, $[2] = t2, $[3] = t3, $[4] = t4, $[5] = t5, $[6] = t6, $[7] = t7) : (t0 = $[0], t1 = $[1], t2 = $[2], t3 = $[3], t4 = $[4], t5 = $[5], t6 = $[6], t7 = $[7]);
-	let t8;
-	return $[8] === props ? t8 = $[9] : (t8 = /* @__PURE__ */ jsxs("svg", {
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: 2,
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			t0,
-			t1,
-			t2,
-			t3,
-			t4,
-			t5,
-			t6,
-			t7
-		]
-	}), $[8] = props, $[9] = t8), t8;
+/**
+* Works out a schema type's description, preferring its Handbook description and ignoring non-string
+* schema descriptions.
+*
+* @param type - The schema type or field.
+* @returns The description, or undefined when there isn't one.
+*/
+function resolveDescription(type) {
+	let { description, handbook } = type;
+	return handbook?.description ?? (typeof description == "string" ? description : void 0);
 }
-/** Type name of the video block. */
-const videoTypeName = "handbook.video", videoType = defineType({
-	name: videoTypeName,
-	type: "object",
-	title: "Video",
-	icon: createSanityIcon(FilmIcon),
-	description: "Video with an optional caption.",
-	components: { preview: VideoPreview },
-	preview: { select: {
-		caption: "caption",
-		url: "asset.asset.url"
-	} },
-	fields: [defineField({
-		name: "asset",
-		title: "Video",
-		type: "file",
-		description: "Upload or select a video from the media library.",
-		options: { accept: "video/*" }
-	}), defineField({
-		name: "caption",
-		type: "string",
-		description: "Caption text displayed below the video, such as a credit or a note."
-	})]
-});
 /**
-* Creates the Portable Text content field for Handbook guides, offering the built-in blocks alongside
-* any a consumer registered.
+* Gets a schema type's icon as a component, redrawn at the plugin's icon size to match the built-in icons.
+* String icons are ignored.
 *
-* @param customBlocks - Custom block definitions registered by the consumer.
-* @returns A field definition for the guide content array.
+* @param type - The schema type.
+* @returns The icon component, or undefined when there isn't one.
 */
-function createGuideContentField(customBlocks = []) {
-	return defineField({
-		name: "content",
-		type: "array",
-		description: "Rich text with formatting, headings, lists, images, code blocks, and custom blocks.",
-		of: [
-			defineArrayMember({
-				name: "block",
-				type: "block",
-				styles: [
-					{
-						title: "Paragraph",
-						value: "normal",
-						component: ParagraphStyle
-					},
-					{
-						title: "Heading",
-						value: "h2",
-						component: HeadingStyle
-					},
-					{
-						title: "Blockquote",
-						value: "blockquote",
-						component: BlockquoteStyle
-					}
-				],
-				lists: [{
-					title: "Bullet",
-					value: "bullet",
-					component: ListItemStyle
-				}, {
-					title: "Number",
-					value: "number",
-					component: ListItemStyle
-				}],
-				marks: {
-					decorators: [
-						{
-							title: "Bold",
-							value: "strong"
-						},
-						{
-							title: "Italic",
-							value: "em"
-						},
-						{
-							title: "Strikethrough",
-							value: "strike-through"
-						},
-						{
-							title: "Code",
-							value: "code",
-							component: CodeDecorator
-						}
-					],
-					annotations: [linkAnnotation]
-				}
-			}),
-			defineArrayMember({
-				name: imageTypeName,
-				type: imageTypeName
-			}),
-			defineArrayMember({
-				name: videoTypeName,
-				type: videoTypeName
-			}),
-			defineArrayMember({
-				name: codeTypeName,
-				type: codeTypeName
-			}),
-			defineArrayMember({
-				name: calloutTypeName,
-				type: calloutTypeName
-			}),
-			defineArrayMember({
-				name: horizontalRuleTypeName,
-				type: horizontalRuleTypeName
-			}),
-			...customBlocks.map((block) => defineArrayMember({
-				name: block.schema.name,
-				type: block.schema.name
-			}))
-		]
-	});
+function resolveIcon(type) {
+	return typeof type.icon == "function" ? createSanityIcon(type.icon) : void 0;
 }
-/** Document type name of an individual guide. */
-const guideTypeName = "handbook.guide";
+/** Types whose subfields aren't shown. */
+const opaqueTypes = /* @__PURE__ */ new Set([
+	"block",
+	"boolean",
+	"crossDatasetReference",
+	"date",
+	"datetime",
+	"file",
+	"geopoint",
+	"image",
+	"number",
+	"reference",
+	"slug",
+	"string",
+	"text",
+	"url"
+]), inheritedFieldNames = {
+	block: /* @__PURE__ */ new Set([
+		"children",
+		"level",
+		"listItem",
+		"markDefs",
+		"style"
+	]),
+	file: /* @__PURE__ */ new Set(["asset", "media"]),
+	geopoint: /* @__PURE__ */ new Set([
+		"alt",
+		"lat",
+		"lng"
+	]),
+	image: /* @__PURE__ */ new Set([
+		"asset",
+		"crop",
+		"hotspot",
+		"media"
+	]),
+	slug: /* @__PURE__ */ new Set(["current", "source"])
+};
 /**
-* Creates the document type a single guide is authored as, with its content field offering the
-* built-in blocks alongside any a consumer registered.
+* Checks whether a value is a compiled schema field with a type object.
 *
-* @param customBlocks - Custom block definitions registered by the consumer.
-* @returns A document type definition for Handbook guides.
+* @param value - The value to check.
+* @returns True if the value is a compiled field.
 */
-function createGuideType(customBlocks = []) {
-	return defineType({
-		name: guideTypeName,
-		type: "document",
-		title: "Handbook Guide",
-		icon: createSanityIcon(BookOpenTextIcon),
-		description: "Handbook page authored with rich text, images, and custom blocks.",
-		preview: {
-			select: {
-				title: "title",
-				description: "description"
-			},
-			prepare(selection) {
-				let { title, description } = selection;
-				return {
-					title: title ?? "Untitled",
-					subtitle: description
-				};
-			}
-		},
-		fields: [
-			defineField({
-				name: "title",
-				type: "string",
-				description: "Appears in the Handbook sidebar and as the guide heading.",
-				validation: (rule) => rule.required()
-			}),
-			defineField({
-				name: "description",
-				type: "string",
-				description: "Short introduction text displayed below the guide heading."
-			}),
-			createGuideContentField(customBlocks)
-		]
-	});
+function isCompiledField(value) {
+	return !isRecord(value) || !("name" in value) || !("type" in value) ? !1 : isRecord(value.type);
 }
-function BookTextIcon(props) {
-	let $ = c(5), t0, t1, t2;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20" }), t1 = /* @__PURE__ */ jsx("path", { d: "M8 11h8" }), t2 = /* @__PURE__ */ jsx("path", { d: "M8 7h6" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
-	let t3;
-	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: 2,
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			t0,
-			t1,
-			t2
-		]
-	}), $[3] = props, $[4] = t3), t3;
+/**
+* Checks whether a value has a `fields` array.
+*
+* @param value - The value to check.
+* @returns True if the value has a `fields` array.
+*/
+function hasFieldsArray(value) {
+	return isRecord(value) && Array.isArray(value.fields);
 }
-function ListPlusIcon(props) {
-	let $ = c(7), t0, t1, t2, t3, t4;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M16 5H3" }), t1 = /* @__PURE__ */ jsx("path", { d: "M11 12H3" }), t2 = /* @__PURE__ */ jsx("path", { d: "M16 19H3" }), t3 = /* @__PURE__ */ jsx("path", { d: "M18 9v6" }), t4 = /* @__PURE__ */ jsx("path", { d: "M21 12h-6" }), $[0] = t0, $[1] = t1, $[2] = t2, $[3] = t3, $[4] = t4) : (t0 = $[0], t1 = $[1], t2 = $[2], t3 = $[3], t4 = $[4]);
-	let t5;
-	return $[5] === props ? t5 = $[6] : (t5 = /* @__PURE__ */ jsxs("svg", {
-		xmlns: "http://www.w3.org/2000/svg",
-		width: 24,
-		height: 24,
-		viewBox: "0 0 24 24",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: 2,
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		...props,
-		children: [
-			t0,
-			t1,
-			t2,
-			t3,
-			t4
-		]
-	}), $[5] = props, $[6] = t5), t5;
+/**
+* Checks whether a value has an `of` array.
+*
+* @param value - The value to check.
+* @returns True if the value has an `of` array.
+*/
+function hasOfArray(value) {
+	return isRecord(value) && Array.isArray(value.of);
 }
-/** Document type name of the Handbook singleton. */
-const handbookTypeName = "handbook.handbook", handbookType = defineType({
-	name: handbookTypeName,
-	type: "document",
-	title: "Handbook",
-	icon: createSanityIcon(BookTextIcon),
-	description: "Defines the groups of guides shown in the Handbook sidebar, and the order they appear in.",
-	preview: { prepare() {
-		return { title: "Handbook" };
-	} },
-	fields: [defineField({
-		name: "groups",
-		type: "array",
-		description: "Ordered list of groups displayed in the Handbook sidebar. Each group contains a title and an ordered list of guide references.",
-		of: [defineArrayMember({
-			name: "group",
-			type: "object",
-			icon: createSanityIcon(ListPlusIcon),
-			description: "Named section of the Handbook sidebar holding an ordered list of guides.",
-			fields: [defineField({
-				name: "title",
-				type: "string",
-				description: "Heading displayed above this group of guides in the sidebar.",
-				validation: (rule) => rule.required()
-			}), defineField({
-				name: "guides",
-				type: "array",
-				description: "Ordered list of guides within this group. Drag to reorder.",
-				of: [defineArrayMember({
-					name: "guide",
-					type: "reference",
-					to: [{ type: guideTypeName }]
-				})]
-			})],
-			preview: {
-				select: {
-					title: "title",
-					guide0: "guides.0.title",
-					guide1: "guides.1.title",
-					guide2: "guides.2.title"
-				},
-				prepare(selection) {
-					let { title, guide0, guide1, guide2 } = selection, shown = [
-						guide0,
-						guide1,
-						guide2
-					].filter((guide) => isDefined(guide)).slice(0, 2), hasMore = isDefined(guide2);
-					function formatSubtitle() {
-						return isDefined(shown) ? hasMore ? `${shown.join(", ")}, and others` : shown.join(" and ") : "No guides selected";
-					}
-					return {
-						title: title ?? "Group",
-						subtitle: formatSubtitle()
-					};
-				}
-			}
-		})]
-	})]
-}), singletonTypes = /* @__PURE__ */ new Set([handbookTypeName]), documentTypes = /* @__PURE__ */ new Set([handbookTypeName, guideTypeName]), contentSpacing = {
-	section: 48,
-	paragraph: 16,
-	heading: 48,
-	media: 24,
-	callout: 32,
-	blockquote: 32,
-	list: 32,
-	nestedList: 12,
-	rule: 40
-}, assetUrlFragment = "\"asset\": { \"url\": asset.asset->url }", guideFragment = `...@-> {
-  ...,
-  content[] { ..., ${`
-  _type == "${imageTypeName}" => { ..., ${assetUrlFragment} },
-  _type == "${videoTypeName}" => { ..., ${assetUrlFragment} }
-`} }
-}`;
 /**
-* Brands a GROQ query with the shape of the data it returns, so a fetch can infer its result type
-* instead of being told it at every call site.
+* Reads the type name a value declares.
 *
-* @param query - The GROQ query string.
-* @returns The query, typed to the given result shape.
+* @param value - The value.
+* @returns The type name, or undefined when there isn't one.
 */
-function defineTypedQuery(query) {
-	return query;
+function getTypeName(value) {
+	let typeName = readPath(value, ["type"]);
+	return typeof typeName == "string" ? typeName : void 0;
 }
 /**
-* Runs a branded query against the dataset, resolving a missing document to undefined.
+* Reads the parent type name from a compiled schema type.
 *
-* @param client - The Sanity client to query with.
-* @param query - The branded query to run.
-* @returns The result, or undefined when the query matched nothing.
+* @param resolvedType - The compiled schema type.
+* @returns The parent type name, or undefined when there isn't one.
 */
-async function fetchQuery(client, query) {
-	return await client.fetch(query) ?? void 0;
+function getParentTypeName(resolvedType) {
+	let parentName = readPath(resolvedType, ["type", "name"]);
+	return isDefined(parentName) ? String(parentName) : void 0;
 }
-/** Fetches the Handbook singleton with expanded guide references. */
-const handbookQuery = defineTypedQuery(`
-  *[_type == "${handbookTypeName}"][0] {
-    ...,
-    groups[] {
-      ...,
-      guides[] {
-        ...,
-        ${guideFragment}
-      }
-    }
-  }
-`), handbookDocumentsQuery = defineTypedQuery(`*[_type == "${handbookTypeName}" || _type == "${guideTypeName}"]`);
 /**
-* Fetches the Handbook singleton from the dataset with its guide references expanded, refetching
-* whenever one of the documents it draws on changes.
+* Converts a compiled schema field into the shape the Handbook renders. Types already seen are tracked,
+* so a type that refers to itself doesn't recurse forever.
 *
-* @returns The Handbook and a flag for whether it is still loading.
+* @param field - A compiled field or a plain field definition.
+* @param visited - Type names already seen.
+* @returns The normalised field.
 */
-function useHandbookDocument() {
-	let $ = c(7), t0;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = { apiVersion: "2026-01-01" }, $[0] = t0) : t0 = $[0];
-	let client = useClient(t0), [handbook, setHandbook] = useState(void 0), [loading, setLoading] = useState(!0), t1, t2;
-	$[1] === client ? (t1 = $[2], t2 = $[3]) : (t1 = () => {
-		let fetchHandbook = async function fetchHandbook() {
-			setHandbook(await fetchQuery(client, handbookQuery)), setLoading(!1);
-		};
-		fetchHandbook();
-		let subscription = client.listen(handbookDocumentsQuery).subscribe(() => {
-			fetchHandbook();
-		});
-		return () => {
-			subscription.unsubscribe();
+function normalizeField(field, visited = /* @__PURE__ */ new Set()) {
+	if (isCompiledField(field)) {
+		let typeName = field.type.name, result = {
+			name: field.name,
+			type: typeName,
+			title: field.title ?? field.type.title,
+			description: field.description ?? field.type.description,
+			handbook: field.handbook
 		};
-	}, t2 = [client], $[1] = client, $[2] = t1, $[3] = t2), useEffect(t1, t2);
-	let t3;
-	return $[4] !== handbook || $[5] !== loading ? (t3 = {
-		handbook,
-		loading
-	}, $[4] = handbook, $[5] = loading, $[6] = t3) : t3 = $[6], t3;
+		if (!visited.has(typeName)) {
+			let next = !opaqueTypes.has(typeName) && typeName !== "object" && typeName !== "array" ? /* @__PURE__ */ new Set([...visited, typeName]) : visited, fieldSource = hasFieldsArray(field) ? field : field.type, ofSource = hasOfArray(field) ? field : field.type;
+			hasFieldsArray(fieldSource) && (result.fields = fieldSource.fields.map((subfield) => normalizeField(subfield, next))), hasOfArray(ofSource) && (result.of = ofSource.of.map((member) => normalizeField(member, next)));
+		}
+		return result;
+	}
+	return field;
 }
-const HandbookContext = createContext(void 0);
 /**
-* Accesses the Handbook context for tab state and plugin configuration.
+* Lists the fields a custom type adds to an opaque base type, leaving out the base type's own.
 *
-* @returns The resolved plugin configuration alongside the state the panes share.
-* @throws {Error} If used outside the provider.
+* @param resolvedType - The compiled or normalised schema type.
+* @param parentName - The opaque base type's name.
+* @returns The custom fields, or undefined when there are none.
 */
-function useHandbookContext() {
-	let handbookContext = useContext(HandbookContext);
-	if (!isDefined(handbookContext)) throw Error("useHandbookContext can only be used within <HandbookProvider>");
-	return handbookContext;
+function resolveCustomFields(resolvedType, parentName) {
+	if (!hasFieldsArray(resolvedType)) return;
+	let inherited = inheritedFieldNames[parentName], customFields = resolvedType.fields.map((field) => normalizeField(field)).filter((field) => !isDefined(inherited) || !inherited.has(field.name));
+	return isDefined(customFields) ? customFields : void 0;
 }
 /**
-* Provides the tab state the sidebar and content panes share, alongside the plugin configuration and
-* the handbook singleton fetched from the dataset.
+* Normalises a list of raw fields.
 *
-* @param props - Configuration from the plugin, and the tool to provide it to.
-* @returns The provider wrapping its children.
+* @param items - The raw fields.
+* @returns The normalised fields, or undefined when there are none.
 */
-function HandbookProvider(t0) {
-	let $ = c(12), { sidebarTitle, roles, blocks, undocumentedFieldMessage, children } = t0, [activeTab, setActiveTab] = useState(void 0), [sidebarExpanded, setSidebarExpanded] = useState(!0), { handbook, loading } = useHandbookDocument(), t1;
-	$[0] !== activeTab || $[1] !== blocks || $[2] !== handbook || $[3] !== loading || $[4] !== roles || $[5] !== sidebarExpanded || $[6] !== sidebarTitle || $[7] !== undocumentedFieldMessage ? (t1 = {
-		sidebarTitle,
-		roles,
-		blocks,
-		undocumentedFieldMessage,
-		activeTab,
-		sidebarExpanded,
-		loading,
-		handbook,
-		setActiveTab,
-		setSidebarExpanded
-	}, $[0] = activeTab, $[1] = blocks, $[2] = handbook, $[3] = loading, $[4] = roles, $[5] = sidebarExpanded, $[6] = sidebarTitle, $[7] = undocumentedFieldMessage, $[8] = t1) : t1 = $[8];
-	let t2;
-	return $[9] !== children || $[10] !== t1 ? (t2 = /* @__PURE__ */ jsx(HandbookContext, {
-		value: t1,
-		children
-	}), $[9] = children, $[10] = t1, $[11] = t2) : t2 = $[11], t2;
+function resolveNormalizedFields(items) {
+	let normalized = items.map((item) => normalizeField(item));
+	return isDefined(normalized) ? normalized : void 0;
 }
-function PaneHeader(t0) {
-	let $ = c(46), backButton, props, style, title;
-	$[0] === t0 ? (backButton = $[1], props = $[2], style = $[3], title = $[4]) : ({title, backButton, style, ...props} = t0, $[0] = t0, $[1] = backButton, $[2] = props, $[3] = style, $[4] = title);
-	let { color } = useTheme_v2(), pane = useContext(PaneContext), paneSize = useElementSize(pane?.rootElement ?? null), collapsed = pane?.collapsed ?? !1, isLast = pane?.isLast ?? !1, paneHeight = paneSize?.border.height ?? 0, collapsedWidth = paneHeight > 0 ? paneHeight : window.innerHeight, { bg, fg } = color.selectable.default.enabled, t1;
-	$[5] !== collapsed || $[6] !== pane ? (t1 = function handleTitleClick() {
-		collapsed || pane?.collapse();
-	}, $[5] = collapsed, $[6] = pane, $[7] = t1) : t1 = $[7];
-	let handleTitleClick = t1, t2;
-	$[8] !== collapsed || $[9] !== pane ? (t2 = function handleLayoutClick() {
-		collapsed && pane?.expand();
-	}, $[8] = collapsed, $[9] = pane, $[10] = t2) : t2 = $[10];
-	let handleLayoutClick = t2, t3 = collapsed ? "" : void 0, t4;
-	$[11] === style ? t4 = $[12] : (t4 = {
-		lineHeight: 0,
-		position: "sticky",
-		top: 0,
-		...style
-	}, $[11] = style, $[12] = t4);
-	let t5 = collapsed ? "" : void 0, t6 = collapsed ? collapsedWidth : void 0, t7 = collapsed ? "rotate(90deg)" : void 0, t8;
-	$[13] !== t6 || $[14] !== t7 ? (t8 = {
-		width: t6,
-		transform: t7,
-		transformOrigin: "calc(51px / 2)"
-	}, $[13] = t6, $[14] = t7, $[15] = t8) : t8 = $[15];
-	let t9;
-	$[16] === backButton ? t9 = $[17] : (t9 = isDefined(backButton) && /* @__PURE__ */ jsx(Box, {
-		flex: "none",
-		children: backButton
-	}), $[16] = backButton, $[17] = t9);
-	let t10 = isDefined(backButton) ? 1 : 2, t11 = isLast && !collapsed ? -1 : 0, t12;
-	$[18] === bg ? t12 = $[19] : (t12 = {
-		backgroundColor: bg,
-		minWidth: 0
-	}, $[18] = bg, $[19] = t12);
-	let t13;
-	$[20] === fg ? t13 = $[21] : (t13 = {
-		color: fg,
-		cursor: "default",
-		minWidth: 0,
-		outline: "none"
-	}, $[20] = fg, $[21] = t13);
-	let t14;
-	$[22] !== t13 || $[23] !== title ? (t14 = /* @__PURE__ */ jsx(Flex, {
-		align: "center",
-		gap: 1,
-		children: /* @__PURE__ */ jsx(Text, {
-			size: 1,
-			textOverflow: "ellipsis",
-			weight: "semibold",
-			style: t13,
-			children: title
-		})
-	}), $[22] = t13, $[23] = title, $[24] = t14) : t14 = $[24];
-	let t15;
-	$[25] !== handleTitleClick || $[26] !== t10 || $[27] !== t11 || $[28] !== t12 || $[29] !== t14 ? (t15 = /* @__PURE__ */ jsx(Card, {
-		flex: 1,
-		onClick: handleTitleClick,
-		padding: 2,
-		paddingLeft: t10,
-		tabIndex: t11,
-		style: t12,
-		__unstable_focusRing: !0,
-		children: t14
-	}), $[25] = handleTitleClick, $[26] = t10, $[27] = t11, $[28] = t12, $[29] = t14, $[30] = t15) : t15 = $[30];
-	let t16;
-	$[31] !== t15 || $[32] !== t9 ? (t16 = /* @__PURE__ */ jsxs(Flex, {
-		align: "flex-start",
-		gap: 3,
-		children: [t9, t15]
-	}), $[31] = t15, $[32] = t9, $[33] = t16) : t16 = $[33];
-	let t17;
-	$[34] !== handleLayoutClick || $[35] !== t16 || $[36] !== t8 ? (t17 = /* @__PURE__ */ jsx(Flex, {
-		direction: "column",
-		gap: 3,
-		onClick: handleLayoutClick,
-		padding: 3,
-		sizing: "border",
-		style: t8,
-		children: t16
-	}), $[34] = handleLayoutClick, $[35] = t16, $[36] = t8, $[37] = t17) : t17 = $[37];
-	let t18;
-	$[38] !== t17 || $[39] !== t5 ? (t18 = /* @__PURE__ */ jsx(Card, {
-		tone: "inherit",
-		"data-collapsed": t5,
-		children: t17
-	}), $[38] = t17, $[39] = t5, $[40] = t18) : t18 = $[40];
-	let t19;
-	return $[41] !== props || $[42] !== t18 || $[43] !== t3 || $[44] !== t4 ? (t19 = /* @__PURE__ */ jsx(LayerProvider, {
-		zOffset: 100,
-		children: /* @__PURE__ */ jsx(Layer, {
-			"data-collapsed": t3,
-			style: t4,
-			...props,
-			children: t18
-		})
-	}), $[41] = props, $[42] = t18, $[43] = t3, $[44] = t4, $[45] = t19) : t19 = $[45], t19;
-}
-function ContentPanel(t0) {
-	let $ = c(31), children, description, id, props, title;
-	$[0] === t0 ? (children = $[1], description = $[2], id = $[3], props = $[4], title = $[5]) : ({id, title, description, children, ...props} = t0, $[0] = t0, $[1] = children, $[2] = description, $[3] = id, $[4] = props, $[5] = title);
-	let { setSidebarExpanded } = useHandbookContext(), paneLayout = useContext(PaneLayoutContext), t1;
-	$[6] !== paneLayout?.collapsed || $[7] !== setSidebarExpanded ? (t1 = paneLayout?.collapsed === !0 && /* @__PURE__ */ jsx(Button, {
-		"aria-label": "Back",
-		icon: ArrowLeftIcon,
-		mode: "bleed",
-		onClick: () => {
-			setSidebarExpanded(!0);
-		}
-	}), $[6] = paneLayout?.collapsed, $[7] = setSidebarExpanded, $[8] = t1) : t1 = $[8];
-	let t2;
-	$[9] !== t1 || $[10] !== title ? (t2 = /* @__PURE__ */ jsx(PaneHeader, {
-		title,
-		backButton: t1
-	}), $[9] = t1, $[10] = title, $[11] = t2) : t2 = $[11];
-	let t3 = `panel-${id}`, t4;
-	$[12] === Symbol.for("react.memo_cache_sentinel") ? (t4 = {
-		maxWidth: 640,
-		boxSizing: "border-box",
-		marginInline: "auto",
-		paddingInline: 20,
-		paddingBlockStart: 32,
-		paddingBlockEnd: 220
-	}, $[12] = t4) : t4 = $[12];
-	let t5;
-	$[13] === title ? t5 = $[14] : (t5 = /* @__PURE__ */ jsx(Heading, {
-		as: "h2",
-		size: 4,
-		children: title
-	}), $[13] = title, $[14] = t5);
-	let t6;
-	$[15] === description ? t6 = $[16] : (t6 = isDefined(description) && /* @__PURE__ */ jsx(Text, {
-		size: 1,
-		muted: !0,
-		children: description
-	}), $[15] = description, $[16] = t6);
-	let t7;
-	$[17] !== t5 || $[18] !== t6 ? (t7 = /* @__PURE__ */ jsxs(Stack, {
-		marginBottom: 6,
-		gap: 5,
-		children: [t5, t6]
-	}), $[17] = t5, $[18] = t6, $[19] = t7) : t7 = $[19];
-	let t8;
-	$[20] !== children || $[21] !== t7 ? (t8 = /* @__PURE__ */ jsxs(Box, {
-		style: t4,
-		children: [t7, children]
-	}), $[20] = children, $[21] = t7, $[22] = t8) : t8 = $[22];
-	let t9;
-	$[23] !== id || $[24] !== props || $[25] !== t3 || $[26] !== t8 ? (t9 = /* @__PURE__ */ jsx(PaneContent, {
-		id: t3,
-		"aria-labelledby": id,
-		overflow: "auto",
-		...props,
-		children: t8
-	}), $[23] = id, $[24] = props, $[25] = t3, $[26] = t8, $[27] = t9) : t9 = $[27];
-	let t10;
-	return $[28] !== t2 || $[29] !== t9 ? (t10 = /* @__PURE__ */ jsxs(Fragment, { children: [t2, t9] }), $[28] = t2, $[29] = t9, $[30] = t10) : t10 = $[30], t10;
-}
-function FieldHint(t0) {
-	let $ = c(33), children, icon, label, onClose, onOpen, open, props;
-	$[0] === t0 ? (children = $[1], icon = $[2], label = $[3], onClose = $[4], onOpen = $[5], open = $[6], props = $[7]) : ({label, icon, open, children, onOpen, onClose, ...props} = t0, $[0] = t0, $[1] = children, $[2] = icon, $[3] = label, $[4] = onClose, $[5] = onOpen, $[6] = open, $[7] = props);
-	let buttonReference = useRef(null), popoverReference = useRef(null), t1;
-	$[8] === Symbol.for("react.memo_cache_sentinel") ? (t1 = () => [buttonReference.current, popoverReference.current], $[8] = t1) : t1 = $[8], useClickOutsideEvent(open ? onClose : void 0, t1);
-	let t2;
-	$[9] === Symbol.for("react.memo_cache_sentinel") ? (t2 = { maxWidth: 280 }, $[9] = t2) : t2 = $[9];
-	let t3;
-	$[10] === label ? t3 = $[11] : (t3 = /* @__PURE__ */ jsx(Text, {
-		size: 1,
-		weight: "semibold",
-		children: label
-	}), $[10] = label, $[11] = t3);
-	let t4;
-	$[12] === children ? t4 = $[13] : (t4 = /* @__PURE__ */ jsx(Text, {
-		size: 1,
-		muted: !0,
-		children
-	}), $[12] = children, $[13] = t4);
-	let t5;
-	$[14] !== t3 || $[15] !== t4 ? (t5 = /* @__PURE__ */ jsx("div", {
-		ref: popoverReference,
-		children: /* @__PURE__ */ jsx(Box, {
-			padding: 3,
-			style: t2,
-			children: /* @__PURE__ */ jsxs(Stack, {
-				gap: 3,
-				children: [t3, t4]
-			})
-		})
-	}), $[14] = t3, $[15] = t4, $[16] = t5) : t5 = $[16];
-	let t6 = open ? onClose : onOpen, t7;
-	$[17] === onOpen ? t7 = $[18] : (t7 = (event) => {
-		event.pointerType === "mouse" && onOpen();
-	}, $[17] = onOpen, $[18] = t7);
-	let t8;
-	$[19] === onClose ? t8 = $[20] : (t8 = (event_0) => {
-		event_0.pointerType === "mouse" && onClose();
-	}, $[19] = onClose, $[20] = t8);
-	let t9;
-	$[21] === Symbol.for("react.memo_cache_sentinel") ? (t9 = {
-		display: "flex",
-		alignItems: "center",
-		padding: 2,
-		fontSize: 16,
-		color: "var(--card-icon-color)",
-		background: "none",
-		border: "none",
-		cursor: "pointer"
-	}, $[21] = t9) : t9 = $[21];
-	let t10;
-	$[22] !== icon || $[23] !== label || $[24] !== t6 || $[25] !== t7 || $[26] !== t8 ? (t10 = /* @__PURE__ */ jsx("button", {
-		ref: buttonReference,
-		"aria-label": label,
-		type: "button",
-		onClick: t6,
-		onPointerEnter: t7,
-		onPointerLeave: t8,
-		style: t9,
-		children: icon
-	}), $[22] = icon, $[23] = label, $[24] = t6, $[25] = t7, $[26] = t8, $[27] = t10) : t10 = $[27];
-	let t11;
-	return $[28] !== open || $[29] !== props || $[30] !== t10 || $[31] !== t5 ? (t11 = /* @__PURE__ */ jsx(Popover, {
-		open,
-		placement: "top",
-		portal: !0,
-		radius: 2,
-		shadow: 2,
-		content: t5,
-		...props,
-		children: t10
-	}), $[28] = open, $[29] = props, $[30] = t10, $[31] = t5, $[32] = t11) : t11 = $[32], t11;
-}
-/** Hint kinds a field can carry, in the order they are displayed. */
-const hintKinds = [
-	{
-		name: "tip",
-		label: "Tip",
-		icon: LightbulbIcon
-	},
-	{
-		name: "info",
-		label: "Information",
-		icon: InfoIcon
-	},
-	{
-		name: "caution",
-		label: "Caution",
-		icon: TriangleAlertIcon
-	}
-];
-function FieldHints(t0) {
-	let $ = c(22), caution, info, props, tip;
-	$[0] === t0 ? (caution = $[1], info = $[2], props = $[3], tip = $[4]) : ({tip, info, caution, ...props} = t0, $[0] = t0, $[1] = caution, $[2] = info, $[3] = props, $[4] = tip);
-	let [openHint, setOpenHint] = useState(void 0), T0, t1, t2, t3, t4;
-	if ($[5] !== caution || $[6] !== info || $[7] !== openHint || $[8] !== props || $[9] !== tip) {
-		let hints = {
-			tip,
-			info,
-			caution
-		}, t5;
-		$[15] === Symbol.for("react.memo_cache_sentinel") ? (t5 = function closeHint() {
-			setOpenHint(void 0);
-		}, $[15] = t5) : t5 = $[15];
-		let closeHint = t5;
-		T0 = Flex, t1 = "center", t2 = 2, t3 = props, t4 = hintKinds.flatMap((t6) => {
-			let { name, label, icon: Icon } = t6, hint = hints[name];
-			return isDefined(hint) ? /* @__PURE__ */ jsx(FieldHint, {
-				label,
-				icon: /* @__PURE__ */ jsx(Icon, { ...defaultIconProps }),
-				open: openHint === name,
-				onOpen: () => {
-					setOpenHint(name);
-				},
-				onClose: closeHint,
-				children: hint
-			}, name) : [];
-		}), $[5] = caution, $[6] = info, $[7] = openHint, $[8] = props, $[9] = tip, $[10] = T0, $[11] = t1, $[12] = t2, $[13] = t3, $[14] = t4;
-	} else T0 = $[10], t1 = $[11], t2 = $[12], t3 = $[13], t4 = $[14];
-	let t5;
-	return $[16] !== T0 || $[17] !== t1 || $[18] !== t2 || $[19] !== t3 || $[20] !== t4 ? (t5 = /* @__PURE__ */ jsx(T0, {
-		align: t1,
-		gap: t2,
-		...t3,
-		children: t4
-	}), $[16] = T0, $[17] = t1, $[18] = t2, $[19] = t3, $[20] = t4, $[21] = t5) : t5 = $[21], t5;
+/**
+* Normalises array members, leaving out opaque types.
+*
+* @param members - The raw array members.
+* @returns The normalised members, or undefined when there are none.
+*/
+function resolveNormalizedMembers(members) {
+	let normalized = members.map((member) => normalizeField(member)).filter((member) => !opaqueTypes.has(member.type));
+	return isDefined(normalized) ? normalized : void 0;
 }
 /**
-* Resolves the label shown for a schema type, preferring Handbook metadata over the schema's own
-* title and falling back to a title-cased name.
+* Works out a value's parent type name, looking it up in the schema when the value only names its type.
 *
-* @param type - The schema type or field to resolve a label for.
-* @returns The label.
+* @param value - The value.
+* @param schema - The Sanity schema.
+* @returns The parent type name, or undefined when there isn't one.
 */
-function resolveTitle(type) {
-	let { name, title, handbook } = type;
-	return handbook?.title ?? title ?? convertCase(name, "title");
+function resolveParentName(value, schema) {
+	let direct = getParentTypeName(value);
+	if (isDefined(direct)) return direct;
+	let typeName = getTypeName(value);
+	if (!isDefined(typeName)) return;
+	let resolvedType = schema.get(typeName);
+	return isDefined(resolvedType) ? getParentTypeName(resolvedType) : void 0;
 }
 /**
-* Resolves the description shown for a schema type, preferring Handbook metadata and ignoring the
-* non-string descriptions a schema may carry.
+* Works out the fields a value shows, whether it holds them directly, has array members that do, or
+* names a type that does.
 *
-* @param type - The schema type or field to resolve a description for.
-* @returns The description, or undefined when neither source provides one.
+* @param value - The value.
+* @param schema - The Sanity schema.
+* @returns The fields, or undefined when there are none.
 */
-function resolveDescription(type) {
-	let { description, handbook } = type;
-	return handbook?.description ?? (typeof description == "string" ? description : void 0);
+function resolveFields(value, schema) {
+	if (hasFieldsArray(value)) {
+		let parentName = resolveParentName(value, schema);
+		return isDefined(parentName) && opaqueTypes.has(parentName) ? resolveCustomFields(value, parentName) : resolveNormalizedFields(value.fields);
+	}
+	if (hasOfArray(value)) {
+		let members = value.of;
+		if (members.length === 1) {
+			let [member] = members, normalized = normalizeField(member);
+			if (opaqueTypes.has(normalized.type)) return;
+			if (hasFieldsArray(normalized)) {
+				let parentName = resolveParentName(normalized, schema);
+				return isDefined(parentName) && opaqueTypes.has(parentName) ? resolveCustomFields(normalized, parentName) : resolveNormalizedFields(normalized.fields);
+			}
+			let memberType = schema.get(normalized.type);
+			if (isDefined(memberType)) return resolveFields(memberType, schema);
+		}
+		return resolveNormalizedMembers(members);
+	}
 }
 /**
-* Narrows a schema type's icon to a renderable component, discarding the string form a schema may
-* carry instead. A consumer's icon is redrawn at the plugin's own weight, so it sits beside the
-* built-in ones rather than at its own library's default size.
+* Works out a field's visible subfields by looking through the schema.
 *
-* @param type - The schema type to read an icon from.
-* @returns The icon component, or undefined when none is set.
+* @param field - The field.
+* @param schema - The Sanity schema.
+* @returns The subfields, or undefined when there are none.
 */
-function resolveIcon(type) {
-	return typeof type.icon == "function" ? createSanityIcon(type.icon) : void 0;
+function getSubfields(field, schema) {
+	if (opaqueTypes.has(field.type)) return;
+	let directFields = resolveFields(field, schema);
+	if (isDefined(directFields)) return directFields;
+	let resolvedType = schema.get(field.type);
+	if (!isDefined(resolvedType)) return;
+	let parentName = getParentTypeName(resolvedType);
+	return isDefined(parentName) && opaqueTypes.has(parentName) ? resolveCustomFields(resolvedType, parentName) : resolveFields(resolvedType, schema);
 }
-/** Schema type names treated as leaf types whose subfields are not displayed. */
-const opaqueTypes = /* @__PURE__ */ new Set([
-	"block",
-	"boolean",
-	"crossDatasetReference",
-	"date",
-	"datetime",
-	"file",
-	"geopoint",
-	"image",
-	"number",
-	"reference",
-	"slug",
-	"string",
-	"text",
-	"url"
-]), inheritedFieldNames = {
-	block: /* @__PURE__ */ new Set([
-		"children",
-		"level",
-		"listItem",
-		"markDefs",
-		"style"
-	]),
-	file: /* @__PURE__ */ new Set(["asset", "media"]),
-	geopoint: /* @__PURE__ */ new Set([
-		"alt",
-		"lat",
-		"lng"
-	]),
-	image: /* @__PURE__ */ new Set([
-		"asset",
-		"crop",
-		"hotspot",
-		"media"
-	]),
-	slug: /* @__PURE__ */ new Set(["current", "source"])
-};
-/**
-* Checks whether a value is a compiled schema field with a nested type object.
-*
-* @param value - The value to check.
-* @returns True if the value is a compiled field.
-*/
-function isCompiledField(value) {
-	return typeof value != "object" || !value || !("name" in value) || !("type" in value) ? !1 : typeof value.type == "object" && value.type !== null;
-}
-/**
-* Checks whether a value has a `fields` array property.
-*
-* @param value - The value to check.
-* @returns True if the value contains a `fields` array.
-*/
-function hasFieldsArray(value) {
-	return typeof value != "object" || !value || !("fields" in value) ? !1 : Array.isArray(value.fields);
-}
-/**
-* Checks whether a value has an `of` array property.
-*
-* @param value - The value to check.
-* @returns True if the value contains an `of` array.
-*/
-function hasOfArray(value) {
-	return typeof value != "object" || !value || !("of" in value) ? !1 : Array.isArray(value.of);
-}
-/**
-* Extracts the type name a value declares, where it names one at all.
-*
-* @param value - The value to inspect.
-* @returns The type name, or undefined when the value declares none.
-*/
-function getTypeName(value) {
-	if (typeof value == "object" && value && "type" in value) return typeof value.type == "string" ? value.type : void 0;
-}
-/**
-* Extracts the parent type name from a compiled schema type, if present.
-*
-* @param resolvedType - The compiled schema type to inspect.
-* @returns The parent type name, or undefined when the type extends none.
-*/
-function getParentTypeName(resolvedType) {
-	if (typeof resolvedType == "object" && resolvedType && "type" in resolvedType && typeof resolvedType.type == "object" && resolvedType.type !== null && "name" in resolvedType.type) return String(resolvedType.type.name);
-}
-/**
-* Normalises a compiled schema field into the shape the Handbook renders. Type names already seen are
-* tracked so a type that refers back to itself does not recurse forever.
-*
-* @param field - A compiled schema field or plain field definition.
-* @param visited - Type names already seen in this normalisation chain.
-* @returns The normalised field.
-*/
-function normaliseField(field, visited = /* @__PURE__ */ new Set()) {
-	if (isCompiledField(field)) {
-		let typeName = field.type.name, result = {
-			name: field.name,
-			type: typeName,
-			title: field.title ?? field.type.title,
-			description: field.description ?? field.type.description,
-			handbook: field.handbook
-		};
-		if (!visited.has(typeName)) {
-			let next = !opaqueTypes.has(typeName) && typeName !== "object" && typeName !== "array" ? /* @__PURE__ */ new Set([...visited, typeName]) : visited, fieldSource = hasFieldsArray(field) ? field : field.type, ofSource = hasOfArray(field) ? field : field.type;
-			hasFieldsArray(fieldSource) && (result.fields = fieldSource.fields.map((subfield) => normaliseField(subfield, next))), hasOfArray(ofSource) && (result.of = ofSource.of.map((member) => normaliseField(member, next)));
-		}
-		return result;
-	}
-	return field;
-}
-/**
-* Resolves only the fields a custom type adds on top of an opaque base type, leaving out the ones the
-* base type contributes of its own accord.
-*
-* @param resolvedType - The compiled or normalised schema type.
-* @param parentName - The opaque base type name.
-* @returns The custom fields, or undefined when the type adds none.
-*/
-function resolveCustomFields(resolvedType, parentName) {
-	if (!hasFieldsArray(resolvedType)) return;
-	let inherited = inheritedFieldNames[parentName], customFields = resolvedType.fields.map((field) => normaliseField(field)).filter((field) => !isDefined(inherited) || !inherited.has(field.name));
-	return isDefined(customFields) ? customFields : void 0;
-}
-/**
-* Normalises a list of raw field values into the shape the Handbook renders.
-*
-* @param items - Raw field values to normalise.
-* @returns The normalised fields, or undefined when the list holds none.
-*/
-function resolveNormalisedFields(items) {
-	let normalised = items.map((item) => normaliseField(item));
-	return isDefined(normalised) ? normalised : void 0;
-}
-/**
-* Normalises array members and filters out opaque types that have no meaningful subfields.
-*
-* @param members - Raw array member values to normalise.
-* @returns The normalised non-opaque members, or undefined when none remain.
-*/
-function resolveNormalisedMembers(members) {
-	let normalised = members.map((member) => normaliseField(member)).filter((member) => !opaqueTypes.has(member.type));
-	return isDefined(normalised) ? normalised : void 0;
-}
-/**
-* Resolves the name of the type a value extends, reaching into the schema registry when the value
-* carries nothing but a type name of its own.
-*
-* @param value - The value to inspect.
-* @param schema - The Sanity schema registry.
-* @returns The parent type name, or undefined when the value extends none.
-*/
-function resolveParentName(value, schema) {
-	let direct = getParentTypeName(value);
-	if (isDefined(direct)) return direct;
-	let typeName = getTypeName(value);
-	if (!isDefined(typeName)) return;
-	let resolvedType = schema.get(typeName);
-	return isDefined(resolvedType) ? getParentTypeName(resolvedType) : void 0;
-}
-/**
-* Extracts the fields a value displays, whether it carries them directly, carries array members that
-* do, or names a type that does.
-*
-* @param value - The value to extract fields from.
-* @param schema - The Sanity schema registry.
-* @returns The resolved fields, or undefined when the value has none.
-*/
-function resolveFields(value, schema) {
-	if (hasFieldsArray(value)) {
-		let parentName = resolveParentName(value, schema);
-		return isDefined(parentName) && opaqueTypes.has(parentName) ? resolveCustomFields(value, parentName) : resolveNormalisedFields(value.fields);
-	}
-	if (hasOfArray(value)) {
-		let members = value.of;
-		if (members.length === 1) {
-			let [member] = members, normalised = normaliseField(member);
-			if (opaqueTypes.has(normalised.type)) return;
-			if (hasFieldsArray(normalised)) {
-				let parentName = resolveParentName(normalised, schema);
-				return isDefined(parentName) && opaqueTypes.has(parentName) ? resolveCustomFields(normalised, parentName) : resolveNormalisedFields(normalised.fields);
-			}
-			let memberType = schema.get(normalised.type);
-			if (isDefined(memberType)) return resolveFields(memberType, schema);
-		}
-		return resolveNormalisedMembers(members);
-	}
-}
-/**
-* Resolves the displayable subfields of a field definition by traversing the schema.
-*
-* @param field - The parent field definition.
-* @param schema - The Sanity schema registry.
-* @returns The non-opaque subfields, or undefined when the field has none.
-*/
-function getSubfields(field, schema) {
-	if (opaqueTypes.has(field.type)) return;
-	let directFields = resolveFields(field, schema);
-	if (isDefined(directFields)) return directFields;
-	let resolvedType = schema.get(field.type);
-	if (!isDefined(resolvedType)) return;
-	let parentName = getParentTypeName(resolvedType);
-	return isDefined(parentName) && opaqueTypes.has(parentName) ? resolveCustomFields(resolvedType, parentName) : resolveFields(resolvedType, schema);
-}
-/** Shared empty ancestor set, so the default prop keeps a stable reference across renders. */
+/** Shared empty set, so the default prop keeps the same reference between renders. */
 const noAncestors = /* @__PURE__ */ new Set();
-function Field(t0) {
+function DocumentedField(t0) {
 	let $ = c(59), field, props, t1;
 	$[0] === t0 ? (field = $[1], props = $[2], t1 = $[3]) : ({field, ancestors: t1, ...props} = t0, $[0] = t0, $[1] = field, $[2] = props, $[3] = t1);
 	let ancestors = t1 === void 0 ? noAncestors : t1, schema = useSchema(), { undocumentedFieldMessage } = useHandbookContext(), [expanded, setExpanded] = useState(!1), t2;
@@ -1865,7 +989,7 @@ function Field(t0) {
 							]
 						})]
 					})
-				}), expanded && /* @__PURE__ */ jsx("div", {
+				}), expanded && /* @__PURE__ */ jsx(Box, {
 					style: {
 						marginTop: 16,
 						marginBottom: 8,
@@ -1874,7 +998,7 @@ function Field(t0) {
 					},
 					children: /* @__PURE__ */ jsx(Stack, {
 						gap: 5,
-						children: subfields.map((subfield) => /* @__PURE__ */ jsx(Field, {
+						children: subfields.map((subfield) => /* @__PURE__ */ jsx(DocumentedField, {
 							field: subfield,
 							ancestors: /* @__PURE__ */ new Set([...ancestors, field.type])
 						}, subfield.name))
@@ -1886,10 +1010,10 @@ function Field(t0) {
 	return t6;
 }
 /**
-* Builds a section for each configured document role.
+* Builds a sidebar section for each document role.
 *
-* @param roles - Document roles from the plugin configuration.
-* @returns One section per role, holding an entry per document type.
+* @param roles - The configured document roles.
+* @returns One section per role, with an entry per document type.
 */
 function documentTypesSections(roles) {
 	return roles.map(({ title, documents }) => ({
@@ -1905,7 +1029,7 @@ function documentTypesSections(roles) {
 					flexDirection: "column",
 					gap: contentSpacing.section
 				},
-				children: document.fields.map((field) => /* @__PURE__ */ jsx(Field, { field }, field.name))
+				children: document.fields.map((field) => /* @__PURE__ */ jsx(DocumentedField, { field }, field.name))
 			})
 		}))
 	}));
@@ -2019,11 +1143,10 @@ function DocumentTypesOverview() {
 												align: "center",
 												gap: 2,
 												style: { marginLeft: "-4px" },
-												children: [isDefined(Icon) && /* @__PURE__ */ jsx("div", {
+												children: [isDefined(Icon) && /* @__PURE__ */ jsx(Flex, {
+													align: "center",
+													justify: "center",
 													style: {
-														display: "flex",
-														alignItems: "center",
-														justifyContent: "center",
 														width: 25,
 														height: 25,
 														color: "var(--card-icon-color)"
@@ -2066,11 +1189,11 @@ function DocumentTypesOverview() {
 		children: t1
 	}), $[8] = t1, $[9] = t2), t2;
 }
-/** What each hint kind signals to an editor, shown as a legend alongside its icon. */
+/** What each hint kind means, shown next to its icon as a key. */
 const hintDescriptions = {
-	tip: "Helpful tips and best practices for content editors.",
-	info: "Additional context about how the field is used.",
-	caution: "Important warnings about constraints or potential issues."
+	tip: "Tips and suggested practices for people editing content.",
+	info: "More detail about how and where the field is used.",
+	caution: "Warnings about restrictions or problems the field can cause."
 };
 function HowToUse() {
 	let $ = c(8), t0;
@@ -2093,7 +1216,7 @@ function HowToUse() {
 		}), /* @__PURE__ */ jsx(Text, {
 			size: 1,
 			muted: !0,
-			children: "The sidebar lists everything the Handbook holds: these introductory pages, then the document types you can create, grouped by the role they play on the site, and finally any guides your team has written. Selecting an entry opens it here."
+			children: "The sidebar lists everything in the Handbook: these introductory pages first, then the document types you can create, grouped by their role on the site, and then any guides your team has written. Select an entry to open it here."
 		})]
 	}), $[1] = t1) : t1 = $[1];
 	let t2;
@@ -2110,7 +1233,7 @@ function HowToUse() {
 		}), /* @__PURE__ */ jsx(Text, {
 			size: 1,
 			muted: !0,
-			children: "Selecting a document type lists its fields, each showing its name, the kind of value it holds, and what the field is for. The documentation is generated from the content model, so what you read always matches what you see while editing."
+			children: "Selecting a document type lists its fields, with each field’s name, the kind of value it holds, and what it’s for. This documentation is generated from the content model, so it always matches what you see in the editor."
 		})]
 	}), $[2] = t2) : t2 = $[2];
 	let t3, t4;
@@ -2125,7 +1248,7 @@ function HowToUse() {
 	}), t4 = /* @__PURE__ */ jsx(Text, {
 		size: 1,
 		muted: !0,
-		children: "Icons beside a field name carry the guidance that would crowd its description if written into it. Hover or click one to read what it says, and use the key below to tell the three kinds apart."
+		children: "Icons next to a field’s name hold extra guidance that would make its description too long. Hover over or click an icon to read it, and use the key below to see what each icon means."
 	}), $[3] = t3, $[4] = t4) : (t3 = $[3], t4 = $[4]);
 	let t5;
 	$[5] === Symbol.for("react.memo_cache_sentinel") ? (t5 = /* @__PURE__ */ jsxs(Stack, {
@@ -2136,7 +1259,7 @@ function HowToUse() {
 			/* @__PURE__ */ jsx(Stack, {
 				gap: 3,
 				marginTop: 2,
-				children: hintKinds.map(_temp$2)
+				children: hintKinds.map(_temp$3)
 			})
 		]
 	}), $[5] = t5) : t5 = $[5];
@@ -2154,7 +1277,7 @@ function HowToUse() {
 		}), /* @__PURE__ */ jsx(Text, {
 			size: 1,
 			muted: !0,
-			children: "Some fields hold subfields of their own, such as a content block pairing a heading with body text. A control beneath the description counts them and expands to show each one, documented exactly as a top-level field is."
+			children: "Some fields contain subfields, such as a content block with a heading and body text. A button below the description shows how many there are and expands to list them, each documented like any other field."
 		})]
 	}), $[6] = t6) : t6 = $[6];
 	let t7;
@@ -2178,22 +1301,21 @@ function HowToUse() {
 				}), /* @__PURE__ */ jsx(Text, {
 					size: 1,
 					muted: !0,
-					children: "Beneath the document types you may find guides, written by your team rather than generated from the content model. They carry what a field description cannot: house style, editorial process, and how all the pieces fit together."
+					children: "Below the document types, you may find guides written by your team rather than generated from the content model. They cover things a field description can’t, such as house style, editorial process, and how everything fits together."
 				})]
 			})
 		]
 	}), $[7] = t7) : t7 = $[7], t7;
 }
-function _temp$2(t0) {
+function _temp$3(t0) {
 	let { name, icon: Icon } = t0;
 	return /* @__PURE__ */ jsxs(Flex, {
 		align: "center",
 		gap: 3,
-		children: [/* @__PURE__ */ jsx("div", {
+		children: [/* @__PURE__ */ jsx(Flex, {
+			align: "center",
+			flex: "none",
 			style: {
-				display: "flex",
-				alignItems: "center",
-				flexShrink: 0,
 				fontSize: "16px",
 				color: "var(--card-icon-color)"
 			},
@@ -2206,9 +1328,9 @@ function _temp$2(t0) {
 	}, name);
 }
 /**
-* Builds the section holding the plugin's own introductory pages.
+* Builds the section for the plugin's introductory pages.
 *
-* @returns A single section listing the built-in pages, in the order they are shown.
+* @returns One section listing the built-in pages.
 */
 function gettingStartedSections() {
 	return [{
@@ -2216,18 +1338,89 @@ function gettingStartedSections() {
 		entries: [{
 			id: "how-to-use-this-handbook",
 			title: "How to use the Handbook",
-			description: "A guide to navigating the Handbook, reading the documentation for each field, and making sense of its examples, hints, and nested structure.",
+			description: "How to find your way around the Handbook, read the documentation for each field, and understand its examples, hints, and subfields.",
 			icon: createSanityIcon(BookTextIcon),
 			render: () => /* @__PURE__ */ jsx(HowToUse, {})
 		}, {
 			id: "document-types",
 			title: "Document Types",
-			description: "An overview of all document types, organised by role. Select a document type to view its fields, descriptions, and examples.",
+			description: "A list of every document type, grouped by role. Select a document type to see its fields, descriptions, and examples.",
 			icon: createSanityIcon(LayoutGridIcon),
 			render: () => /* @__PURE__ */ jsx(DocumentTypesOverview, {})
 		}]
 	}];
 }
+/** Icon and tone for each callout variant. */
+const presentation = {
+	tip: {
+		icon: LightbulbIcon,
+		tone: "positive"
+	},
+	info: {
+		icon: InfoIcon,
+		tone: "primary"
+	},
+	warning: {
+		icon: TriangleAlertIcon,
+		tone: "caution"
+	}
+};
+function CalloutContent(t0) {
+	let $ = c(17), children, props, variant;
+	$[0] === t0 ? (children = $[1], props = $[2], variant = $[3]) : ({variant, children, ...props} = t0, $[0] = t0, $[1] = children, $[2] = props, $[3] = variant);
+	let { icon: Icon, tone } = presentation[variant], t1;
+	$[4] === Symbol.for("react.memo_cache_sentinel") ? (t1 = {
+		marginTop: "-2px",
+		fontSize: "16px",
+		color: "var(--card-icon-color)"
+	}, $[4] = t1) : t1 = $[4];
+	let t2;
+	$[5] === Icon ? t2 = $[6] : (t2 = /* @__PURE__ */ jsx(Box, {
+		flex: "none",
+		style: t1,
+		children: /* @__PURE__ */ jsx(Icon, { ...defaultIconProps })
+	}), $[5] = Icon, $[6] = t2);
+	let t3;
+	$[7] === Symbol.for("react.memo_cache_sentinel") ? (t3 = { color: "var(--card-icon-color)" }, $[7] = t3) : t3 = $[7];
+	let t4;
+	$[8] === children ? t4 = $[9] : (t4 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		style: t3,
+		children
+	}), $[8] = children, $[9] = t4);
+	let t5;
+	$[10] !== t2 || $[11] !== t4 ? (t5 = /* @__PURE__ */ jsxs(Flex, {
+		align: "flex-start",
+		gap: 3,
+		children: [t2, t4]
+	}), $[10] = t2, $[11] = t4, $[12] = t5) : t5 = $[12];
+	let t6;
+	return $[13] !== props || $[14] !== t5 || $[15] !== tone ? (t6 = /* @__PURE__ */ jsx(Card, {
+		padding: 4,
+		radius: 2,
+		tone,
+		...props,
+		children: t5
+	}), $[13] = props, $[14] = t5, $[15] = tone, $[16] = t6) : t6 = $[16], t6;
+}
+function PortableCode(t0) {
+	let $ = c(8), props, style;
+	$[0] === t0 ? (props = $[1], style = $[2]) : ({style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style);
+	let t1;
+	$[3] === style ? t1 = $[4] : (t1 = {
+		paddingBlock: 2,
+		paddingInline: 4,
+		fontSize: "0.875em",
+		backgroundColor: "var(--card-code-bg-color)",
+		borderRadius: 2,
+		...style
+	}, $[3] = style, $[4] = t1);
+	let t2;
+	return $[5] !== props || $[6] !== t1 ? (t2 = /* @__PURE__ */ jsx("code", {
+		style: t1,
+		...props
+	}), $[5] = props, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
+}
 function PortableLink(t0) {
 	let $ = c(10), children, props, style;
 	$[0] === t0 ? (children = $[1], props = $[2], style = $[3]) : ({children, style, ...props} = t0, $[0] = t0, $[1] = children, $[2] = props, $[3] = style);
@@ -2245,7 +1438,7 @@ function PortableLink(t0) {
 		children
 	}), $[6] = children, $[7] = props, $[8] = t1, $[9] = t2) : t2 = $[9], t2;
 }
-/** Overrides for a callout body, which takes the card's own text styling and leaves paragraphs unwrapped. */
+/** Overrides for callout text, which uses the card's own text style and doesn't wrap paragraphs. */
 const components$1 = {
 	block: { normal: ({ children }) => /* @__PURE__ */ jsx(Fragment, { children }) },
 	marks: {
@@ -2277,6 +1470,30 @@ function CalloutBlock(t0) {
 		children: t2
 	}), $[8] = props, $[9] = t1, $[10] = t2, $[11] = value.variant, $[12] = t3) : t3 = $[12], t3;
 }
+function CodeContent(t0) {
+	let $ = c(14), code, language, props, style;
+	$[0] === t0 ? (code = $[1], language = $[2], props = $[3], style = $[4]) : ({code, language, style, ...props} = t0, $[0] = t0, $[1] = code, $[2] = language, $[3] = props, $[4] = style);
+	let t1;
+	$[5] === style ? t1 = $[6] : (t1 = {
+		overflowX: "auto",
+		...style
+	}, $[5] = style, $[6] = t1);
+	let t2;
+	$[7] !== code || $[8] !== language ? (t2 = /* @__PURE__ */ jsx(Code, {
+		size: 1,
+		language,
+		children: code
+	}), $[7] = code, $[8] = language, $[9] = t2) : t2 = $[9];
+	let t3;
+	return $[10] !== props || $[11] !== t1 || $[12] !== t2 ? (t3 = /* @__PURE__ */ jsx(Card, {
+		padding: 4,
+		radius: 2,
+		tone: "transparent",
+		style: t1,
+		...props,
+		children: t2
+	}), $[10] = props, $[11] = t1, $[12] = t2, $[13] = t3) : t3 = $[13], t3;
+}
 function CodeBlock(t0) {
 	let $ = c(11), props, style, value;
 	if ($[0] === t0 ? (props = $[1], style = $[2], value = $[3]) : ({value, style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style, $[3] = value), !isDefined(value.code)) return null;
@@ -2293,6 +1510,21 @@ function CodeBlock(t0) {
 		...props
 	}), $[6] = props, $[7] = t1, $[8] = value.code, $[9] = value.language, $[10] = t2) : t2 = $[10], t2;
 }
+function HorizontalRuleContent(t0) {
+	let $ = c(8), props, style;
+	$[0] === t0 ? (props = $[1], style = $[2]) : ({style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style);
+	let t1;
+	$[3] === style ? t1 = $[4] : (t1 = {
+		border: "none",
+		borderTop: "1px solid var(--card-border-color)",
+		...style
+	}, $[3] = style, $[4] = t1);
+	let t2;
+	return $[5] !== props || $[6] !== t1 ? (t2 = /* @__PURE__ */ jsx("hr", {
+		style: t1,
+		...props
+	}), $[5] = props, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
+}
 function HorizontalRuleBlock(t0) {
 	let $ = c(8), props, style;
 	if ($[0] !== t0) {
@@ -2310,32 +1542,104 @@ function HorizontalRuleBlock(t0) {
 		...props
 	}), $[5] = props, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
 }
-function ImageBlock(t0) {
-	let $ = c(12), props, style, value;
-	if ($[0] === t0 ? (props = $[1], style = $[2], value = $[3]) : ({value, style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style, $[3] = value), !isDefined(value.asset?.url)) return null;
+function Caption(t0) {
+	let $ = c(9), children, props;
+	$[0] === t0 ? (children = $[1], props = $[2]) : ({children, ...props} = t0, $[0] = t0, $[1] = children, $[2] = props);
 	let t1;
-	$[4] === style ? t1 = $[5] : (t1 = {
-		marginBlock: contentSpacing.media,
-		...style
-	}, $[4] = style, $[5] = t1);
+	$[3] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { fontStyle: "italic" }, $[3] = t1) : t1 = $[3];
 	let t2;
-	return $[6] !== props || $[7] !== t1 || $[8] !== value.alt || $[9] !== value.asset.url || $[10] !== value.caption ? (t2 = /* @__PURE__ */ jsx(ImageContent, {
-		url: value.asset.url,
-		alt: value.alt,
-		caption: value.caption,
+	$[4] === children ? t2 = $[5] : (t2 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		muted: !0,
 		style: t1,
-		...props
-	}), $[6] = props, $[7] = t1, $[8] = value.alt, $[9] = value.asset.url, $[10] = value.caption, $[11] = t2) : t2 = $[11], t2;
+		children
+	}), $[4] = children, $[5] = t2);
+	let t3;
+	return $[6] !== props || $[7] !== t2 ? (t3 = /* @__PURE__ */ jsx(Box, {
+		marginTop: 3,
+		...props,
+		children: t2
+	}), $[6] = props, $[7] = t2, $[8] = t3) : t3 = $[8], t3;
 }
-function VideoBlock(t0) {
-	let $ = c(11), props, style, value;
-	if ($[0] === t0 ? (props = $[1], style = $[2], value = $[3]) : ({value, style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style, $[3] = value), !isDefined(value.asset?.url)) return null;
-	let t1;
-	$[4] === style ? t1 = $[5] : (t1 = {
-		marginBlock: contentSpacing.media,
-		...style
-	}, $[4] = style, $[5] = t1);
-	let t2;
+function ImageContent(t0) {
+	let $ = c(15), alt, caption, props, url;
+	$[0] === t0 ? (alt = $[1], caption = $[2], props = $[3], url = $[4]) : ({url, alt, caption, ...props} = t0, $[0] = t0, $[1] = alt, $[2] = caption, $[3] = props, $[4] = url);
+	let t1 = alt ?? "", t2;
+	$[5] === Symbol.for("react.memo_cache_sentinel") ? (t2 = {
+		display: "block",
+		maxWidth: "100%",
+		borderRadius: 4
+	}, $[5] = t2) : t2 = $[5];
+	let t3;
+	$[6] !== t1 || $[7] !== url ? (t3 = /* @__PURE__ */ jsx("img", {
+		src: url,
+		alt: t1,
+		style: t2
+	}), $[6] = t1, $[7] = url, $[8] = t3) : t3 = $[8];
+	let t4;
+	$[9] === caption ? t4 = $[10] : (t4 = isDefined(caption) && /* @__PURE__ */ jsx(Caption, { children: caption }), $[9] = caption, $[10] = t4);
+	let t5;
+	return $[11] !== props || $[12] !== t3 || $[13] !== t4 ? (t5 = /* @__PURE__ */ jsxs("div", {
+		...props,
+		children: [t3, t4]
+	}), $[11] = props, $[12] = t3, $[13] = t4, $[14] = t5) : t5 = $[14], t5;
+}
+function ImageBlock(t0) {
+	let $ = c(12), props, style, value;
+	if ($[0] === t0 ? (props = $[1], style = $[2], value = $[3]) : ({value, style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style, $[3] = value), !isDefined(value.asset?.url)) return null;
+	let t1;
+	$[4] === style ? t1 = $[5] : (t1 = {
+		marginBlock: contentSpacing.media,
+		...style
+	}, $[4] = style, $[5] = t1);
+	let t2;
+	return $[6] !== props || $[7] !== t1 || $[8] !== value.alt || $[9] !== value.asset.url || $[10] !== value.caption ? (t2 = /* @__PURE__ */ jsx(ImageContent, {
+		url: value.asset.url,
+		alt: value.alt,
+		caption: value.caption,
+		style: t1,
+		...props
+	}), $[6] = props, $[7] = t1, $[8] = value.alt, $[9] = value.asset.url, $[10] = value.caption, $[11] = t2) : t2 = $[11], t2;
+}
+function VideoContent(t0) {
+	let $ = c(16), caption, props, url;
+	$[0] === t0 ? (caption = $[1], props = $[2], url = $[3]) : ({url, caption, ...props} = t0, $[0] = t0, $[1] = caption, $[2] = props, $[3] = url);
+	let t1;
+	$[4] === Symbol.for("react.memo_cache_sentinel") ? (t1 = {
+		display: "block",
+		maxWidth: "100%",
+		borderRadius: 4,
+		WebkitTransform: "translateZ(0)"
+	}, $[4] = t1) : t1 = $[4];
+	let t2 = caption ?? "Video", t3;
+	$[5] === t2 ? t3 = $[6] : (t3 = /* @__PURE__ */ jsx("track", {
+		kind: "captions",
+		label: t2
+	}), $[5] = t2, $[6] = t3);
+	let t4;
+	$[7] !== t3 || $[8] !== url ? (t4 = /* @__PURE__ */ jsx("video", {
+		src: url,
+		controls: !0,
+		style: t1,
+		children: t3
+	}), $[7] = t3, $[8] = url, $[9] = t4) : t4 = $[9];
+	let t5;
+	$[10] === caption ? t5 = $[11] : (t5 = isDefined(caption) && /* @__PURE__ */ jsx(Caption, { children: caption }), $[10] = caption, $[11] = t5);
+	let t6;
+	return $[12] !== props || $[13] !== t4 || $[14] !== t5 ? (t6 = /* @__PURE__ */ jsxs("div", {
+		...props,
+		children: [t4, t5]
+	}), $[12] = props, $[13] = t4, $[14] = t5, $[15] = t6) : t6 = $[15], t6;
+}
+function VideoBlock(t0) {
+	let $ = c(11), props, style, value;
+	if ($[0] === t0 ? (props = $[1], style = $[2], value = $[3]) : ({value, style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style, $[3] = value), !isDefined(value.asset?.url)) return null;
+	let t1;
+	$[4] === style ? t1 = $[5] : (t1 = {
+		marginBlock: contentSpacing.media,
+		...style
+	}, $[4] = style, $[5] = t1);
+	let t2;
 	return $[6] !== props || $[7] !== t1 || $[8] !== value.asset.url || $[9] !== value.caption ? (t2 = /* @__PURE__ */ jsx(VideoContent, {
 		url: value.asset.url,
 		caption: value.caption,
@@ -2343,6 +1647,41 @@ function VideoBlock(t0) {
 		...props
 	}), $[6] = props, $[7] = t1, $[8] = value.asset.url, $[9] = value.caption, $[10] = t2) : t2 = $[10], t2;
 }
+function PortableBlockquote(t0) {
+	let $ = c(15), children, muted, props, style;
+	$[0] === t0 ? (children = $[1], muted = $[2], props = $[3], style = $[4]) : ({muted, children, style, ...props} = t0, $[0] = t0, $[1] = children, $[2] = muted, $[3] = props, $[4] = style);
+	let t1;
+	$[5] === style ? t1 = $[6] : (t1 = {
+		borderLeft: "2px solid var(--card-border-color)",
+		...style
+	}, $[5] = style, $[6] = t1);
+	let t2;
+	$[7] === Symbol.for("react.memo_cache_sentinel") ? (t2 = { fontStyle: "italic" }, $[7] = t2) : t2 = $[7];
+	let t3;
+	$[8] !== children || $[9] !== muted ? (t3 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		muted,
+		style: t2,
+		children
+	}), $[8] = children, $[9] = muted, $[10] = t3) : t3 = $[10];
+	let t4;
+	return $[11] !== props || $[12] !== t1 || $[13] !== t3 ? (t4 = /* @__PURE__ */ jsx(Box, {
+		paddingY: 1,
+		paddingLeft: 3,
+		style: t1,
+		...props,
+		children: t3
+	}), $[11] = props, $[12] = t1, $[13] = t3, $[14] = t4) : t4 = $[14], t4;
+}
+function PortableHeading(props) {
+	let $ = c(2), t0;
+	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Text, {
+		as: "h2",
+		size: 1,
+		weight: "medium",
+		...props
+	}), $[0] = props, $[1] = t0), t0;
+}
 function PortableList(t0) {
 	let $ = c(12), props, style, t1;
 	$[0] === t0 ? (props = $[1], style = $[2], t1 = $[3]) : ({ordered: t1, style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style, $[3] = t1);
@@ -2369,19 +1708,25 @@ function PortableList(t0) {
 		...props
 	}), $[9] = listStyle, $[10] = props, $[11] = t3) : t3 = $[11], t3;
 }
+function PortableParagraph(props) {
+	let $ = c(2), t0;
+	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		...props
+	}), $[0] = props, $[1] = t0), t0;
+}
 /**
-* Resolves the space around a list, which tightens once the list is nested inside another.
+* Works out the vertical space around a list, which is smaller for nested lists.
 *
-* @param level - Nesting depth of the list, counted from one.
-* @returns The vertical space in pixels.
+* @param level - Nesting depth, starting at 1.
+* @returns The space in pixels.
 */
 function listSpacing(level) {
 	return level > 1 ? contentSpacing.nestedList : contentSpacing.list;
 }
 /**
-* Component rendered for each block style, mark, and embedded type a guide's rich text can hold.
-* The marks and list items left out are deliberate — the library's own defaults already render them
-* as the surrounding text.
+* Components for each block style, mark, and embedded type in a guide. Marks and list items not listed
+* here are left to the library's defaults on purpose.
 */
 const components = {
 	block: {
@@ -2427,10 +1772,10 @@ const components = {
 	}
 };
 /**
-* Adapts a block component to what Portable Text renders an embedded type with, narrowing the props
-* to the block's own value. The rendering props the library also passes would otherwise reach the DOM.
+* Wraps a block component for Portable Text, passing only the block's value. Otherwise the library's
+* other props would reach the DOM.
 *
-* @param Component - Component rendering the block.
+* @param Component - The block component.
 * @returns A component Portable Text can render the type with.
 */
 function blockRenderer(Component) {
@@ -2479,11 +1824,36 @@ function PortableText$1(t0) {
 		children: t7
 	}), $[15] = props, $[16] = t7, $[17] = t8) : t8 = $[17], t8;
 }
+function BookOpenTextIcon(props) {
+	let $ = c(8), t0, t1, t2, t3, t4, t5;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M12 7v14" }), t1 = /* @__PURE__ */ jsx("path", { d: "M16 12h2" }), t2 = /* @__PURE__ */ jsx("path", { d: "M16 8h2" }), t3 = /* @__PURE__ */ jsx("path", { d: "M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z" }), t4 = /* @__PURE__ */ jsx("path", { d: "M6 12h2" }), t5 = /* @__PURE__ */ jsx("path", { d: "M6 8h2" }), $[0] = t0, $[1] = t1, $[2] = t2, $[3] = t3, $[4] = t4, $[5] = t5) : (t0 = $[0], t1 = $[1], t2 = $[2], t3 = $[3], t4 = $[4], t5 = $[5]);
+	let t6;
+	return $[6] === props ? t6 = $[7] : (t6 = /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [
+			t0,
+			t1,
+			t2,
+			t3,
+			t4,
+			t5
+		]
+	}), $[6] = props, $[7] = t6), t6;
+}
 /**
-* Builds a section for each guide group authored in the dataset.
+* Builds a sidebar section for each guide group.
 *
-* @param handbook - Handbook singleton holding the authored guide groups.
-* @returns One section per group, holding an entry per guide.
+* @param handbook - The Handbook document.
+* @returns One section per group, with an entry per guide.
 */
 function guidesSections(handbook) {
 	return handbook.groups.map(({ title, guides }) => ({
@@ -2498,9 +1868,9 @@ function guidesSections(handbook) {
 	}));
 }
 /**
-* Composes every page the Handbook shows, in sidebar order.
+* Lists every page in the Handbook, in sidebar order.
 *
-* @returns Sections from the built-in pages, the configured document roles, and the authored guides.
+* @returns The built-in pages, the configured document roles, and the guide groups, as sections.
 */
 function useSections() {
 	let $ = c(4), { roles, handbook, loading } = useHandbookContext(), t0;
@@ -2518,7 +1888,7 @@ function Content(props) {
 			let { id } = t6;
 			return id === activeTab;
 		}, $[9] = activeTab, $[10] = t5);
-		let entry = sections.flatMap(_temp$1).find(t5);
+		let entry = sections.flatMap(_temp$2).find(t5);
 		T0 = Pane, t0 = "handbook-content", t1 = 2.5, t2 = 320, t3 = props, t4 = isDefined(entry) && /* @__PURE__ */ jsx(ContentPanel, {
 			id: entry.id,
 			title: entry.title,
@@ -2535,7 +1905,7 @@ function Content(props) {
 		children: t4
 	}), $[11] = T0, $[12] = t0, $[13] = t1, $[14] = t2, $[15] = t3, $[16] = t4, $[17] = t5) : t5 = $[17], t5;
 }
-function _temp$1(section) {
+function _temp$2(section) {
 	return section.entries;
 }
 function SidebarHeading(t0) {
@@ -2614,9 +1984,16 @@ function SidebarTab(t0) {
 		children: t6
 	}), $[17] = id, $[18] = props, $[19] = selected, $[20] = t1, $[21] = t2, $[22] = t3, $[23] = t6, $[24] = t7) : t7 = $[24], t7;
 }
+function renderItem(item) {
+	return item.type === "heading" ? /* @__PURE__ */ jsx(SidebarHeading, { title: item.title }) : /* @__PURE__ */ jsx(SidebarTab, {
+		id: item.id,
+		label: item.label,
+		icon: item.icon
+	});
+}
 function Sidebar(props) {
 	let $ = c(14), { sidebarTitle } = useHandbookContext(), sections = useSections(), t0;
-	$[0] === sections ? t0 = $[1] : (t0 = sections.flatMap(_temp2), $[0] = sections, $[1] = t0);
+	$[0] === sections ? t0 = $[1] : (t0 = sections.flatMap(_temp2$1), $[0] = sections, $[1] = t0);
 	let items = t0, t1;
 	$[2] === items ? t1 = $[3] : (t1 = function getItemDisabled(virtualIndex) {
 		return items[virtualIndex]?.type === "heading";
@@ -2636,7 +2013,7 @@ function Sidebar(props) {
 			onlyShowSelectionWhenActive: !0,
 			paddingBottom: 1,
 			paddingX: 3,
-			renderItem: _temp3,
+			renderItem,
 			wrapAround: !1
 		})
 	}), $[6] = getItemDisabled, $[7] = items, $[8] = sidebarTitle, $[9] = t3) : t3 = $[9];
@@ -2650,21 +2027,14 @@ function Sidebar(props) {
 		children: [t2, t3]
 	}), $[10] = props, $[11] = t2, $[12] = t3, $[13] = t4) : t4 = $[13], t4;
 }
-function _temp3(item) {
-	return item.type === "heading" ? /* @__PURE__ */ jsx(SidebarHeading, { title: item.title }) : /* @__PURE__ */ jsx(SidebarTab, {
-		id: item.id,
-		label: item.label,
-		icon: item.icon
-	});
-}
-function _temp2(t0) {
+function _temp2$1(t0) {
 	let { title, entries } = t0;
 	return [{
 		type: "heading",
 		title
-	}, ...entries.map(_temp)];
+	}, ...entries.map(_temp$1)];
 }
-function _temp(entry) {
+function _temp$1(entry) {
 	return {
 		type: "tab",
 		id: entry.id,
@@ -2719,47 +2089,722 @@ function HandbookTool(t0) {
 		children: t7
 	}), $[7] = options, $[8] = t7, $[9] = t8) : t8 = $[9], t8;
 }
-/** Editors the plugin was configured with, so the Structure helper need not be handed them a second time. */
+/** Editors from the plugin configuration, so the structure helper doesn't need them passed again. */
 let configuredEditors;
 /**
-* Records the editors a plugin instance was configured with. A Studio running more than one workspace
-* keeps only the list from the workspace configured last, so those cases pass the list explicitly.
+* Stores the editors from the plugin configuration. A Studio with several workspaces keeps only the last
+* workspace's list, so pass the list explicitly there.
 *
-* @param editors - Email addresses permitted to edit Handbook documents.
+* @param editors - Email addresses of the editors.
 */
 function setConfiguredEditors(editors) {
 	configuredEditors = editors;
 }
 /**
-* Checks whether an email address is permitted to edit, treating an absent list as unrestricted access.
+* Checks whether an email address belongs to an editor. Without an editors list, everyone is an editor.
 *
-* @param editors - Email addresses permitted to edit, defaulting to the configured list.
+* @param editors - Email addresses of the editors, defaulting to the configured list.
 * @param email - The email address to check.
-* @returns Whether the email is permitted to edit.
+* @returns Whether the address belongs to an editor.
 */
 function isPermittedEditor(editors, email) {
 	let permitted = editors ?? configuredEditors;
 	return isDefined(permitted) ? isDefined(email) ? permitted.includes(email) : !1 : !0;
 }
-/**
-* Creates a Handbook tool for Sanity Studio, generating documentation from document type schemas
-* alongside the Portable Text guides authored in the dataset.
-*
-* @param config - Plugin configuration.
-* @returns Sanity plugin definition.
-* @public
-*/
-const handbookPlugin = definePlugin((config) => {
+function CalloutPreview(t0) {
+	let $ = c(7), { variant, body } = t0, t1 = variant ?? "tip", t2;
+	$[0] === body ? t2 = $[1] : (t2 = body?.map(_temp2), $[0] = body, $[1] = t2);
+	let t3;
+	$[2] === t2 ? t3 = $[3] : (t3 = /* @__PURE__ */ jsx(Stack, {
+		gap: 3,
+		children: t2
+	}), $[2] = t2, $[3] = t3);
+	let t4;
+	return $[4] !== t1 || $[5] !== t3 ? (t4 = /* @__PURE__ */ jsx(CalloutContent, {
+		variant: t1,
+		children: t3
+	}), $[4] = t1, $[5] = t3, $[6] = t4) : t4 = $[6], t4;
+}
+function _temp2(t0) {
+	let { _key, children } = t0;
+	return /* @__PURE__ */ jsx("div", {
+		style: { whiteSpace: "pre-wrap" },
+		children: children.map(_temp).join("")
+	}, _key);
+}
+function _temp(child) {
+	return child.text;
+}
+function CodeDecorator(t0) {
+	let $ = c(2), { children } = t0, t1;
+	return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(PortableCode, { children }), $[0] = children, $[1] = t1), t1;
+}
+function ParagraphStyle(t0) {
+	let $ = c(2), { children } = t0, t1;
+	return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(PortableParagraph, { children }), $[0] = children, $[1] = t1), t1;
+}
+function HeadingStyle(t0) {
+	let $ = c(2), { children } = t0, t1;
+	return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(PortableHeading, { children }), $[0] = children, $[1] = t1), t1;
+}
+function BlockquoteStyle(t0) {
+	let $ = c(2), { children } = t0, t1;
+	return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(PortableBlockquote, { children }), $[0] = children, $[1] = t1), t1;
+}
+function MessageCircleIcon(props) {
+	let $ = c(3), t0;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719" }), $[0] = t0) : t0 = $[0];
+	let t1;
+	return $[1] === props ? t1 = $[2] : (t1 = /* @__PURE__ */ jsx("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: t0
+	}), $[1] = props, $[2] = t1), t1;
+}
+function LinkIcon(props) {
+	let $ = c(4), t0, t1;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" }), t1 = /* @__PURE__ */ jsx("path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" }), $[0] = t0, $[1] = t1) : (t0 = $[0], t1 = $[1]);
+	let t2;
+	return $[2] === props ? t2 = $[3] : (t2 = /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [t0, t1]
+	}), $[2] = props, $[3] = t2), t2;
+}
+const linkAnnotation = defineArrayMember({
+	name: "link",
+	type: "object",
+	description: "Link applied to the selected text.",
+	icon: createSanityIcon(LinkIcon),
+	preview: {
+		select: { href: "href" },
+		prepare(selection) {
+			let { href } = selection;
+			return { title: href ?? "Link" };
+		}
+	},
+	fields: [defineField({
+		name: "href",
+		type: "url",
+		title: "URL",
+		description: "Web address to link to. Use http, https, mailto, or tel.",
+		validation: (rule) => rule.uri({ scheme: [
+			"http",
+			"https",
+			"mailto",
+			"tel"
+		] })
+	})]
+}), calloutType = defineType({
+	name: calloutTypeName,
+	type: "object",
+	title: "Callout",
+	description: "Highlighted tip, note, or warning.",
+	icon: createSanityIcon(MessageCircleIcon),
+	components: { preview: CalloutPreview },
+	preview: {
+		select: {
+			variant: "variant",
+			body: "body"
+		},
+		prepare(selection) {
+			let { variant, body } = selection;
+			return {
+				title: "Callout",
+				variant,
+				body
+			};
+		}
+	},
+	fields: [defineField({
+		name: "variant",
+		type: "string",
+		description: "Kind of callout, which sets its icon and color.",
+		initialValue: "tip",
+		validation: (rule) => rule.required(),
+		options: {
+			list: [
+				{
+					title: "Tip",
+					value: "tip"
+				},
+				{
+					title: "Information",
+					value: "info"
+				},
+				{
+					title: "Warning",
+					value: "warning"
+				}
+			],
+			layout: "radio",
+			direction: "horizontal"
+		}
+	}), defineField({
+		name: "body",
+		type: "array",
+		description: "Text inside the callout, with inline formatting and links.",
+		of: [defineArrayMember({
+			name: "block",
+			type: "block",
+			styles: [{
+				title: "Normal",
+				value: "normal",
+				component: ParagraphStyle
+			}],
+			lists: [],
+			marks: {
+				decorators: [
+					{
+						title: "Bold",
+						value: "strong"
+					},
+					{
+						title: "Italic",
+						value: "em"
+					},
+					{
+						title: "Strikethrough",
+						value: "strike-through"
+					},
+					{
+						title: "Code",
+						value: "code",
+						component: CodeDecorator
+					}
+				],
+				annotations: [linkAnnotation]
+			}
+		})]
+	})]
+});
+function CodePreview(t0) {
+	let $ = c(3), { code, language } = t0;
+	if (!isDefined(code)) return null;
+	let t1;
+	return $[0] !== code || $[1] !== language ? (t1 = /* @__PURE__ */ jsx(CodeContent, {
+		code,
+		language
+	}), $[0] = code, $[1] = language, $[2] = t1) : t1 = $[2], t1;
+}
+function CodeIcon(props) {
+	let $ = c(4), t0, t1;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "m16 18 6-6-6-6" }), t1 = /* @__PURE__ */ jsx("path", { d: "m8 6-6 6 6 6" }), $[0] = t0, $[1] = t1) : (t0 = $[0], t1 = $[1]);
+	let t2;
+	return $[2] === props ? t2 = $[3] : (t2 = /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [t0, t1]
+	}), $[2] = props, $[3] = t2), t2;
+}
+const codeType = defineType({
+	name: codeTypeName,
+	type: "object",
+	title: "Code",
+	description: "Code block with syntax highlighting.",
+	icon: createSanityIcon(CodeIcon),
+	components: { preview: CodePreview },
+	preview: { select: {
+		code: "code",
+		language: "language"
+	} },
+	fields: [defineField({
+		name: "code",
+		type: "text",
+		description: "Code to display."
+	}), defineField({
+		name: "language",
+		type: "string",
+		description: "Language used for syntax highlighting.",
+		options: { list: [
+			{
+				title: "CSS",
+				value: "css"
+			},
+			{
+				title: "GROQ",
+				value: "groq"
+			},
+			{
+				title: "HTML",
+				value: "html"
+			},
+			{
+				title: "JavaScript",
+				value: "javascript"
+			},
+			{
+				title: "JSON",
+				value: "json"
+			},
+			{
+				title: "Plain Text",
+				value: "text"
+			},
+			{
+				title: "React",
+				value: "tsx"
+			},
+			{
+				title: "Shell",
+				value: "shell"
+			},
+			{
+				title: "TypeScript",
+				value: "typescript"
+			}
+		] }
+	})]
+});
+function HorizontalRulePreview(_props) {
+	let $ = c(1), t0;
+	return $[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx(HorizontalRuleContent, { style: { marginBlock: 8 } }), $[0] = t0) : t0 = $[0], t0;
+}
+function SeparatorHorizontalIcon(props) {
+	let $ = c(5), t0, t1, t2;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "m16 16-4 4-4-4" }), t1 = /* @__PURE__ */ jsx("path", { d: "M3 12h18" }), t2 = /* @__PURE__ */ jsx("path", { d: "m8 8 4-4 4 4" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
+	let t3;
+	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [
+			t0,
+			t1,
+			t2
+		]
+	}), $[3] = props, $[4] = t3), t3;
+}
+const horizontalRuleType = defineType({
+	name: horizontalRuleTypeName,
+	type: "object",
+	title: "Horizontal Rule",
+	description: "Divider between sections.",
+	icon: createSanityIcon(SeparatorHorizontalIcon),
+	components: { preview: HorizontalRulePreview },
+	preview: { prepare() {
+		return { title: "Horizontal Rule" };
+	} },
+	fields: [defineField({
+		name: "style",
+		type: "string",
+		description: "Unused placeholder field.",
+		hidden: !0
+	})]
+});
+function ImagePreview(t0) {
+	let $ = c(5), { url, alt, caption } = t0;
+	if (!isDefined(url)) return null;
+	let t1;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { padding: 8 }, $[0] = t1) : t1 = $[0];
+	let t2;
+	return $[1] !== alt || $[2] !== caption || $[3] !== url ? (t2 = /* @__PURE__ */ jsx(ImageContent, {
+		url,
+		alt,
+		caption,
+		style: t1
+	}), $[1] = alt, $[2] = caption, $[3] = url, $[4] = t2) : t2 = $[4], t2;
+}
+function ImageIcon(props) {
+	let $ = c(5), t0, t1, t2;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("rect", {
+		width: "18",
+		height: "18",
+		x: "3",
+		y: "3",
+		rx: "2",
+		ry: "2"
+	}), t1 = /* @__PURE__ */ jsx("circle", {
+		cx: "9",
+		cy: "9",
+		r: "2"
+	}), t2 = /* @__PURE__ */ jsx("path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }), $[0] = t0, $[1] = t1, $[2] = t2) : (t0 = $[0], t1 = $[1], t2 = $[2]);
+	let t3;
+	return $[3] === props ? t3 = $[4] : (t3 = /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [
+			t0,
+			t1,
+			t2
+		]
+	}), $[3] = props, $[4] = t3), t3;
+}
+const imageType = defineType({
+	name: imageTypeName,
+	type: "object",
+	title: "Image",
+	description: "Image with an optional caption and alternative text.",
+	icon: createSanityIcon(ImageIcon),
+	components: { preview: ImagePreview },
+	preview: { select: {
+		caption: "caption",
+		alt: "alt",
+		url: "asset.asset.url"
+	} },
+	fields: [
+		defineField({
+			name: "asset",
+			type: "image",
+			title: "Image",
+			description: "Image to show.",
+			options: { hotspot: !0 }
+		}),
+		defineField({
+			name: "caption",
+			type: "string",
+			description: "Text shown below the image, such as a credit."
+		}),
+		defineField({
+			name: "alt",
+			type: "string",
+			title: "Alternative Text",
+			description: "Description of the image for people who can't see it. Don't repeat the caption."
+		})
+	]
+});
+function VideoPreview(t0) {
+	let $ = c(4), { url, caption } = t0;
+	if (!isDefined(url)) return null;
+	let t1;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { padding: 8 }, $[0] = t1) : t1 = $[0];
+	let t2;
+	return $[1] !== caption || $[2] !== url ? (t2 = /* @__PURE__ */ jsx(VideoContent, {
+		url,
+		caption,
+		style: t1
+	}), $[1] = caption, $[2] = url, $[3] = t2) : t2 = $[3], t2;
+}
+function FilmIcon(props) {
+	let $ = c(10), t0, t1, t2, t3, t4, t5, t6, t7;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("rect", {
+		x: "3",
+		y: "3",
+		width: "18",
+		height: "18",
+		rx: "2"
+	}), t1 = /* @__PURE__ */ jsx("path", { d: "M7 3v18" }), t2 = /* @__PURE__ */ jsx("path", { d: "M3 7.5h4" }), t3 = /* @__PURE__ */ jsx("path", { d: "M3 12h18" }), t4 = /* @__PURE__ */ jsx("path", { d: "M3 16.5h4" }), t5 = /* @__PURE__ */ jsx("path", { d: "M17 3v18" }), t6 = /* @__PURE__ */ jsx("path", { d: "M17 7.5h4" }), t7 = /* @__PURE__ */ jsx("path", { d: "M17 16.5h4" }), $[0] = t0, $[1] = t1, $[2] = t2, $[3] = t3, $[4] = t4, $[5] = t5, $[6] = t6, $[7] = t7) : (t0 = $[0], t1 = $[1], t2 = $[2], t3 = $[3], t4 = $[4], t5 = $[5], t6 = $[6], t7 = $[7]);
+	let t8;
+	return $[8] === props ? t8 = $[9] : (t8 = /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [
+			t0,
+			t1,
+			t2,
+			t3,
+			t4,
+			t5,
+			t6,
+			t7
+		]
+	}), $[8] = props, $[9] = t8), t8;
+}
+const videoType = defineType({
+	name: videoTypeName,
+	type: "object",
+	title: "Video",
+	description: "Video with an optional caption.",
+	icon: createSanityIcon(FilmIcon),
+	components: { preview: VideoPreview },
+	preview: { select: {
+		caption: "caption",
+		url: "asset.asset.url"
+	} },
+	fields: [defineField({
+		name: "asset",
+		type: "file",
+		title: "Video",
+		description: "Video to show.",
+		options: { accept: "video/*" }
+	}), defineField({
+		name: "caption",
+		type: "string",
+		description: "Text shown below the video, such as a credit."
+	})]
+});
+function ListItemStyle(t0) {
+	let $ = c(3), { children } = t0, t1;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { marginTop: "0.375em" }, $[0] = t1) : t1 = $[0];
+	let t2;
+	return $[1] === children ? t2 = $[2] : (t2 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		style: t1,
+		children
+	}), $[1] = children, $[2] = t2), t2;
+}
+/**
+* Creates the guide content field, offering the built-in blocks and any custom ones.
+*
+* @param customBlocks - Custom blocks added by the site.
+* @returns The content field.
+*/
+function createGuideContentField(customBlocks = []) {
+	return defineField({
+		name: "content",
+		type: "array",
+		description: "Rich text with formatting, headings, lists, images, code blocks, and custom blocks.",
+		of: [
+			defineArrayMember({
+				name: "block",
+				type: "block",
+				styles: [
+					{
+						title: "Paragraph",
+						value: "normal",
+						component: ParagraphStyle
+					},
+					{
+						title: "Heading",
+						value: "h2",
+						component: HeadingStyle
+					},
+					{
+						title: "Blockquote",
+						value: "blockquote",
+						component: BlockquoteStyle
+					}
+				],
+				lists: [{
+					title: "Bullet",
+					value: "bullet",
+					component: ListItemStyle
+				}, {
+					title: "Number",
+					value: "number",
+					component: ListItemStyle
+				}],
+				marks: {
+					decorators: [
+						{
+							title: "Bold",
+							value: "strong"
+						},
+						{
+							title: "Italic",
+							value: "em"
+						},
+						{
+							title: "Strikethrough",
+							value: "strike-through"
+						},
+						{
+							title: "Code",
+							value: "code",
+							component: CodeDecorator
+						}
+					],
+					annotations: [linkAnnotation]
+				}
+			}),
+			defineArrayMember({
+				name: imageTypeName,
+				type: imageTypeName
+			}),
+			defineArrayMember({
+				name: videoTypeName,
+				type: videoTypeName
+			}),
+			defineArrayMember({
+				name: codeTypeName,
+				type: codeTypeName
+			}),
+			defineArrayMember({
+				name: calloutTypeName,
+				type: calloutTypeName
+			}),
+			defineArrayMember({
+				name: horizontalRuleTypeName,
+				type: horizontalRuleTypeName
+			}),
+			...customBlocks.map((block) => defineArrayMember({
+				name: block.schema.name,
+				type: block.schema.name
+			}))
+		]
+	});
+}
+/**
+* Creates the guide document type, with a content field offering the built-in blocks and any custom ones.
+*
+* @param customBlocks - Custom blocks added by the site.
+* @returns The guide document type.
+*/
+function createGuideType(customBlocks = []) {
+	return defineType({
+		name: guideTypeName,
+		type: "document",
+		title: "Handbook Guide",
+		description: "Handbook page written in rich text.",
+		icon: createSanityIcon(BookOpenTextIcon),
+		preview: {
+			select: {
+				title: "title",
+				description: "description"
+			},
+			prepare(selection) {
+				let { title, description } = selection;
+				return {
+					title: title ?? "Untitled",
+					subtitle: description
+				};
+			}
+		},
+		fields: [
+			defineField({
+				name: "title",
+				type: "string",
+				description: "Title shown in the Handbook sidebar and as the guide heading.",
+				validation: (rule) => rule.required()
+			}),
+			defineField({
+				name: "description",
+				type: "string",
+				description: "Short introduction shown below the heading."
+			}),
+			createGuideContentField(customBlocks)
+		]
+	});
+}
+function ListPlusIcon(props) {
+	let $ = c(7), t0, t1, t2, t3, t4;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M16 5H3" }), t1 = /* @__PURE__ */ jsx("path", { d: "M11 12H3" }), t2 = /* @__PURE__ */ jsx("path", { d: "M16 19H3" }), t3 = /* @__PURE__ */ jsx("path", { d: "M18 9v6" }), t4 = /* @__PURE__ */ jsx("path", { d: "M21 12h-6" }), $[0] = t0, $[1] = t1, $[2] = t2, $[3] = t3, $[4] = t4) : (t0 = $[0], t1 = $[1], t2 = $[2], t3 = $[3], t4 = $[4]);
+	let t5;
+	return $[5] === props ? t5 = $[6] : (t5 = /* @__PURE__ */ jsxs("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: 24,
+		height: 24,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: 2,
+		strokeLinecap: "round",
+		strokeLinejoin: "round",
+		...props,
+		children: [
+			t0,
+			t1,
+			t2,
+			t3,
+			t4
+		]
+	}), $[5] = props, $[6] = t5), t5;
+}
+const handbookType = defineType({
+	name: handbookTypeName,
+	type: "document",
+	title: "Handbook",
+	description: "Groups of guides shown in the Handbook sidebar, in order.",
+	icon: createSanityIcon(BookTextIcon),
+	preview: { prepare() {
+		return { title: "Handbook" };
+	} },
+	fields: [defineField({
+		name: "groups",
+		type: "array",
+		description: "Groups of guides shown in the Handbook sidebar, in order. Each group has a title and a list of guides, also in order.",
+		of: [defineArrayMember({
+			name: "group",
+			type: "object",
+			description: "Sidebar section holding a list of guides.",
+			icon: createSanityIcon(ListPlusIcon),
+			fields: [defineField({
+				name: "title",
+				type: "string",
+				description: "Heading shown above the group in the sidebar.",
+				validation: (rule) => rule.required()
+			}), defineField({
+				name: "guides",
+				type: "array",
+				description: "Guides in the group, in order. Drag to reorder.",
+				of: [defineArrayMember({
+					name: "guide",
+					type: "reference",
+					to: [{ type: guideTypeName }]
+				})]
+			})],
+			preview: {
+				select: {
+					title: "title",
+					guide0: "guides.0.title",
+					guide1: "guides.1.title",
+					guide2: "guides.2.title"
+				},
+				prepare(selection) {
+					let { title, guide0, guide1, guide2 } = selection, shown = [
+						guide0,
+						guide1,
+						guide2
+					].filter((guide) => isDefined(guide)).slice(0, 2), hasMore = isDefined(guide2);
+					function formatSubtitle() {
+						return isDefined(shown) ? hasMore ? `${shown.join(", ")}, and others` : shown.join(" and ") : "No guides selected";
+					}
+					return {
+						title: title ?? "Group",
+						subtitle: formatSubtitle()
+					};
+				}
+			}
+		})]
+	})]
+}), handbookPlugin = definePlugin((config) => {
 	let { title, sidebarTitle, roles, blocks, editors, undocumentedFieldMessage } = config;
 	setConfiguredEditors(editors);
 	let resolved = {
 		sidebarTitle: sidebarTitle ?? "Handbook",
 		roles,
 		blocks: blocks ?? [],
-		undocumentedFieldMessage: undocumentedFieldMessage ?? "This field has not been documented yet. Contact your development team for guidance."
+		undocumentedFieldMessage: undocumentedFieldMessage ?? "This field isn't documented yet. Ask your development team for guidance."
 	}, guideType = createGuideType(resolved.blocks);
 	return {
-		name: "@driftime/sanity-plugin-handbook",
+		name: pluginName,
 		schema: { types: [
 			handbookType,
 			guideType,
@@ -2792,25 +2837,26 @@ const handbookPlugin = definePlugin((config) => {
 	};
 });
 /**
-* Creates the Structure tool items for Handbook documents, yielding nothing when the current user is
-* not permitted to edit them.
+* Creates Structure tool items for the Handbook documents, or none when the current user can't edit them.
 *
-* @param structureBuilder - The Sanity Structure builder instance.
-* @param context - The Structure context carrying the current user.
-* @param editors - Email addresses permitted to edit, defaulting to the configured list.
-* @returns The list items for the Handbook singleton and the guides list.
+* @param structureBuilder - The structure builder.
+* @param context - The structure context, with the current user.
+* @param editors - Email addresses of the editors, defaulting to the configured list.
+* @returns List items for the Handbook document and the guides list, oldest guide first.
 * @public
 */
 function handbookStructure(structureBuilder, context, editors) {
 	if (!isPermittedEditor(editors, context.currentUser?.email)) return [];
 	let { listItem, document, documentTypeList } = structureBuilder;
-	return [listItem().title("Handbook").icon(createSanityIcon(BookTextIcon)).child(document().id(handbookTypeName).schemaType(handbookTypeName).title("Handbook")), listItem().title("Handbook Guides").icon(createSanityIcon(BookOpenTextIcon)).child(documentTypeList(guideTypeName).title("Handbook Guides"))];
+	return [listItem().title("Handbook").icon(createSanityIcon(BookTextIcon)).child(document().id(handbookTypeName).schemaType(handbookTypeName).title("Handbook")), listItem().title("Handbook Guides").icon(createSanityIcon(BookOpenTextIcon)).child(documentTypeList(guideTypeName).title("Handbook Guides").defaultOrdering([{
+		field: "_createdAt",
+		direction: "asc"
+	}]))];
 }
 /**
-* Checks whether the current user is permitted to edit Handbook content, treating an absent list as
-* unrestricted access.
+* Checks whether the current user can edit Handbook documents. Without an editors list, everyone can.
 *
-* @param editors - Email addresses permitted to edit, defaulting to the configured list.
+* @param editors - Email addresses of the editors, defaulting to the configured list.
 * @returns Whether the current user can edit Handbook documents.
 * @public
 */