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

@driftime/sanity-plugin-handbook 0.3.2 → 0.4.0

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,37 +10,16 @@ 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";
+/**
+* Properties the plugin's own icons are drawn with. Icons taken from `@sanity/icons` are left alone,
+* since they already carry the sizing and stroke the rest of the Studio uses.
+*/
 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.
 *
@@ -59,123 +37,52 @@ 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 the plugin is running in a development build, which decides whether it reports what it recovered from. */
+const isDevelopment = process.env.NODE_ENV === "development", prefixStyle = "color: #2276fc";
+/**
+* Creates the logger a package reports through, so every message names the plugin it came from and
+* only a development build hears it. In a browser console the name is drawn in blue, the way the
+* Studio's own messages are; a terminal ignores the styling and prints it plain.
+*
+* @param name - Name of the package the messages come from.
+* @returns Functions that warn, report an error, or word a message for throwing.
+*/
+function createLogger(name) {
+	let prefix = `[${name}]`;
+	/**
+	* Words a message so it names the package it came from.
+	*
+	* @param message - The message to word.
+	* @returns The message with the package name in front.
+	*/
+	function format(message) {
+		return `${prefix} ${message}`;
+	}
+	return {
+		/**
+		* Reports something the plugin recovered from, in development only.
+		*
+		* @param message - What was recovered from and what to do about it.
+		*/
+		warn(message) {
+			isDevelopment && console.warn(`%c${prefix}%c ${message}`, prefixStyle, "");
+		},
+		/**
+		* Reports something the plugin could not recover from, in development 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) {
+/** Name the package is published under, which every message it reports carries. */
+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,945 +102,105 @@ 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 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.
+*
+* @param value - The value to check.
+* @returns True if the value is defined and not empty.
+*/
+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 between different casing formats.
+*
+* @param value - The string to convert.
+* @param format - The target casing format.
+* @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 can be read by key, narrowing what arrives untyped from outside the plugin.
+*
+* @param value - The value to check.
+* @returns True if the value has keys to read.
+*/
+function isRecord(value) {
+	return typeof value == "object" && !!value;
+}
+/**
+* Reads a value out of nested records by following a path of keys, so a caller can name something
+* inside a shape it does not otherwise know.
+*
+* @param value - The object to read from.
+* @param path - Keys leading to the value.
+* @returns The value at the path, or undefined when a key is missing or a step holds no keys to read.
+*/
+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);
-}
-function _temp$3(child) {
-	return child.text;
-}
-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;
-}
-/** 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];
-	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 current;
 }
+/** Share of the available 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} }
+`} }
+}`;
 /**
-* 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.
+* 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.
 *
-* @param value - The value to check.
-* @returns True if the value is defined and not empty.
+* @param query - The GROQ query string.
+* @returns The query, typed to the given result shape.
 */
-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 defineTypedQuery(query) {
+	return query;
 }
 /**
-* Converts a string between different casing formats.
+* Runs a branded query against the dataset, resolving a missing document to undefined.
 *
-* @param value - The string to convert.
-* @param format - The target casing format.
-* @returns The converted string.
+* @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.
 */
-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 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;
-}
-/** 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) {
-	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;
-}
-/** 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) {
-	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;
-}
-/** 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];
-	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 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;
-}
-/** 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.
-*
-* @param customBlocks - Custom block definitions registered by the consumer.
-* @returns A field definition for the guide content array.
-*/
-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
-			}))
-		]
-	});
-}
-/** Document type name of an individual guide. */
-const guideTypeName = "handbook.guide";
-/**
-* Creates the document type a single guide is authored as, with its content field offering the
-* built-in blocks alongside any a consumer registered.
-*
-* @param customBlocks - Custom block definitions registered by the consumer.
-* @returns A document type definition for Handbook guides.
-*/
-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 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;
-}
-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;
-}
-/** 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.
-*
-* @param query - The GROQ query string.
-* @returns The query, typed to the given result shape.
-*/
-function defineTypedQuery(query) {
-	return query;
-}
-/**
-* Runs a branded query against the dataset, resolving a missing document to undefined.
-*
-* @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.
-*/
-async function fetchQuery(client, query) {
-	return await client.fetch(query) ?? void 0;
+async function fetchQuery(client, query) {
+	return await client.fetch(query) ?? void 0;
 }
 /** Fetches the Handbook singleton with expanded guide references. */
 const handbookQuery = defineTypedQuery(`
@@ -1181,18 +248,17 @@ const HandbookContext = createContext(void 0);
 * Accesses the Handbook context for tab state and plugin configuration.
 *
 * @returns The resolved plugin configuration alongside the state the panes share.
-* @throws {Error} If used outside the provider.
+* @throws If used outside the provider.
 */
 function useHandbookContext() {
 	let handbookContext = useContext(HandbookContext);
-	if (!isDefined(handbookContext)) throw Error("useHandbookContext can only be used within <HandbookProvider>");
+	if (!isDefined(handbookContext)) throw Error(logger.format("Handbook context is only available inside the Handbook provider."));
 	return handbookContext;
 }
 /**
 * Provides the tab state the sidebar and content panes share, alongside the plugin configuration and
 * the handbook singleton fetched from the dataset.
 *
-* @param props - Configuration from the plugin, and the tool to provide it to.
 * @returns The provider wrapping its children.
 */
 function HandbookProvider(t0) {
@@ -1373,7 +439,7 @@ function ContentPanel(t0) {
 	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;
+	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);
@@ -1412,29 +478,19 @@ function FieldHint(t0) {
 		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", {
+	$[21] !== icon || $[22] !== label || $[23] !== t6 || $[24] !== t7 || $[25] !== t8 ? (t9 = /* @__PURE__ */ jsx(Button, {
 		ref: buttonReference,
 		"aria-label": label,
-		type: "button",
+		fontSize: 2,
+		icon,
+		mode: "bleed",
+		padding: 1,
 		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, {
+		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,
@@ -1442,8 +498,78 @@ function FieldHint(t0) {
 		shadow: 2,
 		content: t5,
 		...props,
-		children: t10
-	}), $[28] = open, $[29] = props, $[30] = t10, $[31] = t5, $[32] = t11) : t11 = $[32], t11;
+		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,
+		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;
+}
+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;
+}
+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;
 }
 /** Hint kinds a field can carry, in the order they are displayed. */
 const hintKinds = [
@@ -1577,7 +703,7 @@ const opaqueTypes = /* @__PURE__ */ new Set([
 * @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;
+	return !isRecord(value) || !("name" in value) || !("type" in value) ? !1 : isRecord(value.type);
 }
 /**
 * Checks whether a value has a `fields` array property.
@@ -1586,7 +712,7 @@ function isCompiledField(value) {
 * @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);
+	return isRecord(value) && Array.isArray(value.fields);
 }
 /**
 * Checks whether a value has an `of` array property.
@@ -1595,7 +721,7 @@ function hasFieldsArray(value) {
 * @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);
+	return isRecord(value) && Array.isArray(value.of);
 }
 /**
 * Extracts the type name a value declares, where it names one at all.
@@ -1604,7 +730,8 @@ function hasOfArray(value) {
 * @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;
+	let typeName = readPath(value, ["type"]);
+	return typeof typeName == "string" ? typeName : void 0;
 }
 /**
 * Extracts the parent type name from a compiled schema type, if present.
@@ -1613,7 +740,8 @@ function getTypeName(value) {
 * @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);
+	let parentName = readPath(resolvedType, ["type", "name"]);
+	return isDefined(parentName) ? String(parentName) : void 0;
 }
 /**
 * Normalises a compiled schema field into the shape the Handbook renders. Type names already seen are
@@ -1623,7 +751,7 @@ function getParentTypeName(resolvedType) {
 * @param visited - Type names already seen in this normalisation chain.
 * @returns The normalised field.
 */
-function normaliseField(field, visited = /* @__PURE__ */ new Set()) {
+function normalizeField(field, visited = /* @__PURE__ */ new Set()) {
 	if (isCompiledField(field)) {
 		let typeName = field.type.name, result = {
 			name: field.name,
@@ -1634,7 +762,7 @@ function normaliseField(field, visited = /* @__PURE__ */ new Set()) {
 		};
 		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)));
+			hasFieldsArray(fieldSource) && (result.fields = fieldSource.fields.map((subfield) => normalizeField(subfield, next))), hasOfArray(ofSource) && (result.of = ofSource.of.map((member) => normalizeField(member, next)));
 		}
 		return result;
 	}
@@ -1646,32 +774,32 @@ function normaliseField(field, visited = /* @__PURE__ */ new Set()) {
 *
 * @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.
+* @returns The custom fields, or undefined when none of them holds a value.
 */
 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));
+	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;
 }
 /**
 * 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.
+* @returns The normalised fields, or undefined when none of them holds a value.
 */
-function resolveNormalisedFields(items) {
-	let normalised = items.map((item) => normaliseField(item));
-	return isDefined(normalised) ? normalised : void 0;
+function resolveNormalizedFields(items) {
+	let normalized = items.map((item) => normalizeField(item));
+	return isDefined(normalized) ? normalized : 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.
+* @returns The normalised non-opaque members, or undefined when none of them holds a value.
 */
-function resolveNormalisedMembers(members) {
-	let normalised = members.map((member) => normaliseField(member)).filter((member) => !opaqueTypes.has(member.type));
-	return isDefined(normalised) ? normalised : void 0;
+function resolveNormalizedMembers(members) {
+	let normalized = members.map((member) => normalizeField(member)).filter((member) => !opaqueTypes.has(member.type));
+	return isDefined(normalized) ? normalized : void 0;
 }
 /**
 * Resolves the name of the type a value extends, reaching into the schema registry when the value
@@ -1700,21 +828,21 @@ function resolveParentName(value, schema) {
 function resolveFields(value, schema) {
 	if (hasFieldsArray(value)) {
 		let parentName = resolveParentName(value, schema);
-		return isDefined(parentName) && opaqueTypes.has(parentName) ? resolveCustomFields(value, parentName) : resolveNormalisedFields(value.fields);
+		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, 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 [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(normalised.type);
+			let memberType = schema.get(normalized.type);
 			if (isDefined(memberType)) return resolveFields(memberType, schema);
 		}
-		return resolveNormalisedMembers(members);
+		return resolveNormalizedMembers(members);
 	}
 }
 /**
@@ -1735,7 +863,7 @@ function getSubfields(field, schema) {
 }
 /** Shared empty ancestor set, so the default prop keeps a stable reference across 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 +993,7 @@ function Field(t0) {
 							]
 						})]
 					})
-				}), expanded && /* @__PURE__ */ jsx("div", {
+				}), expanded && /* @__PURE__ */ jsx(Box, {
 					style: {
 						marginTop: 16,
 						marginBottom: 8,
@@ -1874,7 +1002,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))
@@ -1905,7 +1033,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 +1147,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)"
@@ -2136,7 +1263,7 @@ function HowToUse() {
 			/* @__PURE__ */ jsx(Stack, {
 				gap: 3,
 				marginTop: 2,
-				children: hintKinds.map(_temp$2)
+				children: hintKinds.map(_temp$3)
 			})
 		]
 	}), $[5] = t5) : t5 = $[5];
@@ -2184,16 +1311,15 @@ function HowToUse() {
 		]
 	}), $[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)"
 			},
@@ -2222,12 +1348,83 @@ function gettingStartedSections() {
 		}, {
 			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: "An overview of all document types, organized by role. Select a document type to view its fields, descriptions, and examples.",
 			icon: createSanityIcon(LayoutGridIcon),
 			render: () => /* @__PURE__ */ jsx(DocumentTypesOverview, {})
 		}]
 	}];
 }
+/** Presentation 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);
@@ -2277,6 +1474,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 +1514,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,6 +1546,48 @@ function HorizontalRuleBlock(t0) {
 		...props
 	}), $[5] = props, $[6] = t1, $[7] = t2) : t2 = $[7], t2;
 }
+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;
+	$[3] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { fontStyle: "italic" }, $[3] = t1) : t1 = $[3];
+	let t2;
+	$[4] === children ? t2 = $[5] : (t2 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		muted: !0,
+		style: t1,
+		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 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;
@@ -2327,6 +1605,36 @@ function ImageBlock(t0) {
 		...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;
@@ -2343,6 +1651,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,6 +1712,13 @@ 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.
 *
@@ -2476,8 +1826,33 @@ function PortableText$1(t0) {
 	let t8;
 	return $[15] !== props || $[16] !== t7 ? (t8 = /* @__PURE__ */ jsx("div", {
 		...props,
-		children: t7
-	}), $[15] = props, $[16] = t7, $[17] = t8) : t8 = $[17], t8;
+		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.
@@ -2518,7 +1893,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 +1910,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) {
@@ -2547,209 +1922,886 @@ function SidebarHeading(t0) {
 		outline: "none"
 	}, $[3] = t1) : t1 = $[3];
 	let t2;
-	$[4] === title ? t2 = $[5] : (t2 = /* @__PURE__ */ jsx(Card, {
-		padding: 2,
-		children: /* @__PURE__ */ jsx(Text, {
-			size: 1,
-			muted: !0,
-			textOverflow: "ellipsis",
-			weight: "semibold",
-			style: t1,
-			children: title
-		})
-	}), $[4] = title, $[5] = t2);
-	let t3;
-	return $[6] !== props || $[7] !== t2 ? (t3 = /* @__PURE__ */ jsx(Box, {
-		paddingY: 2,
+	$[4] === title ? t2 = $[5] : (t2 = /* @__PURE__ */ jsx(Card, {
+		padding: 2,
+		children: /* @__PURE__ */ jsx(Text, {
+			size: 1,
+			muted: !0,
+			textOverflow: "ellipsis",
+			weight: "semibold",
+			style: t1,
+			children: title
+		})
+	}), $[4] = title, $[5] = t2);
+	let t3;
+	return $[6] !== props || $[7] !== t2 ? (t3 = /* @__PURE__ */ jsx(Box, {
+		paddingY: 2,
+		...props,
+		children: t2
+	}), $[6] = props, $[7] = t2, $[8] = t3) : t3 = $[8], t3;
+}
+function SidebarTab(t0) {
+	let $ = c(25), Icon, id, label, props, style;
+	$[0] === t0 ? (Icon = $[1], id = $[2], label = $[3], props = $[4], style = $[5]) : ({id, label, icon: Icon, style, ...props} = t0, $[0] = t0, $[1] = Icon, $[2] = id, $[3] = label, $[4] = props, $[5] = style);
+	let { activeTab, setActiveTab, setSidebarExpanded } = useHandbookContext(), selected = activeTab === id, t1;
+	$[6] !== id || $[7] !== setActiveTab || $[8] !== setSidebarExpanded ? (t1 = () => {
+		setActiveTab(id), setSidebarExpanded(!1);
+	}, $[6] = id, $[7] = setActiveTab, $[8] = setSidebarExpanded, $[9] = t1) : t1 = $[9];
+	let t2;
+	$[10] === style ? t2 = $[11] : (t2 = {
+		cursor: "pointer",
+		...style
+	}, $[10] = style, $[11] = t2);
+	let t3 = `panel-${id}`, t4;
+	$[12] === Symbol.for("react.memo_cache_sentinel") ? (t4 = { opacity: .5 }, $[12] = t4) : t4 = $[12];
+	let t5;
+	$[13] === Symbol.for("react.memo_cache_sentinel") ? (t5 = /* @__PURE__ */ jsx(Box, {
+		style: t4,
+		children: /* @__PURE__ */ jsx(Text, {
+			muted: !0,
+			size: 1,
+			children: /* @__PURE__ */ jsx(ChevronRightIcon, {})
+		})
+	}), $[13] = t5) : t5 = $[13];
+	let t6;
+	$[14] !== Icon || $[15] !== label ? (t6 = /* @__PURE__ */ jsx(SanityDefaultPreview, {
+		status: t5,
+		icon: Icon,
+		layout: "compact",
+		title: label
+	}), $[14] = Icon, $[15] = label, $[16] = t6) : t6 = $[16];
+	let t7;
+	return $[17] !== id || $[18] !== props || $[19] !== selected || $[20] !== t1 || $[21] !== t2 || $[22] !== t3 || $[23] !== t6 ? (t7 = /* @__PURE__ */ jsx(PreviewCard, {
+		id,
+		as: "button",
+		"data-as": "button",
+		selected,
+		marginBottom: 1,
+		radius: 2,
+		sizing: "border",
+		tabIndex: -1,
+		tone: "inherit",
+		onClick: t1,
+		style: t2,
+		"aria-controls": t3,
+		__unstable_focusRing: !0,
+		...props,
+		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$1), $[0] = sections, $[1] = t0);
+	let items = t0, t1;
+	$[2] === items ? t1 = $[3] : (t1 = function getItemDisabled(virtualIndex) {
+		return items[virtualIndex]?.type === "heading";
+	}, $[2] = items, $[3] = t1);
+	let getItemDisabled = t1, t2;
+	$[4] === sidebarTitle ? t2 = $[5] : (t2 = /* @__PURE__ */ jsx(PaneHeader, { title: sidebarTitle }), $[4] = sidebarTitle, $[5] = t2);
+	let t3;
+	$[6] !== getItemDisabled || $[7] !== items || $[8] !== sidebarTitle ? (t3 = /* @__PURE__ */ jsx(PaneContent, {
+		overflow: "auto",
+		children: /* @__PURE__ */ jsx(CommandList, {
+			activeItemDataAttr: "data-hovered",
+			ariaLabel: sidebarTitle,
+			canReceiveFocus: !0,
+			getItemDisabled,
+			itemHeight: 37,
+			items,
+			onlyShowSelectionWhenActive: !0,
+			paddingBottom: 1,
+			paddingX: 3,
+			renderItem,
+			wrapAround: !1
+		})
+	}), $[6] = getItemDisabled, $[7] = items, $[8] = sidebarTitle, $[9] = t3) : t3 = $[9];
+	let t4;
+	return $[10] !== props || $[11] !== t2 || $[12] !== t3 ? (t4 = /* @__PURE__ */ jsxs(Pane, {
+		id: "handbook-sidebar",
+		currentMaxWidth: 350,
+		minWidth: 320,
+		maxWidth: 640,
+		...props,
+		children: [t2, t3]
+	}), $[10] = props, $[11] = t2, $[12] = t3, $[13] = t4) : t4 = $[13], t4;
+}
+function _temp2$1(t0) {
+	let { title, entries } = t0;
+	return [{
+		type: "heading",
+		title
+	}, ...entries.map(_temp$1)];
+}
+function _temp$1(entry) {
+	return {
+		type: "tab",
+		id: entry.id,
+		label: entry.title,
+		icon: entry.icon
+	};
+}
+function Panes() {
+	let $ = c(10), { activeTab, sidebarExpanded } = useHandbookContext(), paneLayout = useContext(PaneLayoutContext), t0;
+	$[0] === activeTab ? t0 = $[1] : (t0 = isDefined(activeTab), $[0] = activeTab, $[1] = t0);
+	let hasContent = t0;
+	if (paneLayout?.collapsed === !0) {
+		let t1;
+		return $[2] !== hasContent || $[3] !== sidebarExpanded ? (t1 = jsx(sidebarExpanded || !hasContent ? Sidebar : Content, {}), $[2] = hasContent, $[3] = sidebarExpanded, $[4] = t1) : t1 = $[4], t1;
+	}
+	let t1;
+	$[5] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(Sidebar, {}), $[5] = t1) : t1 = $[5];
+	let t2;
+	$[6] === hasContent ? t2 = $[7] : (t2 = hasContent && /* @__PURE__ */ jsx(Content, {}), $[6] = hasContent, $[7] = t2);
+	let t3;
+	return $[8] === t2 ? t3 = $[9] : (t3 = /* @__PURE__ */ jsxs(Fragment, { children: [t1, t2] }), $[8] = t2, $[9] = t3), t3;
+}
+function HandbookTool(t0) {
+	let $ = c(10), { tool: t1 } = t0, { options } = t1, { media } = useTheme_v2(), [layoutCollapsed, setLayoutCollapsed] = useState(!1), t2;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t2 = function handleCollapse() {
+		setLayoutCollapsed(!0);
+	}, $[0] = t2) : t2 = $[0];
+	let handleCollapse = t2, t3;
+	$[1] === Symbol.for("react.memo_cache_sentinel") ? (t3 = function handleExpand() {
+		setLayoutCollapsed(!1);
+	}, $[1] = t3) : t3 = $[1];
+	let handleExpand = t3;
+	if (!isDefined(options)) return null;
+	let t4 = layoutCollapsed ? void 0 : "fill", t5, t6;
+	$[2] === Symbol.for("react.memo_cache_sentinel") ? (t5 = {
+		minHeight: "100%",
+		minWidth: "320px"
+	}, t6 = /* @__PURE__ */ jsx(Panes, {}), $[2] = t5, $[3] = t6) : (t5 = $[2], t6 = $[3]);
+	let t7;
+	$[4] !== media[1] || $[5] !== t4 ? (t7 = /* @__PURE__ */ jsx(PaneLayout, {
+		flex: 1,
+		height: t4,
+		minWidth: media[1],
+		onCollapse: handleCollapse,
+		onExpand: handleExpand,
+		style: t5,
+		children: t6
+	}), $[4] = media[1], $[5] = t4, $[6] = t7) : t7 = $[6];
+	let t8;
+	return $[7] !== options || $[8] !== t7 ? (t8 = /* @__PURE__ */ jsx(HandbookProvider, {
+		...options,
+		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. */
+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.
+*
+* @param editors - Email addresses permitted to edit Handbook documents.
+*/
+function setConfiguredEditors(editors) {
+	configuredEditors = editors;
+}
+/**
+* Checks whether an email address is permitted to edit, treating an absent list as unrestricted access.
+*
+* @param editors - Email addresses permitted to edit, defaulting to the configured list.
+* @param email - The email address to check.
+* @returns Whether the email is permitted to edit.
+*/
+function isPermittedEditor(editors, email) {
+	let permitted = editors ?? configuredEditors;
+	return isDefined(permitted) ? isDefined(email) ? permitted.includes(email) : !1 : !0;
+}
+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: t2
-	}), $[6] = props, $[7] = t2, $[8] = t3) : t3 = $[8], t3;
+		children: [t0, t1]
+	}), $[2] = props, $[3] = t2), t2;
 }
-function SidebarTab(t0) {
-	let $ = c(25), Icon, id, label, props, style;
-	$[0] === t0 ? (Icon = $[1], id = $[2], label = $[3], props = $[4], style = $[5]) : ({id, label, icon: Icon, style, ...props} = t0, $[0] = t0, $[1] = Icon, $[2] = id, $[3] = label, $[4] = props, $[5] = style);
-	let { activeTab, setActiveTab, setSidebarExpanded } = useHandbookContext(), selected = activeTab === id, t1;
-	$[6] !== id || $[7] !== setActiveTab || $[8] !== setSidebarExpanded ? (t1 = () => {
-		setActiveTab(id), setSidebarExpanded(!1);
-	}, $[6] = id, $[7] = setActiveTab, $[8] = setSidebarExpanded, $[9] = t1) : t1 = $[9];
+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 destination for this link. Supports http, https, mailto, and tel schemes.",
+		validation: (rule) => rule.uri({ scheme: [
+			"http",
+			"https",
+			"mailto",
+			"tel"
+		] })
+	})]
+}), calloutType = defineType({
+	name: calloutTypeName,
+	type: "object",
+	title: "Callout",
+	description: "Highlighted message block drawing attention to tips, supplementary information, or warnings.",
+	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: "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 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;
-	$[10] === style ? t2 = $[11] : (t2 = {
-		cursor: "pointer",
-		...style
-	}, $[10] = style, $[11] = t2);
-	let t3 = `panel-${id}`, t4;
-	$[12] === Symbol.for("react.memo_cache_sentinel") ? (t4 = { opacity: .5 }, $[12] = t4) : t4 = $[12];
-	let t5;
-	$[13] === Symbol.for("react.memo_cache_sentinel") ? (t5 = /* @__PURE__ */ jsx(Box, {
-		style: t4,
-		children: /* @__PURE__ */ jsx(Text, {
-			muted: !0,
-			size: 1,
-			children: /* @__PURE__ */ jsx(ChevronRightIcon, {})
-		})
-	}), $[13] = t5) : t5 = $[13];
-	let t6;
-	$[14] !== Icon || $[15] !== label ? (t6 = /* @__PURE__ */ jsx(SanityDefaultPreview, {
-		status: t5,
-		icon: Icon,
-		layout: "compact",
-		title: label
-	}), $[14] = Icon, $[15] = label, $[16] = t6) : t6 = $[16];
-	let t7;
-	return $[17] !== id || $[18] !== props || $[19] !== selected || $[20] !== t1 || $[21] !== t2 || $[22] !== t3 || $[23] !== t6 ? (t7 = /* @__PURE__ */ jsx(PreviewCard, {
-		id,
-		as: "button",
-		"data-as": "button",
-		selected,
-		marginBottom: 1,
-		radius: 2,
-		sizing: "border",
-		tabIndex: -1,
-		tone: "inherit",
-		onClick: t1,
-		style: t2,
-		"aria-controls": t3,
-		__unstable_focusRing: !0,
+	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: t6
-	}), $[17] = id, $[18] = props, $[19] = selected, $[20] = t1, $[21] = t2, $[22] = t3, $[23] = t6, $[24] = t7) : t7 = $[24], t7;
+		children: [t0, t1]
+	}), $[2] = props, $[3] = t2), t2;
+}
+const codeType = defineType({
+	name: codeTypeName,
+	type: "object",
+	title: "Code",
+	description: "Syntax-highlighted code block with language selection.",
+	icon: createSanityIcon(CodeIcon),
+	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 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 Sidebar(props) {
-	let $ = c(14), { sidebarTitle } = useHandbookContext(), sections = useSections(), t0;
-	$[0] === sections ? t0 = $[1] : (t0 = sections.flatMap(_temp2), $[0] = sections, $[1] = t0);
-	let items = t0, t1;
-	$[2] === items ? t1 = $[3] : (t1 = function getItemDisabled(virtualIndex) {
-		return items[virtualIndex]?.type === "heading";
-	}, $[2] = items, $[3] = t1);
-	let getItemDisabled = t1, t2;
-	$[4] === sidebarTitle ? t2 = $[5] : (t2 = /* @__PURE__ */ jsx(PaneHeader, { title: sidebarTitle }), $[4] = sidebarTitle, $[5] = t2);
+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;
-	$[6] !== getItemDisabled || $[7] !== items || $[8] !== sidebarTitle ? (t3 = /* @__PURE__ */ jsx(PaneContent, {
-		overflow: "auto",
-		children: /* @__PURE__ */ jsx(CommandList, {
-			activeItemDataAttr: "data-hovered",
-			ariaLabel: sidebarTitle,
-			canReceiveFocus: !0,
-			getItemDisabled,
-			itemHeight: 37,
-			items,
-			onlyShowSelectionWhenActive: !0,
-			paddingBottom: 1,
-			paddingX: 3,
-			renderItem: _temp3,
-			wrapAround: !1
-		})
-	}), $[6] = getItemDisabled, $[7] = items, $[8] = sidebarTitle, $[9] = t3) : t3 = $[9];
-	let t4;
-	return $[10] !== props || $[11] !== t2 || $[12] !== t3 ? (t4 = /* @__PURE__ */ jsxs(Pane, {
-		id: "handbook-sidebar",
-		currentMaxWidth: 350,
-		minWidth: 320,
-		maxWidth: 640,
+	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: [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
-	});
+		children: [
+			t0,
+			t1,
+			t2
+		]
+	}), $[3] = props, $[4] = t3), t3;
 }
-function _temp2(t0) {
-	let { title, entries } = t0;
-	return [{
-		type: "heading",
-		title
-	}, ...entries.map(_temp)];
+const horizontalRuleType = defineType({
+	name: horizontalRuleTypeName,
+	type: "object",
+	title: "Horizontal Rule",
+	description: "Visual divider between sections of content.",
+	icon: createSanityIcon(SeparatorHorizontalIcon),
+	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 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 _temp(entry) {
-	return {
-		type: "tab",
-		id: entry.id,
-		label: entry.title,
-		icon: entry.icon
-	};
+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;
 }
-function Panes() {
-	let $ = c(10), { activeTab, sidebarExpanded } = useHandbookContext(), paneLayout = useContext(PaneLayoutContext), t0;
-	$[0] === activeTab ? t0 = $[1] : (t0 = isDefined(activeTab), $[0] = activeTab, $[1] = t0);
-	let hasContent = t0;
-	if (paneLayout?.collapsed === !0) {
-		let t1;
-		return $[2] !== hasContent || $[3] !== sidebarExpanded ? (t1 = jsx(sidebarExpanded || !hasContent ? Sidebar : Content, {}), $[2] = hasContent, $[3] = sidebarExpanded, $[4] = t1) : t1 = $[4], t1;
-	}
+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: "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",
+			type: "string",
+			title: "Alternative Text",
+			description: "Describes what the image shows for people who cannot see it. Don't repeat the caption here."
+		})
+	]
+});
+function VideoPreview(t0) {
+	let $ = c(4), { url, caption } = t0;
+	if (!isDefined(url)) return null;
 	let t1;
-	$[5] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(Sidebar, {}), $[5] = t1) : t1 = $[5];
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = { padding: 8 }, $[0] = t1) : t1 = $[0];
 	let t2;
-	$[6] === hasContent ? t2 = $[7] : (t2 = hasContent && /* @__PURE__ */ jsx(Content, {}), $[6] = hasContent, $[7] = t2);
-	let t3;
-	return $[8] === t2 ? t3 = $[9] : (t3 = /* @__PURE__ */ jsxs(Fragment, { children: [t1, t2] }), $[8] = t2, $[9] = t3), t3;
+	return $[1] !== caption || $[2] !== url ? (t2 = /* @__PURE__ */ jsx(VideoContent, {
+		url,
+		caption,
+		style: t1
+	}), $[1] = caption, $[2] = url, $[3] = t2) : t2 = $[3], t2;
 }
-function HandbookTool(t0) {
-	let $ = c(10), { tool: t1 } = t0, { options } = t1, { media } = useTheme_v2(), [layoutCollapsed, setLayoutCollapsed] = useState(!1), t2;
-	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t2 = function handleCollapse() {
-		setLayoutCollapsed(!0);
-	}, $[0] = t2) : t2 = $[0];
-	let handleCollapse = t2, t3;
-	$[1] === Symbol.for("react.memo_cache_sentinel") ? (t3 = function handleExpand() {
-		setLayoutCollapsed(!1);
-	}, $[1] = t3) : t3 = $[1];
-	let handleExpand = t3;
-	if (!isDefined(options)) return null;
-	let t4 = layoutCollapsed ? void 0 : "fill", t5, t6;
-	$[2] === Symbol.for("react.memo_cache_sentinel") ? (t5 = {
-		minHeight: "100%",
-		minWidth: "320px"
-	}, t6 = /* @__PURE__ */ jsx(Panes, {}), $[2] = t5, $[3] = t6) : (t5 = $[2], t6 = $[3]);
-	let t7;
-	$[4] !== media[1] || $[5] !== t4 ? (t7 = /* @__PURE__ */ jsx(PaneLayout, {
-		flex: 1,
-		height: t4,
-		minWidth: media[1],
-		onCollapse: handleCollapse,
-		onExpand: handleExpand,
-		style: t5,
-		children: t6
-	}), $[4] = media[1], $[5] = t4, $[6] = t7) : t7 = $[6];
+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 $[7] !== options || $[8] !== t7 ? (t8 = /* @__PURE__ */ jsx(HandbookProvider, {
-		...options,
-		children: t7
-	}), $[7] = options, $[8] = t7, $[9] = t8) : t8 = $[9], 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: "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."
+	})]
+});
+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;
 }
-/** Editors the plugin was configured with, so the Structure helper need not be handed them a second time. */
-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.
+* Creates the Portable Text content field for Handbook guides, offering the built-in blocks alongside
+* any a consumer registered.
 *
-* @param editors - Email addresses permitted to edit Handbook documents.
+* @param customBlocks - Custom block definitions registered by the consumer.
+* @returns A field definition for the guide content array.
 */
-function setConfiguredEditors(editors) {
-	configuredEditors = editors;
+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
+			}))
+		]
+	});
 }
 /**
-* Checks whether an email address is permitted to edit, treating an absent list as unrestricted access.
+* Creates the document type a single guide is authored as, with its content field offering the
+* built-in blocks alongside any a consumer registered.
 *
-* @param editors - Email addresses permitted to edit, defaulting to the configured list.
-* @param email - The email address to check.
-* @returns Whether the email is permitted to edit.
+* @param customBlocks - Custom block definitions registered by the consumer.
+* @returns A document type definition for Handbook guides.
 */
-function isPermittedEditor(editors, email) {
-	let permitted = editors ?? configuredEditors;
-	return isDefined(permitted) ? isDefined(email) ? permitted.includes(email) : !1 : !0;
+function createGuideType(customBlocks = []) {
+	return defineType({
+		name: guideTypeName,
+		type: "document",
+		title: "Handbook Guide",
+		description: "Handbook page authored with rich text, images, and custom blocks.",
+		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: "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)
+		]
+	});
 }
-/**
-* 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 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: "Defines the groups of guides shown in the Handbook sidebar, and the order they appear in.",
+	icon: createSanityIcon(BookTextIcon),
+	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",
+			description: "Named section of the Handbook sidebar holding an ordered list of guides.",
+			icon: createSanityIcon(ListPlusIcon),
+			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()
+					};
+				}
+			}
+		})]
+	})]
+}), handbookPlugin = definePlugin((config) => {
 	let { title, sidebarTitle, roles, blocks, editors, undocumentedFieldMessage } = config;
 	setConfiguredEditors(editors);
 	let resolved = {
@@ -2759,7 +2811,7 @@ const handbookPlugin = definePlugin((config) => {
 		undocumentedFieldMessage: undocumentedFieldMessage ?? "This field has not been documented yet. Contact your development team for guidance."
 	}, guideType = createGuideType(resolved.blocks);
 	return {
-		name: "@driftime/sanity-plugin-handbook",
+		name: pluginName,
 		schema: { types: [
 			handbookType,
 			guideType,