@driftime/sanity-plugin-font 0.0.0-stage → 0.1.1

package/dist/index.js

@@ -0,0 +1,2364 @@
+import { a as defaultStyles, c as logger, i as defaultSources, l as pluginName, n as parseWeights, o as defaultSubsets, r as apiVersion, s as defaultWeights, t as parseCatalog } from "./catalog-KAqAIjzw.js";
+import { n as isRecord, t as isDefined } from "./utils-BV38iODp.js";
+import { n as createStylesheetUrl, t as getFamilyName } from "./family-BAGnEjZg.js";
+import { a as fontStyles, i as fontSources, o as fontTypeName, r as fontFileTypeName, s as fontWeights, t as fontCategories } from "./types-DheP5tax.js";
+import { ChangeIndicator, FieldActionsProvider, FieldActionsResolver, FormField, defineArrayMember, defineField, definePlugin, defineType, getPublishedId, insert, set, setIfMissing, unset, useClient, useFormValue } from "sanity";
+import { c } from "react/compiler-runtime";
+import { createContext, createElement, useContext, useEffect, useRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Badge, Box, Button, Card, Dialog, Flex, Grid, Select, Spinner, Stack, Tab, TabList, TabPanel, Text, TextInput } from "@sanity/ui";
+import { randomKey } from "@sanity/util/content";
+import { BinaryDocumentIcon } from "@sanity/icons/BinaryDocument";
+import { UploadIcon } from "@sanity/icons/Upload";
+import { TrashIcon } from "@sanity/icons/Trash";
+import { CloseIcon } from "@sanity/icons/Close";
+import { EarthGlobeIcon } from "@sanity/icons/EarthGlobe";
+import { WarningOutlineIcon } from "@sanity/icons/WarningOutline";
+import { SearchIcon } from "@sanity/icons/Search";
+import { fontCatalog } from "@driftime/sanity-plugin-font/catalog";
+/**
+* Checks whether a form node has members, as objects and arrays of objects do.
+*
+* @param node - The form node to check.
+* @returns True if the node has members.
+*/
+function hasMembers(node) {
+	return "members" in node;
+}
+/**
+* Collects the validation on a form node and everything inside it.
+*
+* @param node - The form node.
+* @returns Every validation result on the node or inside it.
+*/
+function collectNodeValidation(node) {
+	return [...node.validation, ...hasMembers(node) ? collectMemberValidation(node.members) : []];
+}
+/**
+* Collects the validation anywhere inside a field's members. The form only passes a field the
+* validation at its own path, so a field that hides its members would otherwise show none of theirs.
+*
+* @param members - The members.
+* @returns Every validation result on the members or inside them.
+*/
+function collectMemberValidation(members) {
+	return members.flatMap((member) => member.kind === "field" ? collectNodeValidation(member.field) : member.kind === "fieldSet" ? collectMemberValidation(member.fieldSet.members) : member.kind === "item" ? collectNodeValidation(member.item) : []);
+}
+function Field(t0) {
+	let $ = c(40), { actions, schemaType, title, description, presence, validation, level, inputId, path, changed, children, inputProps } = t0, t1;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = [], $[0] = t1) : t1 = $[0];
+	let [headerActions, setHeaderActions] = useState(t1), t2;
+	$[1] === Symbol.for("react.memo_cache_sentinel") ? (t2 = ["_id"], $[1] = t2) : t2 = $[1];
+	let documentId = useFormValue(t2), fieldValidation, focused, t3;
+	if ($[2] !== actions || $[3] !== documentId || $[4] !== inputProps.focused || $[5] !== inputProps.members || $[6] !== path || $[7] !== schemaType || $[8] !== validation) {
+		let publishedId = typeof documentId == "string" ? getPublishedId(documentId) : void 0;
+		focused = inputProps.focused === !0;
+		let t4;
+		$[12] !== inputProps.members || $[13] !== validation ? (t4 = [...validation, ...collectMemberValidation(inputProps.members)], $[12] = inputProps.members, $[13] = validation, $[14] = t4) : t4 = $[14], fieldValidation = t4, t3 = isDefined(publishedId) && isDefined(actions) && /* @__PURE__ */ jsx(FieldActionsResolver, {
+			actions,
+			documentId: publishedId,
+			documentType: schemaType.name,
+			onActions: setHeaderActions,
+			path,
+			schemaType
+		}), $[2] = actions, $[3] = documentId, $[4] = inputProps.focused, $[5] = inputProps.members, $[6] = path, $[7] = schemaType, $[8] = validation, $[9] = fieldValidation, $[10] = focused, $[11] = t3;
+	} else fieldValidation = $[9], focused = $[10], t3 = $[11];
+	let t4;
+	$[15] !== changed || $[16] !== children || $[17] !== focused || $[18] !== path ? (t4 = /* @__PURE__ */ jsx(ChangeIndicator, {
+		path,
+		hasFocus: focused,
+		isChanged: changed,
+		children
+	}), $[15] = changed, $[16] = children, $[17] = focused, $[18] = path, $[19] = t4) : t4 = $[19];
+	let t5;
+	$[20] !== description || $[21] !== fieldValidation || $[22] !== headerActions || $[23] !== inputId || $[24] !== inputProps.readOnly || $[25] !== level || $[26] !== path || $[27] !== presence || $[28] !== schemaType.deprecated || $[29] !== t4 || $[30] !== title ? (t5 = /* @__PURE__ */ jsx(FormField, {
+		__unstable_headerActions: headerActions,
+		__unstable_presence: presence,
+		description,
+		inputId,
+		level,
+		title,
+		validation: fieldValidation,
+		deprecated: schemaType.deprecated,
+		path,
+		readOnly: inputProps.readOnly,
+		children: t4
+	}), $[20] = description, $[21] = fieldValidation, $[22] = headerActions, $[23] = inputId, $[24] = inputProps.readOnly, $[25] = level, $[26] = path, $[27] = presence, $[28] = schemaType.deprecated, $[29] = t4, $[30] = title, $[31] = t5) : t5 = $[31];
+	let t6;
+	$[32] !== focused || $[33] !== headerActions || $[34] !== path || $[35] !== t5 ? (t6 = /* @__PURE__ */ jsx(FieldActionsProvider, {
+		actions: headerActions,
+		focused,
+		path,
+		children: t5
+	}), $[32] = focused, $[33] = headerActions, $[34] = path, $[35] = t5, $[36] = t6) : t6 = $[36];
+	let t7;
+	return $[37] !== t3 || $[38] !== t6 ? (t7 = /* @__PURE__ */ jsxs(Fragment$1, { children: [t3, t6] }), $[37] = t3, $[38] = t6, $[39] = t7) : t7 = $[39], t7;
+}
+function Hidden() {
+	return null;
+}
+/** Default props for the plugin's own icons. Icons from `@sanity/icons` already match the Studio. */
+const defaultIconProps = {
+	width: "1em",
+	height: "1em",
+	strokeWidth: 1.5
+};
+/**
+* Wraps an SVG icon component for use in the Studio.
+*
+* @param icon - The icon to wrap.
+* @param props - Props that override the Studio icon defaults.
+* @returns An icon component.
+*/
+function createSanityIcon(icon, props) {
+	let Icon = icon;
+	function SanityIcon() {
+		return createElement(Icon, {
+			...defaultIconProps,
+			...props
+		});
+	}
+	return SanityIcon;
+}
+function DropZone(t0) {
+	let $ = c(28), onFiles, props, readOnly;
+	$[0] === t0 ? (onFiles = $[1], props = $[2], readOnly = $[3]) : ({readOnly, onFiles, ...props} = t0, $[0] = t0, $[1] = onFiles, $[2] = props, $[3] = readOnly);
+	let [dragging, setDragging] = useState(!1), input = useRef(null), t1;
+	$[4] === readOnly ? t1 = $[5] : (t1 = function handleDragOver(event) {
+		readOnly !== !0 && (event.preventDefault(), setDragging(!0));
+	}, $[4] = readOnly, $[5] = t1);
+	let handleDragOver = t1, t2;
+	$[6] !== onFiles || $[7] !== readOnly ? (t2 = function handleDrop(event_0) {
+		event_0.preventDefault(), setDragging(!1), readOnly !== !0 && onFiles([...event_0.dataTransfer.files]);
+	}, $[6] = onFiles, $[7] = readOnly, $[8] = t2) : t2 = $[8];
+	let handleDrop = t2, t3 = readOnly === !0 ? "transparent" : "inherit", t4;
+	$[9] === Symbol.for("react.memo_cache_sentinel") ? (t4 = () => {
+		setDragging(!1);
+	}, $[9] = t4) : t4 = $[9];
+	let t5;
+	$[10] === Symbol.for("react.memo_cache_sentinel") ? (t5 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		muted: !0,
+		children: /* @__PURE__ */ jsx(BinaryDocumentIcon, {})
+	}), $[10] = t5) : t5 = $[10];
+	let t6 = dragging ? "Drop to upload files" : "Drag WOFF2 or WOFF files here", t7;
+	$[11] === t6 ? t7 = $[12] : (t7 = /* @__PURE__ */ jsxs(Flex, {
+		flex: 1,
+		align: "center",
+		gap: 3,
+		paddingLeft: 1,
+		children: [t5, /* @__PURE__ */ jsx(Text, {
+			size: 1,
+			muted: !0,
+			children: t6
+		})]
+	}), $[11] = t6, $[12] = t7);
+	let t8;
+	$[13] === Symbol.for("react.memo_cache_sentinel") ? (t8 = () => {
+		input.current?.click();
+	}, $[13] = t8) : t8 = $[13];
+	let t9;
+	$[14] === readOnly ? t9 = $[15] : (t9 = /* @__PURE__ */ jsx(Button, {
+		type: "button",
+		mode: "bleed",
+		icon: UploadIcon,
+		text: "Upload",
+		disabled: readOnly,
+		onClick: t8
+	}), $[14] = readOnly, $[15] = t9);
+	let t10;
+	$[16] === onFiles ? t10 = $[17] : (t10 = /* @__PURE__ */ jsx("input", {
+		ref: input,
+		type: "file",
+		accept: ".woff2,.woff",
+		multiple: !0,
+		hidden: !0,
+		onChange: (event_1) => {
+			onFiles([...event_1.currentTarget.files ?? []]), event_1.currentTarget.value = "";
+		}
+	}), $[16] = onFiles, $[17] = t10);
+	let t11;
+	$[18] !== t10 || $[19] !== t7 || $[20] !== t9 ? (t11 = /* @__PURE__ */ jsxs(Flex, {
+		align: "center",
+		gap: 4,
+		justify: "space-between",
+		children: [
+			t7,
+			t9,
+			t10
+		]
+	}), $[18] = t10, $[19] = t7, $[20] = t9, $[21] = t11) : t11 = $[21];
+	let t12;
+	return $[22] !== handleDragOver || $[23] !== handleDrop || $[24] !== props || $[25] !== t11 || $[26] !== t3 ? (t12 = /* @__PURE__ */ jsx(Card, {
+		tone: t3,
+		border: !0,
+		paddingX: 3,
+		paddingY: 2,
+		radius: 2,
+		onDragOver: handleDragOver,
+		onDragLeave: t4,
+		onDrop: handleDrop,
+		...props,
+		children: t11
+	}), $[22] = handleDragOver, $[23] = handleDrop, $[24] = props, $[25] = t11, $[26] = t3, $[27] = t12) : t12 = $[27], t12;
+}
+/** Reads each `@font-face` rule in a Google Fonts stylesheet. */
+const fontFacePattern = /@font-face\s*\{(?<body>[^}]*)\}/gu;
+/**
+* Reads the files, weights, and styles out of a Google Fonts stylesheet.
+*
+* @param css - The stylesheet.
+* @returns The files.
+*/
+function parseStylesheet(css) {
+	return [...css.matchAll(fontFacePattern)].flatMap(({ groups }) => {
+		let body = groups?.body ?? "", url = /src:\s*url\((?<url>[^)]+)\)/u.exec(body)?.groups?.url, weight = /font-weight:\s*(?<weight>[\d ]+);/u.exec(body)?.groups?.weight, style = /font-style:\s*(?<style>\w+);/u.exec(body)?.groups?.style;
+		return isDefined(url) && isDefined(weight) && isDefined(style) ? [{
+			url,
+			weight,
+			style
+		}] : [];
+	});
+}
+/**
+* Lists the files a sample loads.
+*
+* @param sample - The sample.
+* @returns The files, or undefined when Google Fonts couldn't be reached.
+*/
+async function listFaceSources(sample) {
+	if (sample.source === "upload") return sample.files.map(({ url, weight, maxWeight, style }) => ({
+		url,
+		weight: isDefined(maxWeight) && maxWeight > weight ? `${weight} ${maxWeight}` : `${weight}`,
+		style
+	}));
+	let { family, weights, styles, text } = sample, response = await fetch(createStylesheetUrl(family, weights, styles, "swap", text));
+	if (response.ok) return parseStylesheet(await response.text());
+}
+/**
+* Loads a sample's files and registers them with the document under a name of their own, so a cut-down font made
+* for a preview never stands in for the real one anywhere else in the Studio.
+*
+* @param sample - The sample.
+* @param name - Name to register the files under.
+* @returns The name, or undefined when the files couldn't be loaded.
+*/
+async function loadSample(sample, name) {
+	try {
+		let sources = await listFaceSources(sample);
+		if (!isDefined(sources)) return;
+		let faces = await Promise.all(sources.map(async ({ url, weight, style }) => {
+			let face = new FontFace(name, `url(${url})`, {
+				weight,
+				style
+			});
+			return await face.load(), face;
+		}));
+		for (let face of faces) document.fonts.add(face);
+		return name;
+	} catch {
+		return;
+	}
+}
+/** Sample requests shared by every field in the session, keyed by what they load, since a font file never changes. */
+const sampleRequests = /* @__PURE__ */ new Map();
+/** Number of samples requested so far, which names each one uniquely even after a failed one is retried. */
+let sampleCount = 0;
+/** Names of the samples that have loaded, keyed like the requests, so a sample shown again appears straight away. */
+const loadedSamples = /* @__PURE__ */ new Map();
+/**
+* Builds the key a sample is requested under.
+*
+* @param sample - The sample.
+* @returns The key.
+*/
+function getSampleKey(sample) {
+	return JSON.stringify(sample);
+}
+/**
+* Loads a sample, reusing a request already made for the same files. A request that fails is forgotten, so a file that
+* was still uploading loads the next time it's shown.
+*
+* @param sample - The sample.
+* @returns Name the files are registered under, or undefined when they couldn't be loaded.
+*/
+async function requestSample(sample) {
+	let key = getSampleKey(sample), request = sampleRequests.get(key);
+	isDefined(request) || (sampleCount += 1, request = loadSample(sample, `font-sample-${sampleCount}`), sampleRequests.set(key, request));
+	let name = await request;
+	return isDefined(name) ? loadedSamples.set(key, name) : sampleRequests.delete(key), name;
+}
+/**
+* Reads a sample that has already loaded, without waiting.
+*
+* @param key - The sample's key.
+* @returns Name the files are registered under, or undefined when the sample hasn't loaded.
+*/
+function readLoadedSample(key) {
+	return loadedSamples.get(key);
+}
+/**
+* Loads a font sample. A sample that has already loaded is returned straight away, so it never flashes in the
+* Studio's own font when it's shown again.
+*
+* @param sample - The sample, or undefined when there's nothing to show.
+* @returns Name to set as the `font-family`, or undefined until the sample has loaded, and whether it's still loading.
+*/
+function useFontSample(sample) {
+	let $ = c(14), [settled, setSettled] = useState(), key, t0;
+	$[0] === sample ? (key = $[1], t0 = $[2]) : (key = isDefined(sample) ? getSampleKey(sample) : void 0, t0 = isDefined(key) ? readLoadedSample(key) : void 0, $[0] = sample, $[1] = key, $[2] = t0);
+	let cached = t0, t1, t2;
+	$[3] !== key || $[4] !== sample ? (t1 = () => {
+		if (!isDefined(sample) || !isDefined(key) || isDefined(readLoadedSample(key))) return;
+		let active = !0;
+		return (async function load(wanted, wantedKey) {
+			let name = await requestSample(wanted);
+			active && setSettled({
+				key: wantedKey,
+				name
+			});
+		})(sample, key), () => {
+			active = !1;
+		};
+	}, t2 = [sample, key], $[3] = key, $[4] = sample, $[5] = t1, $[6] = t2) : (t1 = $[5], t2 = $[6]), useEffect(t1, t2);
+	let result = settled?.key === key ? settled : void 0, name_0 = cached ?? result?.name, t3;
+	$[7] !== key || $[8] !== name_0 || $[9] !== result ? (t3 = isDefined(key) && !isDefined(name_0) && !isDefined(result), $[7] = key, $[8] = name_0, $[9] = result, $[10] = t3) : t3 = $[10];
+	let t4;
+	return $[11] !== name_0 || $[12] !== t3 ? (t4 = {
+		name: name_0,
+		loading: t3
+	}, $[11] = name_0, $[12] = t3, $[13] = t4) : t4 = $[13], t4;
+}
+/** Name type designers give each weight. */
+const fontWeightLabels = {
+	100: "Thin",
+	200: "ExtraLight",
+	300: "Light",
+	400: "Regular",
+	500: "Medium",
+	600: "SemiBold",
+	700: "Bold",
+	800: "ExtraBold",
+	900: "Black"
+};
+/**
+* Lists every combination of the weights and styles, lightest first, with each weight's italic after its normal.
+*
+* @param weights - The weights.
+* @param styles - The styles.
+* @returns The combinations.
+*/
+function listVariants(weights, styles) {
+	return weights.flatMap((weight) => styles.map((style) => ({
+		weight,
+		style
+	})));
+}
+/**
+* Names a weight and style the way type designers do, such as "Bold Italic".
+*
+* @param variant - The weight and style.
+* @returns The name.
+*/
+function describeVariant({ weight, style }) {
+	let label = fontWeightLabels[weight];
+	return style === "normal" ? label : weight === 400 ? "Italic" : `${label} Italic`;
+}
+/**
+* Names the weights and style a file holds, such as "Bold Italic", or "Thin to Black" for a variable font.
+*
+* @param file - The file's weight, heaviest weight, and style.
+* @returns The name.
+*/
+function describeFile({ weight, maxWeight, style }) {
+	if (!isDefined(weight)) return "Font file";
+	if (!isDefined(maxWeight)) return describeVariant({
+		weight,
+		style: style ?? "normal"
+	});
+	let range = `${fontWeightLabels[weight]} to ${fontWeightLabels[maxWeight]}`;
+	return style === "italic" ? `${range} Italic` : range;
+}
+/**
+* Checks whether a Google family has every weight, style, and character set a field requires.
+*
+* @param family - The family.
+* @param variants - The weights and styles required.
+* @param subsets - The character sets required.
+* @returns Whether the family meets them all.
+*/
+function meetsRequirements(family, variants, subsets) {
+	let { weights, italics } = family;
+	return variants.every(({ weight, style }) => (style === "italic" ? italics : weights).includes(weight)) && subsets.every((subset) => family.subsets.includes(subset));
+}
+/**
+* Checks whether an uploaded file holds a weight and style, counting every weight a variable font file covers.
+*
+* @param file - The file.
+* @param variant - The weight and style.
+* @returns Whether the file holds it.
+*/
+function holdsVariant(file, { weight, style }) {
+	let { weight: lightest, maxWeight, style: fileStyle } = file;
+	return !isDefined(file.asset?._ref) || !isDefined(lightest) || (fileStyle ?? "normal") !== style ? !1 : weight === lightest || isDefined(maxWeight) && weight >= lightest && weight <= maxWeight;
+}
+/**
+* Identifies the weights and style a file holds, so two files holding the same ones can be told apart from the rest.
+*
+* @param file - The file's weight, heaviest weight, and style.
+* @returns The identifier.
+*/
+function getCoverageKey({ weight, maxWeight, style }) {
+	return `${weight ?? ""}-${maxWeight ?? ""}-${style ?? "normal"}`;
+}
+/**
+* Lists the uploaded files that hold the same weights and style as a file before them.
+*
+* @param files - The uploaded files, in order.
+* @returns The repeated files.
+*/
+function findDuplicateFiles(files) {
+	let seen = /* @__PURE__ */ new Set();
+	return files.filter((file) => {
+		if (!isDefined(file.weight)) return !1;
+		let coverage = getCoverageKey(file), repeated = seen.has(coverage);
+		return seen.add(coverage), repeated;
+	});
+}
+/**
+* Lists the weights and styles the uploaded files actually hold, for showing them. A variable font file shows the
+* required weights within its range, or its lightest and heaviest when none are.
+*
+* @param files - The uploaded files.
+* @param required - The weights and styles the field requires.
+* @returns The weights and styles, lightest first, with each weight's italic after its normal.
+*/
+function listFileVariants(files, required) {
+	let variants = files.flatMap(({ asset, weight, maxWeight, style = "normal" }) => {
+		if (!isDefined(asset?._ref) || !isDefined(weight)) return [];
+		if (!isDefined(maxWeight)) return [{
+			weight,
+			style
+		}];
+		let inRange = required.filter((variant) => variant.style === style && variant.weight >= weight && variant.weight <= maxWeight);
+		return isDefined(inRange) ? inRange : [{
+			weight,
+			style
+		}, {
+			weight: maxWeight,
+			style
+		}];
+	});
+	return [...new Map(variants.map((variant) => [`${variant.weight}-${variant.style}`, variant])).values()].toSorted((first, second) => first.weight - second.weight || +(first.style === "italic") - (second.style === "italic"));
+}
+/**
+* Lists the weights and styles a field requires that no uploaded file holds.
+*
+* @param files - The uploaded files.
+* @param variants - The weights and styles required.
+* @returns The missing weights and styles.
+*/
+function listMissingVariants(files, variants) {
+	return variants.filter((variant) => !files.some((file) => holdsVariant(file, variant)));
+}
+function FileRow(t0) {
+	let $ = c(52), duplicate, filename, maxWeight, onRemove, props, readOnly, style, uploading, url, weight;
+	$[0] === t0 ? (duplicate = $[1], filename = $[2], maxWeight = $[3], onRemove = $[4], props = $[5], readOnly = $[6], style = $[7], uploading = $[8], url = $[9], weight = $[10]) : ({url, weight, maxWeight, style, filename, uploading, duplicate, readOnly, onRemove, ...props} = t0, $[0] = t0, $[1] = duplicate, $[2] = filename, $[3] = maxWeight, $[4] = onRemove, $[5] = props, $[6] = readOnly, $[7] = style, $[8] = uploading, $[9] = url, $[10] = weight);
+	let t1;
+	$[11] !== maxWeight || $[12] !== style || $[13] !== weight ? (t1 = describeFile({
+		weight,
+		maxWeight,
+		style
+	}), $[11] = maxWeight, $[12] = style, $[13] = weight, $[14] = t1) : t1 = $[14];
+	let label = t1, t2;
+	$[15] !== maxWeight || $[16] !== style || $[17] !== url || $[18] !== weight ? (t2 = isDefined(url) && isDefined(weight) ? {
+		source: "upload",
+		files: [{
+			url,
+			weight,
+			...isDefined(maxWeight) && { maxWeight },
+			style: style ?? "normal"
+		}]
+	} : void 0, $[15] = maxWeight, $[16] = style, $[17] = url, $[18] = weight, $[19] = t2) : t2 = $[19];
+	let { name, loading } = useFontSample(t2), t3 = duplicate ? "caution" : "default", t4;
+	$[20] === Symbol.for("react.memo_cache_sentinel") ? (t4 = {
+		width: 40,
+		flexShrink: 0
+	}, $[20] = t4) : t4 = $[20];
+	let t5;
+	$[21] === name ? t5 = $[22] : (t5 = isDefined(name) ? `"${name}"` : void 0, $[21] = name, $[22] = t5);
+	let t6 = +!loading, t7;
+	$[23] !== style || $[24] !== t5 || $[25] !== t6 || $[26] !== weight ? (t7 = /* @__PURE__ */ jsx(Box, {
+		style: t4,
+		children: /* @__PURE__ */ jsx(Text, {
+			size: 3,
+			align: "center",
+			style: {
+				fontFamily: t5,
+				fontWeight: weight,
+				fontStyle: style,
+				opacity: t6,
+				transition: "opacity 150ms ease-out"
+			},
+			children: "Aa"
+		})
+	}), $[23] = style, $[24] = t5, $[25] = t6, $[26] = weight, $[27] = t7) : t7 = $[27];
+	let t8;
+	$[28] === Symbol.for("react.memo_cache_sentinel") ? (t8 = { minWidth: 0 }, $[28] = t8) : t8 = $[28];
+	let t9;
+	$[29] === label ? t9 = $[30] : (t9 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		weight: "medium",
+		textOverflow: "ellipsis",
+		children: label
+	}), $[29] = label, $[30] = t9);
+	let t10;
+	$[31] === filename ? t10 = $[32] : (t10 = isDefined(filename) && /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		muted: !0,
+		textOverflow: "ellipsis",
+		translate: "no",
+		children: filename
+	}), $[31] = filename, $[32] = t10);
+	let t11;
+	$[33] !== t10 || $[34] !== t9 ? (t11 = /* @__PURE__ */ jsxs(Stack, {
+		flex: 1,
+		gap: 2,
+		style: t8,
+		children: [t9, t10]
+	}), $[33] = t10, $[34] = t9, $[35] = t11) : t11 = $[35];
+	let t12;
+	$[36] === duplicate ? t12 = $[37] : (t12 = duplicate && /* @__PURE__ */ jsx(Badge, {
+		tone: "caution",
+		children: "Duplicate"
+	}), $[36] = duplicate, $[37] = t12);
+	let t13 = readOnly === !0 || uploading, t14 = uploading ? `Uploading ${label}` : `Remove ${label}`, t15;
+	$[38] !== onRemove || $[39] !== t13 || $[40] !== t14 || $[41] !== uploading ? (t15 = /* @__PURE__ */ jsx(Button, {
+		type: "button",
+		mode: "bleed",
+		tone: "critical",
+		icon: TrashIcon,
+		loading: uploading,
+		disabled: t13,
+		onClick: onRemove,
+		"aria-label": t14
+	}), $[38] = onRemove, $[39] = t13, $[40] = t14, $[41] = uploading, $[42] = t15) : t15 = $[42];
+	let t16;
+	$[43] !== t11 || $[44] !== t12 || $[45] !== t15 || $[46] !== t7 ? (t16 = /* @__PURE__ */ jsxs(Flex, {
+		align: "center",
+		gap: 3,
+		children: [
+			t7,
+			t11,
+			t12,
+			t15
+		]
+	}), $[43] = t11, $[44] = t12, $[45] = t15, $[46] = t7, $[47] = t16) : t16 = $[47];
+	let t17;
+	return $[48] !== props || $[49] !== t16 || $[50] !== t3 ? (t17 = /* @__PURE__ */ jsx(Card, {
+		padding: 3,
+		radius: 2,
+		border: !0,
+		tone: t3,
+		...props,
+		children: t16
+	}), $[48] = props, $[49] = t16, $[50] = t3, $[51] = t17) : t17 = $[51], t17;
+}
+const FilesContext = createContext(void 0);
+/**
+* Reads what the font field shares with its files input.
+*
+* @returns A function that fills in the family name and kind of typeface.
+* @throws When used outside the provider.
+*/
+function useFilesContext() {
+	let filesContext = useContext(FilesContext);
+	if (!isDefined(filesContext)) throw Error(logger.format("The files input is only available inside a font field."));
+	return filesContext;
+}
+/**
+* Provides a way to fill in the font's family name and kind of typeface to its files input.
+*
+* @returns The provider.
+*/
+function FilesProvider(t0) {
+	let $ = c(5), { fillDetails, children } = t0, t1;
+	$[0] === fillDetails ? t1 = $[1] : (t1 = { fillDetails }, $[0] = fillDetails, $[1] = t1);
+	let t2;
+	return $[2] !== children || $[3] !== t1 ? (t2 = /* @__PURE__ */ jsx(FilesContext, {
+		value: t1,
+		children
+	}), $[2] = children, $[3] = t1, $[4] = t2) : t2 = $[4], t2;
+}
+/**
+* Looks up the original filenames of uploaded file assets, which the stored references don't carry.
+*
+* @param references - IDs of the assets.
+* @returns Each filename, keyed by asset ID, once they've loaded.
+*/
+function useAssetFilenames(references) {
+	let $ = c(8), t0;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = { apiVersion }, $[0] = t0) : t0 = $[0];
+	let client = useClient(t0), t1;
+	$[1] === Symbol.for("react.memo_cache_sentinel") ? (t1 = {}, $[1] = t1) : t1 = $[1];
+	let [filenames, setFilenames] = useState(t1), t2;
+	$[2] === references ? t2 = $[3] : (t2 = references.toSorted().join(","), $[2] = references, $[3] = t2);
+	let key = t2, t3, t4;
+	return $[4] !== client || $[5] !== key ? (t3 = () => {
+		if (!isDefined(key)) return;
+		let active = !0;
+		return (async function load(ids) {
+			let assets = await client.fetch("*[_id in $ids] { _id, originalFilename }", { ids });
+			active && setFilenames(Object.fromEntries(assets.flatMap(_temp$2)));
+		})(key.split(",")), () => {
+			active = !1;
+		};
+	}, t4 = [client, key], $[4] = client, $[5] = key, $[6] = t3, $[7] = t4) : (t3 = $[6], t4 = $[7]), useEffect(t3, t4), filenames;
+}
+function _temp$2(t0) {
+	let { _id, originalFilename } = t0;
+	return isDefined(originalFilename) ? [[_id, originalFilename]] : [];
+}
+/**
+* Builds the address Sanity serves an uploaded file from, given its asset ID.
+*
+* @param reference - ID of the file asset, such as `file-abc123-woff2`.
+* @param projectId - ID of the Sanity project.
+* @param dataset - Name of the dataset.
+* @returns The address, or undefined when the ID isn't a file asset's.
+*/
+function createFileUrl(reference, projectId, dataset) {
+	let { hash, extension } = reference?.match(/^file-(?<hash>[\da-f]+)-(?<extension>\w+)$/u)?.groups ?? {};
+	if (isDefined(hash) && isDefined(extension)) return `https://cdn.sanity.io/files/${projectId}/${dataset}/${hash}.${extension}`;
+}
+/** Tables the details are read from. */
+const wantedTables = /* @__PURE__ */ new Set([
+	"OS/2",
+	"fvar",
+	"name",
+	"post"
+]), knownTags = /* @__PURE__ */ "cmap.head.hhea.hmtx.maxp.name.OS/2.post.cvt .fpgm.glyf.loca.prep.CFF .VORG.EBDT.EBLC.gasp.hdmx.kern.LTSH.PCLT.VDMX.vhea.vmtx.BASE.GDEF.GPOS.GSUB.EBSC.JSTF.MATH.CBDT.CBLC.COLR.CPAL.SVG .sbix.acnt.avar.bdat.bloc.bsln.cvar.fdsc.feat.fmtx.fvar.gvar.hsty.just.lcar.mort.morx.opbd.prop.trak.Zapf.Silf.Glat.Gloc.Feat.Sill".split(".");
+/**
+* Checks whether a value is the browser's decompression.
+*
+* @param value - The value to check.
+* @returns True if the value can be constructed.
+*/
+function isDecompressor(value) {
+	return typeof value == "function";
+}
+/**
+* Creates the browser's decompression for a format.
+*
+* @param format - The format.
+* @returns The decompression.
+* @throws When the browser has no decompression, or doesn't support the format.
+*/
+function createDecompression(format) {
+	let Decompression = globalThis.DecompressionStream;
+	if (!isDecompressor(Decompression)) throw Error("The browser can't decompress fonts.");
+	return new Decompression(format);
+}
+/**
+* Checks whether the browser can decompress Brotli itself.
+*
+* @returns Whether it can.
+*/
+function supportsBrotli() {
+	try {
+		return isDefined(createDecompression("brotli"));
+	} catch {
+		return !1;
+	}
+}
+/**
+* Decompresses bytes, with the browser's own decompression where it can. Chrome and Edge can't decompress Brotli yet,
+* so they load a decoder for it, and only when a WOFF2 file is read.
+*
+* @param data - The compressed bytes.
+* @param format - The compression: zlib for WOFF, or Brotli for WOFF2.
+* @returns The decompressed bytes.
+*/
+async function decompress(data, format) {
+	if (format === "brotli" && !supportsBrotli()) {
+		let { decompress: decode } = await import("brotli/decompress");
+		return decode(data);
+	}
+	let stream = new Blob([new Uint8Array(data)]).stream().pipeThrough(createDecompression(format));
+	return new Uint8Array(await new Response(stream).arrayBuffer());
+}
+/**
+* Reads four bytes as a table tag.
+*
+* @param view - The bytes.
+* @param offset - Where the tag starts.
+* @returns The tag.
+*/
+function readTag(view, offset) {
+	return String.fromCodePoint(view.getUint8(offset), view.getUint8(offset + 1), view.getUint8(offset + 2), view.getUint8(offset + 3));
+}
+/**
+* Finds the wanted tables in a WOFF file, each compressed on its own.
+*
+* @param view - The file.
+* @returns The tables.
+*/
+async function readWoffTables(view) {
+	let count = view.getUint16(12), entries = Array.from({ length: count }, (_, index) => {
+		let entry = 44 + index * 20;
+		return {
+			tag: readTag(view, entry),
+			offset: view.getUint32(entry + 4),
+			length: view.getUint32(entry + 8),
+			originalLength: view.getUint32(entry + 12)
+		};
+	}), tables = await Promise.all(entries.filter(({ tag }) => wantedTables.has(tag)).map(async ({ tag, offset, length, originalLength }) => {
+		let data = new Uint8Array(view.buffer, view.byteOffset + offset, length), table = length < originalLength ? await decompress(data, "deflate") : data;
+		return [tag, new DataView(table.buffer, table.byteOffset, table.byteLength)];
+	}));
+	return new Map(tables);
+}
+/**
+* Reads a WOFF2 variable-length number, which spends seven bits of each byte on the value.
+*
+* @param view - The file.
+* @param offset - Where the number starts.
+* @returns The number, and where the next value starts.
+*/
+function readBase128(view, offset) {
+	let value = 0;
+	for (let index = 0; index < 5; index += 1) {
+		let byte = view.getUint8(offset + index);
+		if (value = value * 128 + byte % 128, byte < 128) return {
+			value,
+			next: offset + index + 1
+		};
+	}
+	throw Error("The number is longer than WOFF2 allows.");
+}
+/**
+* Finds the wanted tables in a WOFF2 file, whose tables are compressed together. The tables read are never
+* transformed, so they're used exactly as they come out.
+*
+* @param view - The file.
+* @returns The tables, or undefined for a file of several fonts.
+*/
+async function readWoff2Tables(view) {
+	if (readTag(view, 4) === "ttcf") return;
+	let count = view.getUint16(12), compressedLength = view.getUint32(20), entries = [], offset = 48;
+	for (let index = 0; index < count; index += 1) {
+		let flags = view.getUint8(offset), known = knownTags[flags % 64], tag = known ?? readTag(view, offset + 1), version = Math.floor(flags / 64), original = readBase128(view, offset + (isDefined(known) ? 1 : 5)), stored = (tag === "glyf" || tag === "loca" ? version === 0 : version !== 0) ? readBase128(view, original.next) : void 0;
+		entries.push({
+			tag,
+			length: stored?.value ?? original.value
+		}), offset = stored?.next ?? original.next;
+	}
+	let data = await decompress(new Uint8Array(view.buffer, view.byteOffset + offset, compressedLength), "brotli"), tables = /* @__PURE__ */ new Map(), start = 0;
+	for (let { tag, length } of entries) wantedTables.has(tag) && tables.set(tag, new DataView(data.buffer, data.byteOffset + start, length)), start += length;
+	return tables;
+}
+/**
+* Rounds a weight to the nearest one a font can be loaded in.
+*
+* @param value - The weight.
+* @returns The nearest weight from 100 to 900.
+*/
+function roundWeight(value) {
+	let rounded = Math.min(900, Math.max(100, Math.round(value / 100) * 100));
+	return fontWeights.find((weight) => weight === rounded) ?? 400;
+}
+/**
+* Reads the weight range of a variable font from its axes.
+*
+* @param table - The `fvar` table, or undefined for a font that isn't variable.
+* @returns The lightest and heaviest weights, or undefined when the font has no weight axis.
+*/
+function readWeightAxis(table) {
+	if (!isDefined(table)) return;
+	let axesOffset = table.getUint16(4), axisCount = table.getUint16(8), axisSize = table.getUint16(10);
+	for (let index = 0; index < axisCount; index += 1) {
+		let axis = axesOffset + index * axisSize;
+		if (readTag(table, axis) === "wght") return {
+			min: table.getInt32(axis + 4) / 65536,
+			max: table.getInt32(axis + 12) / 65536
+		};
+	}
+}
+/**
+* Reads the kind of typeface from the classifications a font records about itself: the fixed-pitch flag for monospace,
+* then the IBM family class, then the PANOSE classification.
+*
+* @param metrics - The `OS/2` table.
+* @param post - The `post` table, or undefined when the file has none.
+* @returns The kind of typeface, or undefined when the font doesn't say.
+*/
+function readCategory(metrics, post) {
+	let familyClass = metrics.getUint8(30), panoseFamily = metrics.getUint8(32), panoseSerif = metrics.getUint8(33), panoseProportion = metrics.getUint8(35);
+	if (isDefined(post) && post.getUint32(12) !== 0 || panoseFamily === 2 && panoseProportion === 9) return "monospace";
+	if (familyClass >= 1 && familyClass <= 7) return "serif";
+	if (familyClass === 8) return "sans-serif";
+	if (familyClass === 9) return "display";
+	if (familyClass === 10 || panoseFamily === 3) return "handwriting";
+	if (panoseFamily === 4) return "display";
+	if (panoseFamily === 2 && panoseSerif >= 2 && panoseSerif <= 10) return "serif";
+	if (panoseFamily === 2 && panoseSerif >= 11 && panoseSerif <= 15) return "sans-serif";
+}
+/**
+* Reads the family name, preferring the typographic family over the legacy one, which can include the weight.
+*
+* @param table - The `name` table, or undefined when the file has none.
+* @returns The family name, or undefined when there isn't one.
+*/
+function readFamilyName(table) {
+	if (!isDefined(table)) return;
+	let count = table.getUint16(2), storage = table.getUint16(4), records = Array.from({ length: count }, (_, index) => {
+		let record = 6 + index * 12;
+		return {
+			platform: table.getUint16(record),
+			language: table.getUint16(record + 4),
+			name: table.getUint16(record + 6),
+			length: table.getUint16(record + 8),
+			offset: table.getUint16(record + 10)
+		};
+	});
+	for (let wanted of [16, 1]) {
+		let record = records.find(({ platform, language, name }) => platform === 3 && language === 1033 && name === wanted) ?? records.find(({ platform, name }) => platform === 3 && name === wanted) ?? records.find(({ platform, name }) => platform === 1 && name === wanted);
+		if (!isDefined(record)) continue;
+		let bytes = new Uint8Array(table.buffer, table.byteOffset + storage + record.offset, record.length), name = new TextDecoder(record.platform === 3 ? "utf-16be" : "macintosh").decode(bytes).trim();
+		if (isDefined(name)) return name;
+	}
+}
+/**
+* Reads a WOFF or WOFF2 file's family name, its weight or, for a variable font, its range of weights, and its style.
+*
+* @param buffer - The file.
+* @returns The details, or undefined when the file isn't a WOFF or WOFF2 font, holds several fonts, or can't be read.
+*/
+async function readFontFile(buffer) {
+	try {
+		let view = new DataView(buffer), signature = readTag(view, 0), tables;
+		signature === "wOFF" ? tables = await readWoffTables(view) : signature === "wOF2" && (tables = await readWoff2Tables(view));
+		let metrics = tables?.get("OS/2");
+		if (!isDefined(tables) || !isDefined(metrics)) return;
+		let selection = metrics.getUint16(62), axis = readWeightAxis(tables.get("fvar")), family = readFamilyName(tables.get("name")), category = readCategory(metrics, tables.get("post")), weight = roundWeight(axis?.min ?? metrics.getUint16(4)), maxWeight = isDefined(axis) ? roundWeight(axis.max) : void 0;
+		return {
+			...isDefined(family) && { family },
+			...isDefined(category) && { category },
+			weight,
+			...isDefined(maxWeight) && maxWeight > weight && { maxWeight },
+			style: selection % 2 == 1 || Math.floor(selection / 512) % 2 == 1 ? "italic" : "normal"
+		};
+	} catch {
+		return;
+	}
+}
+/**
+* Checks whether an array item is an uploaded font file.
+*
+* @param item - The item.
+* @returns True if the item is a font file.
+*/
+function isFontFile(item) {
+	return isRecord(item) && item._type === "fontFile" && typeof item._key == "string";
+}
+/**
+* Picks the family most of the files belong to, the earliest winning a tie, so one stray file doesn't decide it.
+*
+* @param families - Family name of each file, in order.
+* @returns The family, or undefined when no file names one.
+*/
+function findCommonFamily(families) {
+	let counts = /* @__PURE__ */ new Map();
+	for (let family of families) counts.set(family, (counts.get(family) ?? 0) + 1);
+	let common, highest = 0;
+	for (let [family, count] of counts) count > highest && (common = family, highest = count);
+	return common;
+}
+/**
+* Builds a stored file from an asset and what it holds.
+*
+* @param key - Key to store the file under.
+* @param assetId - ID of the file asset.
+* @param details - What the file holds.
+* @returns The stored file.
+*/
+function createFontFile(key, assetId, { family, weight, maxWeight, style }) {
+	return {
+		_type: fontFileTypeName,
+		_key: key,
+		asset: {
+			_type: "reference",
+			_ref: assetId
+		},
+		...isDefined(family) && { family },
+		weight,
+		...isDefined(maxWeight) && { maxWeight },
+		style
+	};
+}
+function FilesInput({ value, onChange, readOnly }) {
+	let { fillDetails } = useFilesContext(), client = useClient({ apiVersion }), { projectId, dataset } = client.config(), [pending, setPending] = useState([]), [notices, setNotices] = useState([]), [uploadedNames, setUploadedNames] = useState({}), files = (value ?? []).filter((item) => isFontFile(item)), filenames = {
+		...useAssetFilenames(files.flatMap(({ asset }) => isDefined(asset?._ref) ? [asset._ref] : [])),
+		...uploadedNames
+	}, duplicates = new Set(findDuplicateFiles(files).map(({ _key }) => _key)), rows = [...files.map(({ _key: _key_0, asset: asset_0, weight, maxWeight, style }) => ({
+		key: _key_0,
+		url: isDefined(projectId) && isDefined(dataset) ? createFileUrl(asset_0?._ref, projectId, dataset) : void 0,
+		weight,
+		maxWeight,
+		style,
+		filename: isDefined(asset_0?._ref) ? filenames[asset_0._ref] : void 0,
+		uploading: !1
+	})), ...pending.map(({ key, filename, url, details }) => ({
+		key,
+		url,
+		...details,
+		filename,
+		uploading: !0
+	}))].toSorted((first, second) => (first.weight ?? 0) - (second.weight ?? 0) || +(first.style === "italic") - (second.style === "italic"));
+	/**
+	* Uploads a file, trying again when the upload fails.
+	*
+	* @param file - The file.
+	* @param filename - Name to store the file under.
+	* @param retries - Times left to try again.
+	* @returns The uploaded asset.
+	* @throws When the last attempt fails.
+	*/
+	async function uploadAsset(file, filename_0, retries) {
+		try {
+			return await client.assets.upload("file", file, { filename: filename_0 });
+		} catch (error) {
+			if (retries <= 0) throw error;
+			return uploadAsset(file, filename_0, retries - 1);
+		}
+	}
+	/**
+	* Uploads one file that has been read and adds it to the font.
+	*
+	* @param file - The file.
+	* @param pendingFile - The file as it's shown while uploading.
+	*/
+	async function upload(file_0, { key: key_0, filename: filename_1, url: url_0, details: details_0 }) {
+		try {
+			let asset_2 = await uploadAsset(file_0, filename_1, 2);
+			setUploadedNames((current_0) => ({
+				...current_0,
+				[asset_2._id]: asset_2.originalFilename ?? filename_1
+			})), onChange([setIfMissing([]), insert([createFontFile(key_0, asset_2._id, details_0)], "after", [-1])]);
+		} catch (error_0) {
+			logger.warn(`Couldn't upload ${filename_1}: ${error_0 instanceof Error ? error_0.message : String(error_0)}`), setNotices((current) => [...current, {
+				tone: "critical",
+				message: `${filename_1} couldn't be uploaded. Try again.`
+			}]);
+		}
+		setPending((current_1) => current_1.filter((entry) => entry.key !== key_0)), URL.revokeObjectURL(url_0);
+	}
+	async function handleFiles(selected) {
+		let read = await Promise.all(selected.map(async (file_1) => ({
+			file: file_1,
+			details: await readFontFile(await file_1.arrayBuffer())
+		}))), held = new Map([...files, ...pending.map(({ details: details_1 }) => details_1)].map((file_2) => [getCoverageKey(file_2), describeFile(file_2)])), family = [...files.map((file_3) => file_3.family), ...pending.map(({ details: details_3 }) => details_3.family)].find((name) => isDefined(name)) ?? findCommonFamily(read.flatMap(({ details: details_2 }) => isDefined(details_2?.family) ? [details_2.family] : [])), fresh = [], uploads = [];
+		for (let { file: file_4, details: details_4 } of read) {
+			if (!isDefined(details_4)) {
+				fresh.push({
+					tone: "critical",
+					message: `${file_4.name} isn't a WOFF or WOFF2 font, or couldn't be read.`
+				});
+				continue;
+			}
+			if (isDefined(family) && isDefined(details_4.family) && details_4.family !== family) {
+				fresh.push({
+					tone: "caution",
+					message: `${file_4.name} wasn't added. Every file in a font must come from the same family, and this one is from ${details_4.family}, not ${family}.`
+				});
+				continue;
+			}
+			let coverage = getCoverageKey(details_4), existing = held.get(coverage);
+			isDefined(existing) ? fresh.push({
+				tone: "caution",
+				message: `${file_4.name} wasn't added, because ${existing} is already uploaded.`
+			}) : (held.set(coverage, describeFile(details_4)), uploads.push({
+				file: file_4,
+				pendingFile: {
+					key: randomKey(12),
+					filename: file_4.name,
+					url: URL.createObjectURL(file_4),
+					details: details_4
+				}
+			}));
+		}
+		if (setNotices(fresh), isDefined(uploads)) {
+			let category = uploads.map(({ pendingFile }) => pendingFile.details.category).find((kind) => isDefined(kind));
+			fillDetails(family, category);
+		}
+		setPending((current_2) => [...current_2, ...uploads.map(({ pendingFile: pendingFile_0 }) => pendingFile_0)]);
+		let queue = [...uploads];
+		/** Uploads the queued files one after another. */
+		async function drain() {
+			let next = queue.shift();
+			isDefined(next) && (await upload(next.file, next.pendingFile), await drain());
+		}
+		await Promise.all(Array.from({ length: Math.min(3, queue.length) }, drain));
+	}
+	return /* @__PURE__ */ jsxs(Stack, {
+		gap: 3,
+		children: [
+			isDefined(rows) && /* @__PURE__ */ jsx(Stack, {
+				gap: 2,
+				children: rows.map(({ key: key_1, url: url_1, weight: weight_0, maxWeight: maxWeight_0, style: style_0, filename: filename_2, uploading }) => /* @__PURE__ */ jsx(FileRow, {
+					url: url_1,
+					weight: weight_0,
+					maxWeight: maxWeight_0,
+					style: style_0,
+					filename: filename_2,
+					uploading,
+					duplicate: duplicates.has(key_1),
+					readOnly,
+					onRemove: () => {
+						onChange(unset([{ _key: key_1 }]));
+					}
+				}, key_1))
+			}),
+			["critical", "caution"].map((tone) => {
+				let messages = notices.filter((notice) => notice.tone === tone);
+				return isDefined(messages) && /* @__PURE__ */ jsx(Card, {
+					tone,
+					padding: 3,
+					radius: 2,
+					border: !0,
+					children: /* @__PURE__ */ jsx(Stack, {
+						gap: 3,
+						children: messages.map(({ message }) => /* @__PURE__ */ jsx(Text, {
+							size: 1,
+							children: message
+						}, message))
+					})
+				}, tone);
+			}),
+			/* @__PURE__ */ jsx(DropZone, {
+				readOnly,
+				onFiles: (selected_0) => {
+					handleFiles(selected_0);
+				}
+			})
+		]
+	});
+}
+function CodeText(t0) {
+	let $ = c(10), props, text;
+	$[0] === t0 ? (props = $[1], text = $[2]) : ({text, ...props} = t0, $[0] = t0, $[1] = props, $[2] = text);
+	let t1, t2;
+	if ($[3] !== props || $[4] !== text) {
+		let parts = text.split("`");
+		t1 = props, t2 = parts.map((part, index) => {
+			let start = parts.slice(0, index).join("`").length;
+			return index % 2 == 1 ? /* @__PURE__ */ jsx("code", { children: part }, start) : part;
+		}), $[3] = props, $[4] = text, $[5] = t1, $[6] = t2;
+	} else t1 = $[5], t2 = $[6];
+	let t3;
+	return $[7] !== t1 || $[8] !== t2 ? (t3 = /* @__PURE__ */ jsx("span", {
+		...t1,
+		children: t2
+	}), $[7] = t1, $[8] = t2, $[9] = t3) : t3 = $[9], t3;
+}
+function Problem(t0) {
+	let $ = c(14), problem, props;
+	$[0] === t0 ? (problem = $[1], props = $[2]) : ({problem, ...props} = t0, $[0] = t0, $[1] = problem, $[2] = props);
+	let t1;
+	$[3] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		children: /* @__PURE__ */ jsx(WarningOutlineIcon, {})
+	}), $[3] = t1) : t1 = $[3];
+	let t2;
+	$[4] === problem.title ? t2 = $[5] : (t2 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		weight: "medium",
+		children: /* @__PURE__ */ jsx(CodeText, { text: problem.title })
+	}), $[4] = problem.title, $[5] = t2);
+	let t3;
+	$[6] === problem.description ? t3 = $[7] : (t3 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		muted: !0,
+		children: /* @__PURE__ */ jsx(CodeText, { text: problem.description })
+	}), $[6] = problem.description, $[7] = t3);
+	let t4;
+	$[8] !== t2 || $[9] !== t3 ? (t4 = /* @__PURE__ */ jsxs(Flex, {
+		gap: 3,
+		children: [t1, /* @__PURE__ */ jsxs(Stack, {
+			gap: 3,
+			children: [t2, t3]
+		})]
+	}), $[8] = t2, $[9] = t3, $[10] = t4) : t4 = $[10];
+	let t5;
+	return $[11] !== props || $[12] !== t4 ? (t5 = /* @__PURE__ */ jsx(Card, {
+		tone: "caution",
+		padding: 4,
+		radius: 2,
+		border: !0,
+		...props,
+		children: t4
+	}), $[11] = props, $[12] = t4, $[13] = t5) : t5 = $[13], t5;
+}
+/**
+* Works out which item a key press moves to.
+*
+* @param layout - The grid's layout.
+* @param key - The key pressed.
+* @param current - Index of the current item.
+* @param last - Index of the last item.
+* @returns The new index, or undefined when the key doesn't move.
+*/
+function getNextIndex({ columns }, key, current, last) {
+	if (key === "ArrowRight") return current + 1;
+	if (key === "ArrowLeft") return current - 1;
+	if (key === "ArrowDown") return current + columns;
+	if (key === "ArrowUp") return current - columns;
+	if (key === "Home") return 0;
+	if (key === "End") return last;
+}
+/**
+* Works out which rows to render at a scroll position, so only items near the viewport are mounted.
+* Padding replaces the other rows, so the scrollbar stays the right size.
+*
+* @param layout - The grid's layout.
+* @param scrollRow - The row scrolled to.
+* @param count - Number of items in the grid.
+* @returns The first and last rows to render, and the total number of rows.
+*/
+function getVisibleRows({ columns, visibleRows, overscan }, scrollRow, count) {
+	let totalRows = Math.ceil(count / columns), firstRow = Math.max(0, scrollRow - overscan);
+	return {
+		totalRows,
+		firstRow,
+		lastRow: Math.min(totalRows, firstRow + visibleRows + overscan * 2)
+	};
+}
+/**
+* Works out the scroll position that centres an item, for opening on the selected one.
+*
+* @param layout - The grid's layout.
+* @param index - Index of the item.
+* @returns The scroll position.
+*/
+function getCenteredScrollTop({ columns, rowHeight, height }, index) {
+	return Math.max(0, Math.floor(index / columns) * rowHeight - height / 2);
+}
+/**
+* Works out the scroll position that brings an item into view, keeping the current one if it's already visible. It
+* uses the index because Home and End can move to rows that aren't mounted.
+*
+* @param layout - The grid's layout.
+* @param index - Index of the item.
+* @param scrollTop - The current scroll position.
+* @returns The scroll position.
+*/
+function getRevealedScrollTop({ columns, rowHeight, height }, index, scrollTop) {
+	let top = Math.floor(index / columns) * rowHeight;
+	return top < scrollTop ? top : top + rowHeight > scrollTop + height ? top + rowHeight - height : scrollTop;
+}
+/** Readable name of each kind of typeface. */
+const fontCategoryLabels = {
+	"sans-serif": "Sans Serif",
+	serif: "Serif",
+	display: "Display",
+	handwriting: "Handwriting",
+	monospace: "Monospace"
+}, gridLayout = {
+	columns: 3,
+	rowHeight: 80,
+	visibleRows: 5,
+	height: 392,
+	overscan: 5
+};
+/**
+* Describes the sample a card shows: the family's name, in its regular weight or the nearest it has.
+*
+* @param family - The family.
+* @returns The sample.
+*/
+function createCellSample({ family, weights, italics }) {
+	let italic = !isDefined(weights), [weight = 400] = (italic ? italics : weights).toSorted((first, second) => Math.abs(first - 400) - Math.abs(second - 400));
+	return {
+		source: "google",
+		family,
+		weights: [weight],
+		styles: [italic ? "italic" : "normal"],
+		text: family
+	};
+}
+function Cell(t0) {
+	let $ = c(46), family, focusable, onSelect, position, props, selected, total;
+	$[0] === t0 ? (family = $[1], focusable = $[2], onSelect = $[3], position = $[4], props = $[5], selected = $[6], total = $[7]) : ({family, selected, focusable, position, total, onSelect, ...props} = t0, $[0] = t0, $[1] = family, $[2] = focusable, $[3] = onSelect, $[4] = position, $[5] = props, $[6] = selected, $[7] = total);
+	let t1;
+	$[8] === family ? t1 = $[9] : (t1 = createCellSample(family), $[8] = family, $[9] = t1);
+	let { name, loading } = useFontSample(t1), { weights, italics, variable } = family, t2;
+	$[10] !== italics || $[11] !== weights ? (t2 = /* @__PURE__ */ new Set([...weights, ...italics]), $[10] = italics, $[11] = weights, $[12] = t2) : t2 = $[12];
+	let count = t2.size, t3 = fontCategoryLabels[family.category], t4 = variable ? "Variable" : `${count} ${count === 1 ? "weight" : "weights"}`, t5;
+	$[13] !== t3 || $[14] !== t4 ? (t5 = [t3, t4], $[13] = t3, $[14] = t4, $[15] = t5) : t5 = $[15];
+	let details = t5, t6 = focusable ? 0 : -1, t7;
+	$[16] === Symbol.for("react.memo_cache_sentinel") ? (t7 = {
+		height: 72,
+		minWidth: 0,
+		boxShadow: "inset 0 0 0 1px var(--card-border-color)"
+	}, $[16] = t7) : t7 = $[16];
+	let t8;
+	$[17] !== details || $[18] !== family.family ? (t8 = [family.family, ...details], $[17] = details, $[18] = family.family, $[19] = t8) : t8 = $[19];
+	let t9 = t8.join(", "), t10;
+	$[20] !== family || $[21] !== onSelect ? (t10 = () => {
+		onSelect(family);
+	}, $[20] = family, $[21] = onSelect, $[22] = t10) : t10 = $[22];
+	let t11;
+	$[23] === Symbol.for("react.memo_cache_sentinel") ? (t11 = {
+		minWidth: 0,
+		textAlign: "left"
+	}, $[23] = t11) : t11 = $[23];
+	let t12;
+	$[24] === name ? t12 = $[25] : (t12 = isDefined(name) ? `"${name}"` : void 0, $[24] = name, $[25] = t12);
+	let t13 = +!loading, t14;
+	$[26] !== t12 || $[27] !== t13 ? (t14 = {
+		fontFamily: t12,
+		opacity: t13,
+		transition: "opacity 150ms ease-out"
+	}, $[26] = t12, $[27] = t13, $[28] = t14) : t14 = $[28];
+	let t15;
+	$[29] !== family.family || $[30] !== t14 ? (t15 = /* @__PURE__ */ jsx(Text, {
+		size: 3,
+		textOverflow: "ellipsis",
+		translate: "no",
+		style: t14,
+		children: family.family
+	}), $[29] = family.family, $[30] = t14, $[31] = t15) : t15 = $[31];
+	let t16 = details.join(" · "), t17;
+	$[32] === t16 ? t17 = $[33] : (t17 = /* @__PURE__ */ jsx(Text, {
+		size: 0,
+		muted: !0,
+		textOverflow: "ellipsis",
+		children: t16
+	}), $[32] = t16, $[33] = t17);
+	let t18;
+	$[34] !== t15 || $[35] !== t17 ? (t18 = /* @__PURE__ */ jsx(Box, {
+		style: t11,
+		children: /* @__PURE__ */ jsxs(Stack, {
+			gap: 3,
+			children: [t15, t17]
+		})
+	}), $[34] = t15, $[35] = t17, $[36] = t18) : t18 = $[36];
+	let t19;
+	return $[37] !== position || $[38] !== props || $[39] !== selected || $[40] !== t10 || $[41] !== t18 || $[42] !== t6 || $[43] !== t9 || $[44] !== total ? (t19 = /* @__PURE__ */ jsx(Button, {
+		type: "button",
+		role: "option",
+		"aria-selected": selected,
+		"aria-posinset": position,
+		"aria-setsize": total,
+		tabIndex: t6,
+		mode: "bleed",
+		selected,
+		padding: 3,
+		style: t7,
+		"aria-label": t9,
+		onClick: t10,
+		...props,
+		children: t18
+	}), $[37] = position, $[38] = props, $[39] = selected, $[40] = t10, $[41] = t18, $[42] = t6, $[43] = t9, $[44] = total, $[45] = t19) : t19 = $[45], t19;
+}
+function Library(t0) {
+	let $ = c(42), activeCell, activeIndex, families, onClearSearch, onSelect, props, rows, search, selected;
+	$[0] === t0 ? (activeCell = $[1], activeIndex = $[2], families = $[3], onClearSearch = $[4], onSelect = $[5], props = $[6], rows = $[7], search = $[8], selected = $[9]) : ({families, rows, selected, activeIndex, activeCell, search, onSelect, onClearSearch, ...props} = t0, $[0] = t0, $[1] = activeCell, $[2] = activeIndex, $[3] = families, $[4] = onClearSearch, $[5] = onSelect, $[6] = props, $[7] = rows, $[8] = search, $[9] = selected);
+	let { totalRows, firstRow, lastRow } = rows, T0, t1, t2, t3, t4, t5, t6;
+	if ($[10] !== activeCell || $[11] !== activeIndex || $[12] !== families || $[13] !== firstRow || $[14] !== lastRow || $[15] !== onClearSearch || $[16] !== onSelect || $[17] !== props || $[18] !== search || $[19] !== selected || $[20] !== totalRows) {
+		let visible = families.slice(firstRow * 3, lastRow * 3);
+		T0 = Box, t1 = "listbox", t2 = "Google Fonts", $[28] === families ? t3 = $[29] : (t3 = isDefined(families) ? {
+			height: 392,
+			overflowY: "auto"
+		} : void 0, $[28] = families, $[29] = t3), t4 = props, $[30] !== families || $[31] !== onClearSearch || $[32] !== search ? (t5 = !isDefined(families) && /* @__PURE__ */ jsxs(Flex, {
+			align: "center",
+			justify: "center",
+			direction: "column",
+			gap: 3,
+			paddingTop: 5,
+			paddingBottom: 6,
+			children: [/* @__PURE__ */ jsx(Text, {
+				size: 1,
+				muted: !0,
+				children: isDefined(search) ? `Nothing matches "${search}".` : "No fonts of this kind."
+			}), /* @__PURE__ */ jsx(Button, {
+				type: "button",
+				mode: "ghost",
+				text: isDefined(search) ? "Clear search" : "Show all kinds",
+				onClick: onClearSearch
+			})]
+		}), $[30] = families, $[31] = onClearSearch, $[32] = search, $[33] = t5) : t5 = $[33], t6 = isDefined(families) && /* @__PURE__ */ jsx(Grid, {
+			gridTemplateColumns: 3,
+			style: {
+				columnGap: 8,
+				rowGap: 8,
+				paddingTop: firstRow * 80,
+				paddingBottom: (totalRows - lastRow) * 80
+			},
+			children: visible.map((family, offset) => {
+				let index = firstRow * 3 + offset;
+				return /* @__PURE__ */ jsx(Cell, {
+					ref: index === activeIndex ? activeCell : void 0,
+					family,
+					selected: family.family === selected,
+					focusable: index === activeIndex,
+					position: index + 1,
+					total: families.length,
+					onSelect
+				}, family.family);
+			})
+		}), $[10] = activeCell, $[11] = activeIndex, $[12] = families, $[13] = firstRow, $[14] = lastRow, $[15] = onClearSearch, $[16] = onSelect, $[17] = props, $[18] = search, $[19] = selected, $[20] = totalRows, $[21] = T0, $[22] = t1, $[23] = t2, $[24] = t3, $[25] = t4, $[26] = t5, $[27] = t6;
+	} else T0 = $[21], t1 = $[22], t2 = $[23], t3 = $[24], t4 = $[25], t5 = $[26], t6 = $[27];
+	let t7;
+	return $[34] !== T0 || $[35] !== t1 || $[36] !== t2 || $[37] !== t3 || $[38] !== t4 || $[39] !== t5 || $[40] !== t6 ? (t7 = /* @__PURE__ */ jsxs(T0, {
+		role: t1,
+		"aria-label": t2,
+		style: t3,
+		...t4,
+		children: [t5, t6]
+	}), $[34] = T0, $[35] = t1, $[36] = t2, $[37] = t3, $[38] = t4, $[39] = t5, $[40] = t6, $[41] = t7) : t7 = $[41], t7;
+}
+function Recent(t0) {
+	let $ = c(24), families, onForget, onSelect, props, selected;
+	$[0] === t0 ? (families = $[1], onForget = $[2], onSelect = $[3], props = $[4], selected = $[5]) : ({families, selected, onSelect, onForget, ...props} = t0, $[0] = t0, $[1] = families, $[2] = onForget, $[3] = onSelect, $[4] = props, $[5] = selected);
+	let t1;
+	$[6] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsx(Text, {
+		size: 1,
+		weight: "medium",
+		muted: !0,
+		children: "Recent fonts"
+	}), $[6] = t1) : t1 = $[6];
+	let t2;
+	$[7] === onForget ? t2 = $[8] : (t2 = /* @__PURE__ */ jsxs(Flex, {
+		align: "center",
+		justify: "space-between",
+		gap: 2,
+		children: [t1, /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			mode: "bleed",
+			fontSize: 1,
+			padding: 2,
+			text: "Clear",
+			onClick: onForget,
+			"aria-label": "Clear recent fonts"
+		})]
+	}), $[7] = onForget, $[8] = t2);
+	let t3;
+	$[9] === Symbol.for("react.memo_cache_sentinel") ? (t3 = {
+		columnGap: 8,
+		rowGap: 8
+	}, $[9] = t3) : t3 = $[9];
+	let t4;
+	if ($[10] !== families || $[11] !== onSelect || $[12] !== selected) {
+		let t5;
+		$[14] !== families.length || $[15] !== onSelect || $[16] !== selected ? (t5 = (family, index) => /* @__PURE__ */ jsx(Cell, {
+			family,
+			selected: family.family === selected,
+			focusable: !0,
+			position: index + 1,
+			total: families.length,
+			onSelect
+		}, family.family), $[14] = families.length, $[15] = onSelect, $[16] = selected, $[17] = t5) : t5 = $[17], t4 = families.map(t5), $[10] = families, $[11] = onSelect, $[12] = selected, $[13] = t4;
+	} else t4 = $[13];
+	let t5;
+	$[18] === t4 ? t5 = $[19] : (t5 = /* @__PURE__ */ jsx(Grid, {
+		role: "listbox",
+		"aria-label": "Recent fonts",
+		gridTemplateColumns: 3,
+		style: t3,
+		children: t4
+	}), $[18] = t4, $[19] = t5);
+	let t6;
+	return $[20] !== props || $[21] !== t2 || $[22] !== t5 ? (t6 = /* @__PURE__ */ jsxs(Stack, {
+		gap: 3,
+		...props,
+		children: [t2, t5]
+	}), $[20] = props, $[21] = t2, $[22] = t5, $[23] = t6) : t6 = $[23], t6;
+}
+/** Orders the picker offers, the first being the default. */
+const familySorts = [
+	{
+		name: "popular",
+		label: "Popular",
+		compare: () => 0
+	},
+	{
+		name: "trending",
+		label: "Trending",
+		compare: (first, second) => first.trending - second.trending
+	},
+	{
+		name: "newest",
+		label: "Newest",
+		compare: (first, second) => second.added.localeCompare(first.added)
+	},
+	{
+		name: "name",
+		label: "Name",
+		compare: (first, second) => first.family.localeCompare(second.family, "en-US")
+	}
+];
+/**
+* Normalises text for search, so a family matches however its name is spaced or capitalised.
+*
+* @param value - The text.
+* @returns The normalised text.
+*/
+function normalizeTerms(value) {
+	return value.toLowerCase().replaceAll(/[\s-]+/gu, "");
+}
+/**
+* Loads the catalog the build step downloaded.
+*
+* @returns The families, or why they can't be shown.
+*/
+async function readCatalog() {
+	let { ready, load } = fontCatalog;
+	if (!ready) return { problem: {
+		title: "Google Fonts isn't set up",
+		description: "Add `withFonts()` to the Studio's build configuration, then restart the Studio."
+	} };
+	if (!isDefined(load)) return { problem: {
+		title: "Couldn't download Google Fonts",
+		description: "The Studio's build couldn't reach Google Fonts. Check the connection, then restart the Studio."
+	} };
+	let module = await load(), families = parseCatalog(module.default);
+	return isDefined(families) ? { families } : { problem: {
+		title: "Couldn't load Google Fonts",
+		description: "Restart the Studio and try again."
+	} };
+}
+/** Catalog request shared by every field in the session, since the catalog never changes while the Studio runs. */
+let catalogRequest;
+/**
+* Loads the catalog, reusing a request already in progress.
+*
+* @returns The families, or why they can't be shown.
+*/
+async function requestCatalog() {
+	return catalogRequest ??= readCatalog(), await catalogRequest;
+}
+/**
+* Loads the Google Fonts catalog. Only an open picker calls this, so a Studio that never opens one never loads it.
+*
+* @returns The families or why they can't be shown, or undefined while loading.
+*/
+function useFontCatalog() {
+	let $ = c(2), [result, setResult] = useState(), t0, t1;
+	return $[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = () => {
+		let active = !0;
+		return (async function load() {
+			let loaded = await requestCatalog();
+			active && setResult(loaded);
+		})(), () => {
+			active = !1;
+		};
+	}, t1 = [], $[0] = t0, $[1] = t1) : (t0 = $[0], t1 = $[1]), useEffect(t0, t1), result;
+}
+/**
+* Creates a list of recent choices kept in the browser's local storage rather than the dataset, one list per scope.
+*
+* @param storageKey - Local storage key the lists are kept under, followed by each list's scope.
+* @param limit - Number of choices each list keeps.
+* @returns Functions that read, add to, and clear a list.
+*/
+function createRecentStore(storageKey, limit) {
+	/**
+	* Builds the storage key for one list.
+	*
+	* @param scope - The list's scope.
+	* @returns The storage key.
+	*/
+	function getStorageKey(scope) {
+		return `${storageKey}:${scope}`;
+	}
+	/**
+	* Reads a list.
+	*
+	* @param scope - The list's scope.
+	* @returns The choices, most recent first.
+	*/
+	function read(scope) {
+		try {
+			let stored = JSON.parse(globalThis.localStorage.getItem(getStorageKey(scope)) ?? "[]");
+			return Array.isArray(stored) ? stored.filter((entry) => typeof entry == "string") : [];
+		} catch {
+			return [];
+		}
+	}
+	/**
+	* Adds a choice to the front of a list.
+	*
+	* @param scope - The list's scope.
+	* @param name - The choice.
+	* @returns The updated choices, most recent first.
+	*/
+	function write(scope, name) {
+		let updated = [name, ...read(scope).filter((entry) => entry !== name)].slice(0, limit);
+		try {
+			globalThis.localStorage.setItem(getStorageKey(scope), JSON.stringify(updated));
+		} catch {}
+		return updated;
+	}
+	/**
+	* Clears a list.
+	*
+	* @param scope - The list's scope.
+	*/
+	function clear(scope) {
+		try {
+			globalThis.localStorage.removeItem(getStorageKey(scope));
+		} catch {}
+	}
+	return {
+		read,
+		write,
+		clear
+	};
+}
+/**
+* Tracks one list of recent choices. The list is read when the component mounts, so choices made in another tab are
+* included.
+*
+* @param store - The store the list is kept in.
+* @param scope - The list's scope.
+* @returns The recent choices, most recent first, and functions to add to and clear them.
+*/
+function useRecent(store, scope) {
+	let $ = c(13), t0;
+	$[0] !== scope || $[1] !== store ? (t0 = () => store.read(scope), $[0] = scope, $[1] = store, $[2] = t0) : t0 = $[2];
+	let [recent, setRecent] = useState(t0), t1;
+	$[3] !== scope || $[4] !== store ? (t1 = function remember(name) {
+		setRecent(store.write(scope, name));
+	}, $[3] = scope, $[4] = store, $[5] = t1) : t1 = $[5];
+	let remember = t1, t2;
+	$[6] !== scope || $[7] !== store ? (t2 = function forget() {
+		store.clear(scope), setRecent([]);
+	}, $[6] = scope, $[7] = store, $[8] = t2) : t2 = $[8];
+	let forget = t2, t3;
+	return $[9] !== forget || $[10] !== recent || $[11] !== remember ? (t3 = {
+		recent,
+		remember,
+		forget
+	}, $[9] = forget, $[10] = recent, $[11] = remember, $[12] = t3) : t3 = $[12], t3;
+}
+/** Recent Google fonts, kept in the browser, up to one row of the grid. */
+const recentFontStore = createRecentStore("driftime:sanity-plugin-font:recent", 3);
+/**
+* Tracks the Google fonts an author chose most recently. The list is read when the picker opens, so choices made in
+* another tab are included.
+*
+* @returns The recent family names, most recent first, and functions to add to and clear them.
+*/
+function useRecentFonts() {
+	return useRecent(recentFontStore, "google");
+}
+function Picker(t0) {
+	let $ = c(43), categories, families, id, onSelect, props, selected, subsets, variants;
+	$[0] === t0 ? (categories = $[1], families = $[2], id = $[3], onSelect = $[4], props = $[5], selected = $[6], subsets = $[7], variants = $[8]) : ({id, selected, categories, families, variants, subsets, onSelect, ...props} = t0, $[0] = t0, $[1] = categories, $[2] = families, $[3] = id, $[4] = onSelect, $[5] = props, $[6] = selected, $[7] = subsets, $[8] = variants);
+	let result = useFontCatalog(), { recent, remember, forget } = useRecentFonts(), catalog = result?.families ?? [], byName = new Map(catalog.map(_temp$1)), listed = isDefined(families) ? families.flatMap((name) => byName.get(name) ?? []) : catalog, t1;
+	$[9] !== categories || $[10] !== subsets || $[11] !== variants ? (t1 = (family_0) => categories.includes(family_0.category) && meetsRequirements(family_0, variants, subsets), $[9] = categories, $[10] = subsets, $[11] = variants, $[12] = t1) : t1 = $[12];
+	let offered = listed.filter(t1), offeredCategories = fontCategories.filter((member) => offered.some((family_1) => family_1.category === member)), [search, setSearch] = useState(""), [category, setCategory] = useState(), [sort, setSort] = useState(familySorts[0]), [scrollRow, setScrollRow] = useState(0), [movedIndex, setMovedIndex] = useState(), scroller = useRef(null), activeCell = useRef(null), focusIndex = useRef(void 0), scrollFrame = useRef(void 0), centred = useRef(!1), query = normalizeTerms(search), filtering = isDefined(query) || isDefined(category), t2;
+	$[13] !== families || $[14] !== sort?.compare ? (t2 = isDefined(families) ? void 0 : sort?.compare, $[13] = families, $[14] = sort?.compare, $[15] = t2) : t2 = $[15];
+	let results = offered.filter((family_2) => (!isDefined(query) || normalizeTerms(family_2.family).includes(query)) && (!isDefined(category) || family_2.category === category)).toSorted(t2), offeredByName = new Map(offered.map(_temp2)), recentFamilies = filtering ? [] : recent.flatMap((name_0) => {
+		let family_4 = offeredByName.get(name_0);
+		return isDefined(family_4) ? [family_4] : [];
+	}), rows = getVisibleRows(gridLayout, scrollRow, results.length), selectedIndex = filtering || !isDefined(selected) ? -1 : results.findIndex((t3) => {
+		let { family: family_5 } = t3;
+		return family_5 === selected;
+	}), activeIndex = movedIndex ?? Math.max(0, selectedIndex);
+	useEffect(() => {
+		let element = scroller.current;
+		isDefined(element) && selectedIndex !== -1 && !centred.current && (centred.current = !0, element.scrollTop = getCenteredScrollTop(gridLayout, selectedIndex));
+	}, [scroller, selectedIndex]);
+	let t4, t5;
+	$[16] === Symbol.for("react.memo_cache_sentinel") ? (t4 = () => () => {
+		isDefined(scrollFrame.current) && cancelAnimationFrame(scrollFrame.current);
+	}, t5 = [], $[16] = t4, $[17] = t5) : (t4 = $[16], t5 = $[17]), useEffect(t4, t5);
+	let t6, t7;
+	$[18] === activeIndex ? (t6 = $[19], t7 = $[20]) : (t6 = () => {
+		focusIndex.current === activeIndex && (focusIndex.current = void 0, isDefined(activeCell.current) && activeCell.current.focus());
+	}, t7 = [activeIndex], $[18] = activeIndex, $[19] = t6, $[20] = t7), useEffect(t6, t7);
+	let resetScroll = function resetScroll() {
+		setMovedIndex(void 0), isDefined(scroller.current) && (scroller.current.scrollTop = 0);
+	}, t8;
+	$[21] === Symbol.for("react.memo_cache_sentinel") ? (t8 = function clearSearch() {
+		setSearch(""), setCategory(void 0), setMovedIndex(void 0);
+	}, $[21] = t8) : t8 = $[21];
+	let clearSearch = t8, t9;
+	$[22] === resetScroll ? t9 = $[23] : (t9 = function handleSearch(event) {
+		setSearch(event.currentTarget.value), resetScroll();
+	}, $[22] = resetScroll, $[23] = t9);
+	let handleSearch = t9, t10;
+	$[24] === resetScroll ? t10 = $[25] : (t10 = function handleCategory(event_0) {
+		let { value } = event_0.currentTarget;
+		setCategory(fontCategories.find((member_0) => member_0 === value)), resetScroll();
+	}, $[24] = resetScroll, $[25] = t10);
+	let handleCategory = t10, t11;
+	$[26] === resetScroll ? t11 = $[27] : (t11 = function handleSort(event_1) {
+		let { value: value_0 } = event_1.currentTarget;
+		setSort(familySorts.find((t12) => {
+			let { name: name_1 } = t12;
+			return name_1 === value_0;
+		})), resetScroll();
+	}, $[26] = resetScroll, $[27] = t11);
+	let handleSort = t11, t12;
+	$[28] !== onSelect || $[29] !== remember ? (t12 = function handleSelect(family_6) {
+		remember(family_6.family), onSelect(family_6);
+	}, $[28] = onSelect, $[29] = remember, $[30] = t12) : t12 = $[30];
+	let handleSelect = t12, selectActive = function selectActive() {
+		let family_7 = results[activeIndex];
+		isDefined(family_7) && handleSelect(family_7);
+	}, handleSearchKeyDown = function handleSearchKeyDown(event_2) {
+		event_2.key === "Enter" ? (event_2.preventDefault(), selectActive()) : event_2.key === "ArrowDown" && (event_2.preventDefault(), isDefined(activeCell.current) && activeCell.current.focus());
+	}, handleScroll = function handleScroll() {
+		isDefined(scrollFrame.current) || (scrollFrame.current = requestAnimationFrame(() => {
+			scrollFrame.current = void 0;
+			let element_0 = scroller.current;
+			isDefined(element_0) && setScrollRow(Math.floor(element_0.scrollTop / 80));
+		}));
+	}, handleGridKeyDown = function handleGridKeyDown(event_3) {
+		let last = results.length - 1;
+		if (last < 0) return;
+		if (event_3.key === "Enter" || event_3.key === " ") {
+			event_3.preventDefault(), selectActive();
+			return;
+		}
+		let next = getNextIndex(gridLayout, event_3.key, activeIndex, last);
+		if (!isDefined(next)) return;
+		event_3.preventDefault();
+		let index = Math.min(Math.max(next, 0), last);
+		focusIndex.current = index, setMovedIndex(index);
+		let element_1 = scroller.current;
+		isDefined(element_1) && (element_1.scrollTop = getRevealedScrollTop(gridLayout, index, element_1.scrollTop));
+	}, T0 = Stack, t14 = !isDefined(result?.problem) && /* @__PURE__ */ jsxs(Flex, {
+		gap: 2,
+		children: [
+			/* @__PURE__ */ jsx(Box, {
+				flex: 1,
+				children: /* @__PURE__ */ jsx(TextInput, {
+					type: "search",
+					icon: /* @__PURE__ */ jsx(SearchIcon, {}),
+					placeholder: "Search by name",
+					value: search,
+					onChange: handleSearch,
+					onKeyDown: handleSearchKeyDown,
+					disabled: !isDefined(offered),
+					"aria-label": "Search Google Fonts"
+				})
+			}),
+			offeredCategories.length > 1 && /* @__PURE__ */ jsx(Box, {
+				flex: "none",
+				children: /* @__PURE__ */ jsxs(Select, {
+					id: `${id}-category`,
+					value: category ?? "",
+					onChange: handleCategory,
+					disabled: !isDefined(offered),
+					"aria-label": "Kind of typeface",
+					children: [/* @__PURE__ */ jsx("option", {
+						value: "",
+						children: "All kinds"
+					}), offeredCategories.map(_temp3)]
+				})
+			}),
+			!isDefined(families) && /* @__PURE__ */ jsx(Box, {
+				flex: "none",
+				children: /* @__PURE__ */ jsx(Select, {
+					id: `${id}-sort`,
+					value: sort?.name,
+					onChange: handleSort,
+					disabled: !isDefined(offered),
+					"aria-label": "Sort fonts",
+					children: familySorts.map(_temp4)
+				})
+			})
+		]
+	}), t15;
+	$[31] === result ? t15 = $[32] : (t15 = !isDefined(result) && /* @__PURE__ */ jsx(Flex, {
+		align: "center",
+		justify: "center",
+		style: { height: 392 },
+		children: /* @__PURE__ */ jsx(Spinner, { muted: !0 })
+	}), $[31] = result, $[32] = t15);
+	let t16;
+	$[33] === result ? t16 = $[34] : (t16 = isDefined(result?.problem) && /* @__PURE__ */ jsx(Problem, { problem: result.problem }), $[33] = result, $[34] = t16);
+	let t17 = isDefined(recentFamilies) && /* @__PURE__ */ jsx(Recent, {
+		families: recentFamilies,
+		selected,
+		onSelect: handleSelect,
+		onForget: forget
+	}), t18 = isDefined(result?.families) && /* @__PURE__ */ jsxs(Stack, {
+		gap: 3,
+		children: [
+			/* @__PURE__ */ jsx(Box, {
+				paddingY: 2,
+				children: /* @__PURE__ */ jsxs(Text, {
+					size: 1,
+					weight: "medium",
+					muted: !0,
+					children: [
+						"All fonts (",
+						results.length.toLocaleString("en-US"),
+						")"
+					]
+				})
+			}),
+			!isDefined(offered) && /* @__PURE__ */ jsx(Flex, {
+				align: "center",
+				justify: "center",
+				paddingTop: 5,
+				paddingBottom: 6,
+				children: /* @__PURE__ */ jsx(Text, {
+					size: 1,
+					muted: !0,
+					children: "No Google font matches the options set for this field."
+				})
+			}),
+			isDefined(offered) && /* @__PURE__ */ jsx(Library, {
+				ref: scroller,
+				families: results,
+				rows,
+				selected,
+				activeIndex,
+				activeCell,
+				search,
+				onSelect: handleSelect,
+				onClearSearch: clearSearch,
+				onScroll: handleScroll,
+				onKeyDown: handleGridKeyDown
+			})
+		]
+	}), t19;
+	return $[35] !== T0 || $[36] !== props || $[37] !== t14 || $[38] !== t15 || $[39] !== t16 || $[40] !== t17 || $[41] !== t18 ? (t19 = /* @__PURE__ */ jsxs(T0, {
+		gap: 4,
+		...props,
+		children: [
+			t14,
+			t15,
+			t16,
+			t17,
+			t18
+		]
+	}), $[35] = T0, $[36] = props, $[37] = t14, $[38] = t15, $[39] = t16, $[40] = t17, $[41] = t18, $[42] = t19) : t19 = $[42], t19;
+}
+function _temp4(t0) {
+	let { name: name_2, label } = t0;
+	return /* @__PURE__ */ jsx("option", {
+		value: name_2,
+		children: label
+	}, name_2);
+}
+function _temp3(member_1) {
+	return /* @__PURE__ */ jsx("option", {
+		value: member_1,
+		children: fontCategoryLabels[member_1]
+	}, member_1);
+}
+function _temp2(family_3) {
+	return [family_3.family, family_3];
+}
+function _temp$1(family) {
+	return [family.family, family];
+}
+/**
+* Describes the sample a stored font shows in the Studio: some text from its Google family, or its uploaded files.
+*
+* @param value - The stored font.
+* @param text - Characters a Google family is loaded for.
+* @returns The sample, or undefined when nothing loadable was stored.
+*/
+function useStoredSample(value, text) {
+	let $ = c(16), t0;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = { apiVersion }, $[0] = t0) : t0 = $[0];
+	let t1 = useClient(t0), family, styles, t2, weights;
+	if ($[1] !== t1 || $[2] !== value) {
+		t2 = Symbol.for("react.early_return_sentinel");
+		bb0: {
+			let { projectId, dataset } = t1.config(), { source, family: t3, weights: t4, styles: t5, files } = value ?? {};
+			if (family = t3, weights = t4, styles = t5, source === "upload") {
+				let sampleFiles = (files ?? []).flatMap((t6) => {
+					let { asset, weight, maxWeight, style } = t6, url = isDefined(projectId) && isDefined(dataset) ? createFileUrl(asset?._ref, projectId, dataset) : void 0;
+					return isDefined(url) && isDefined(weight) ? [{
+						url,
+						weight,
+						...isDefined(maxWeight) && { maxWeight },
+						style: style ?? "normal"
+					}] : [];
+				});
+				t2 = isDefined(sampleFiles) ? {
+					source,
+					files: sampleFiles
+				} : void 0;
+				break bb0;
+			}
+		}
+		$[1] = t1, $[2] = value, $[3] = family, $[4] = styles, $[5] = t2, $[6] = weights;
+	} else family = $[3], styles = $[4], t2 = $[5], weights = $[6];
+	if (t2 !== Symbol.for("react.early_return_sentinel")) return t2;
+	if (!isDefined(family)) return;
+	let t3;
+	$[7] === weights ? t3 = $[8] : (t3 = weights ?? [], $[7] = weights, $[8] = t3);
+	let t4;
+	$[9] === styles ? t4 = $[10] : (t4 = styles ?? [], $[9] = styles, $[10] = t4);
+	let t5;
+	return $[11] !== family || $[12] !== t3 || $[13] !== t4 || $[14] !== text ? (t5 = {
+		source: "google",
+		family,
+		weights: t3,
+		styles: t4,
+		text
+	}, $[11] = family, $[12] = t3, $[13] = t4, $[14] = text, $[15] = t5) : t5 = $[15], t5;
+}
+function Sample(t0) {
+	let $ = c(17), props, text, value, variants;
+	$[0] === t0 ? (props = $[1], text = $[2], value = $[3], variants = $[4]) : ({value, text, variants, ...props} = t0, $[0] = t0, $[1] = props, $[2] = text, $[3] = value, $[4] = variants);
+	let t1;
+	$[5] === text ? t1 = $[6] : (t1 = (variant) => ({
+		...variant,
+		specimen: text ?? "Aa",
+		caption: `${describeVariant(variant)} (${variant.weight})`
+	}), $[5] = text, $[6] = t1);
+	let items = variants.map(t1), { name, loading } = useFontSample(useStoredSample(value, items.map(_temp).join(" "))), T0 = Card, T1 = Flex, t7;
+	$[7] !== loading || $[8] !== name ? (t7 = (t8) => {
+		let { weight, style, specimen: specimen_0, caption } = t8;
+		return /* @__PURE__ */ jsxs(Stack, {
+			gap: 3,
+			children: [/* @__PURE__ */ jsx(Text, {
+				size: 3,
+				align: "center",
+				style: {
+					fontFamily: isDefined(name) ? `"${name}"` : void 0,
+					fontWeight: weight,
+					fontStyle: style,
+					opacity: +!loading,
+					transition: "opacity 150ms ease-out"
+				},
+				children: specimen_0
+			}), /* @__PURE__ */ jsx(Text, {
+				size: 0,
+				align: "center",
+				muted: !0,
+				children: caption
+			})]
+		}, `${weight}-${style}`);
+	}, $[7] = loading, $[8] = name, $[9] = t7) : t7 = $[9];
+	let t8 = items.map(t7), t9;
+	$[10] !== T1 || $[11] !== t8 ? (t9 = /* @__PURE__ */ jsx(T1, {
+		gap: 5,
+		wrap: "wrap",
+		children: t8
+	}), $[10] = T1, $[11] = t8, $[12] = t9) : t9 = $[12];
+	let t10;
+	return $[13] !== T0 || $[14] !== props || $[15] !== t9 ? (t10 = /* @__PURE__ */ jsx(T0, {
+		padding: 4,
+		radius: 2,
+		border: !0,
+		...props,
+		children: t9
+	}), $[13] = T0, $[14] = props, $[15] = t9, $[16] = t10) : t10 = $[16], t10;
+}
+function _temp(t0) {
+	let { specimen } = t0;
+	return specimen;
+}
+function TypeIcon(props) {
+	let $ = c(5), t0, t1, t2;
+	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx("path", { d: "M12 4v16" }), t1 = /* @__PURE__ */ jsx("path", { d: "M4 7V5a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2" }), t2 = /* @__PURE__ */ jsx("path", { d: "M9 20h6" }), $[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;
+}
+/**
+* Keeps the members of a configured list that a font can use, in their definition's order.
+*
+* @param list - Every allowed member, in order.
+* @param configured - The configured list, or undefined when none is set.
+* @returns The members, or undefined when none are usable.
+*/
+function selectMembers(list, configured) {
+	let selected = list.filter((member) => configured?.includes(member) === !0);
+	return isDefined(selected) ? selected : void 0;
+}
+/**
+* Reads a field's options where only their shape is known, as in validation.
+*
+* @param value - The options.
+* @returns The options, or undefined when there are none.
+*/
+function readFontOptions(value) {
+	if (!isRecord(value)) return;
+	let { sources, categories, weights, styles, subsets } = value;
+	return {
+		...Array.isArray(sources) && { sources: fontSources.filter((source) => sources.includes(source)) },
+		...Array.isArray(categories) && { categories: fontCategories.filter((category) => categories.includes(category)) },
+		...Array.isArray(weights) && { weights: parseWeights(weights) },
+		...Array.isArray(styles) && { styles: fontStyles.filter((style) => styles.includes(style)) },
+		...Array.isArray(subsets) && { subsets: subsets.filter((subset) => typeof subset == "string") }
+	};
+}
+/**
+* Resolves what a font field offers, requires, and previews. A field's own settings replace the plugin's, and a list
+* with nothing usable in it falls back to the default.
+*
+* @param options - The field's options.
+* @param config - The plugin configuration.
+* @returns The field's settings.
+*/
+function resolveFontOptions(options, config) {
+	let subsets = (options?.subsets ?? config.subsets)?.filter((subset) => isDefined(subset)), families = (options?.families ?? config.families)?.filter((family) => isDefined(family)), previewText = options?.preview?.text ?? config.preview?.text;
+	return {
+		sources: selectMembers(fontSources, options?.sources ?? config.sources) ?? defaultSources,
+		categories: selectMembers(fontCategories, options?.categories ?? config.categories) ?? [...fontCategories],
+		families: isDefined(families) ? [...new Set(families)] : void 0,
+		weights: selectMembers(fontWeights, options?.weights ?? config.weights) ?? defaultWeights,
+		styles: selectMembers(fontStyles, options?.styles ?? config.styles) ?? defaultStyles,
+		subsets: isDefined(subsets) ? subsets : defaultSubsets,
+		preview: { text: isDefined(previewText) ? previewText : void 0 }
+	};
+}
+/** Fields only one source sets, which are cleared when the font switches to the other. */
+const sourceFields = {
+	google: ["weights", "styles"],
+	upload: ["files"]
+};
+/**
+* Lists the fields to clear when a font switches source. The family and kind of typeface are cleared too, since they
+* described the other source's font.
+*
+* @param source - The new source.
+* @returns The fields to clear.
+*/
+function getStaleFields(source) {
+	return [
+		"family",
+		"category",
+		...sourceFields[source === "google" ? "upload" : "google"]
+	];
+}
+/**
+* Checks whether a font holds uploaded files, so the upload fields are only shown and required for an upload.
+*
+* @param parent - The font.
+* @returns Whether the font is an upload.
+*/
+function isUpload(parent) {
+	return typeof parent == "object" && !!parent && "source" in parent && parent.source === "upload";
+}
+/** Label and icon of each source's tab. */
+const sourceTabs = {
+	google: {
+		label: "Google Fonts",
+		icon: EarthGlobeIcon
+	},
+	upload: {
+		label: "Upload",
+		icon: UploadIcon
+	}
+};
+function Sources(t0) {
+	let $ = c(22), { id, offered, selected, readOnly, onSelect, children } = t0;
+	if (offered.length < 2) {
+		let t1;
+		return $[0] === children ? t1 = $[1] : (t1 = /* @__PURE__ */ jsx(Fragment$1, { children }), $[0] = children, $[1] = t1), t1;
+	}
+	let t1;
+	if ($[2] !== id || $[3] !== offered || $[4] !== onSelect || $[5] !== readOnly || $[6] !== selected) {
+		let t2;
+		$[8] !== id || $[9] !== onSelect || $[10] !== readOnly || $[11] !== selected ? (t2 = (source) => {
+			let { label, icon: Icon } = sourceTabs[source];
+			return /* @__PURE__ */ jsx(Tab, {
+				id: `${id}-tab-${source}`,
+				"aria-controls": `${id}-panel`,
+				icon: /* @__PURE__ */ jsx(Icon, {}),
+				label,
+				selected: source === selected,
+				disabled: readOnly,
+				onClick: () => {
+					onSelect(source);
+				}
+			}, source);
+		}, $[8] = id, $[9] = onSelect, $[10] = readOnly, $[11] = selected, $[12] = t2) : t2 = $[12], t1 = offered.map(t2), $[2] = id, $[3] = offered, $[4] = onSelect, $[5] = readOnly, $[6] = selected, $[7] = t1;
+	} else t1 = $[7];
+	let t2;
+	$[13] === t1 ? t2 = $[14] : (t2 = /* @__PURE__ */ jsx(TabList, {
+		gap: 1,
+		children: t1
+	}), $[13] = t1, $[14] = t2);
+	let t3 = `${id}-panel`, t4 = `${id}-tab-${selected}`, t5;
+	$[15] !== children || $[16] !== t3 || $[17] !== t4 ? (t5 = /* @__PURE__ */ jsx(TabPanel, {
+		id: t3,
+		"aria-labelledby": t4,
+		children
+	}), $[15] = children, $[16] = t3, $[17] = t4, $[18] = t5) : t5 = $[18];
+	let t6;
+	return $[19] !== t2 || $[20] !== t5 ? (t6 = /* @__PURE__ */ jsxs(Stack, {
+		gap: 4,
+		children: [t2, t5]
+	}), $[19] = t2, $[20] = t5, $[21] = t6) : t6 = $[21], t6;
+}
+/**
+* Builds the patches that switch a font to another source, clearing the fields the previous one set. Otherwise
+* they'd stay hidden in the document and reappear if the author switched back.
+*
+* @param typeName - The font type's schema name.
+* @param source - The new source.
+* @returns The patches.
+*/
+function createSourcePatches(typeName, source) {
+	return [
+		setIfMissing({ _type: typeName }),
+		set(source, ["source"]),
+		...getStaleFields(source).map((field) => unset([field]))
+	];
+}
+/**
+* Creates the font field input, bound to the plugin's configuration. A field's own lists replace the plugin's rather
+* than adding to them.
+*
+* @param config - The plugin configuration.
+* @returns The input component.
+*/
+function createInput(config) {
+	function Input(props) {
+		let $ = c(38), { id, schemaType, value, onChange, readOnly, renderDefault } = props, { source: storedSource, family: storedFamily } = value ?? {}, family = getFamilyName(value), [open, setOpen] = useState(!1), [tab, setTab] = useState(), { sources, categories, families, weights, styles, subsets, preview } = resolveFontOptions(schemaType.options, config), [t0] = sources, defaultSource = t0 === void 0 ? "google" : t0, selected = tab ?? (isDefined(storedSource) && sources.includes(storedSource) ? storedSource : defaultSource), variants = listVariants(weights, styles), sampleVariants = storedSource === "upload" ? listFileVariants(value?.files ?? [], variants) : listVariants(value?.weights ?? [], value?.styles ?? []), handleSelectSource = function handleSelectSource(source) {
+			setTab(source), source === "upload" && storedSource !== "upload" && onChange(createSourcePatches(schemaType.name, source));
+		}, handleSelectFamily = function handleSelectFamily(selection) {
+			onChange([
+				...createSourcePatches(schemaType.name, "google"),
+				set(selection.family, ["family"]),
+				set(selection.category, ["category"]),
+				set(weights, ["weights"]),
+				set(styles, ["styles"])
+			]), setOpen(!1);
+		}, handleOpen = function handleOpen() {
+			selected === "upload" && storedSource !== "upload" && onChange(createSourcePatches(schemaType.name, "upload")), setOpen(!0);
+		}, t1;
+		$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = function handleClose() {
+			setTab(void 0), setOpen(!1);
+		}, $[0] = t1) : t1 = $[0];
+		let handleClose = t1, T0 = Stack, t3;
+		$[1] === Symbol.for("react.memo_cache_sentinel") ? (t3 = /* @__PURE__ */ jsx(TypeIcon, { ...defaultIconProps }), $[1] = t3) : t3 = $[1];
+		let t4 = family ?? "Select font", t5 = isDefined(family) ? `${family} currently selected` : "Select font", t6;
+		$[2] !== handleOpen || $[3] !== id || $[4] !== readOnly || $[5] !== t4 || $[6] !== t5 ? (t6 = /* @__PURE__ */ jsx(Button, {
+			id,
+			type: "button",
+			mode: "ghost",
+			icon: t3,
+			text: t4,
+			disabled: readOnly,
+			onClick: handleOpen,
+			"aria-label": t5
+		}), $[2] = handleOpen, $[3] = id, $[4] = readOnly, $[5] = t4, $[6] = t5, $[7] = t6) : t6 = $[7];
+		let t7;
+		$[8] !== onChange || $[9] !== readOnly || $[10] !== value ? (t7 = isDefined(value) && /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			mode: "ghost",
+			tone: "critical",
+			icon: /* @__PURE__ */ jsx(CloseIcon, {}),
+			text: "Clear",
+			disabled: readOnly,
+			onClick: () => {
+				onChange(unset());
+			},
+			"aria-label": "Clear the selected font"
+		}), $[8] = onChange, $[9] = readOnly, $[10] = value, $[11] = t7) : t7 = $[11];
+		let t8;
+		$[12] !== t6 || $[13] !== t7 ? (t8 = /* @__PURE__ */ jsxs(Flex, {
+			gap: 2,
+			children: [t6, t7]
+		}), $[12] = t6, $[13] = t7, $[14] = t8) : t8 = $[14];
+		let t9 = isDefined(family) && isDefined(sampleVariants) && /* @__PURE__ */ jsx(Sample, {
+			value: value ?? {},
+			text: preview.text,
+			variants: sampleVariants
+		}), t10;
+		$[15] !== categories || $[16] !== families || $[17] !== handleClose || $[18] !== handleSelectFamily || $[19] !== handleSelectSource || $[20] !== id || $[21] !== onChange || $[22] !== open || $[23] !== props || $[24] !== readOnly || $[25] !== renderDefault || $[26] !== selected || $[27] !== sources || $[28] !== storedFamily || $[29] !== storedSource || $[30] !== subsets || $[31] !== variants ? (t10 = open && /* @__PURE__ */ jsx(Dialog, {
+			id: `${id}-dialog`,
+			header: "Select font",
+			width: 1,
+			onClose: handleClose,
+			onClickOutside: handleClose,
+			children: /* @__PURE__ */ jsx(Box, {
+				padding: 4,
+				children: /* @__PURE__ */ jsxs(Sources, {
+					id,
+					offered: sources,
+					selected,
+					readOnly,
+					onSelect: handleSelectSource,
+					children: [selected === "google" && /* @__PURE__ */ jsx(Picker, {
+						id,
+						selected: storedSource === "google" ? storedFamily : void 0,
+						categories,
+						families,
+						variants,
+						subsets,
+						onSelect: handleSelectFamily
+					}), selected === "upload" && /* @__PURE__ */ jsx(FilesProvider, {
+						fillDetails: (name, category) => {
+							onChange([...isDefined(name) ? [setIfMissing(name, ["family"])] : [], ...isDefined(category) ? [setIfMissing(category, ["category"])] : []]);
+						},
+						children: renderDefault(props)
+					})]
+				})
+			})
+		}), $[15] = categories, $[16] = families, $[17] = handleClose, $[18] = handleSelectFamily, $[19] = handleSelectSource, $[20] = id, $[21] = onChange, $[22] = open, $[23] = props, $[24] = readOnly, $[25] = renderDefault, $[26] = selected, $[27] = sources, $[28] = storedFamily, $[29] = storedSource, $[30] = subsets, $[31] = variants, $[32] = t10) : t10 = $[32];
+		let t11;
+		return $[33] !== T0 || $[34] !== t10 || $[35] !== t8 || $[36] !== t9 ? (t11 = /* @__PURE__ */ jsxs(T0, {
+			gap: 3,
+			children: [
+				t8,
+				t9,
+				t10
+			]
+		}), $[33] = T0, $[34] = t10, $[35] = t8, $[36] = t9, $[37] = t11) : t11 = $[37], t11;
+	}
+	return Input;
+}
+function Preview(t0) {
+	let $ = c(12), props, style, value;
+	$[0] === t0 ? (props = $[1], style = $[2], value = $[3]) : ({value, style, ...props} = t0, $[0] = t0, $[1] = props, $[2] = style, $[3] = value);
+	let { name } = useFontSample(useStoredSample(value, "Aa")), t1;
+	$[4] === name ? t1 = $[5] : (t1 = isDefined(name) ? `"${name}"` : void 0, $[4] = name, $[5] = t1);
+	let t2;
+	$[6] !== style || $[7] !== t1 ? (t2 = {
+		fontFamily: t1,
+		lineHeight: 1,
+		...style
+	}, $[6] = style, $[7] = t1, $[8] = t2) : t2 = $[8];
+	let t3;
+	return $[9] !== props || $[10] !== t2 ? (t3 = /* @__PURE__ */ jsx("span", {
+		style: t2,
+		...props,
+		children: "Aa"
+	}), $[9] = props, $[10] = t2, $[11] = t3) : t3 = $[11], t3;
+}
+/**
+* Creates preview media for a stored font, so each document shows a sample in its own font instead of an icon.
+*
+* @param value - The stored font.
+* @returns The media component, or undefined when neither a family nor a file was stored.
+* @public
+*/
+function createFontPreview(value) {
+	if (isDefined(value) && (isDefined(getFamilyName(value)) || isDefined(value.files))) return function FontPreview() {
+		return createElement(Preview, { value });
+	};
+}
+/** Weights listed in the upload fields, each with its name. */
+/**
+* Validates a font against the kinds of typeface its field allows and the weights and styles it requires.
+*
+* @param value - The font.
+* @param categories - The kinds of typeface allowed.
+* @param variants - The weights and styles required.
+* @returns True when the font is valid, or what's wrong.
+*/
+function validateFont(value, categories, variants) {
+	let { source, family, category, weights, styles, files } = value;
+	if (source === "upload" && isDefined(category) && !categories.includes(category)) return `This field only takes ${new Intl.ListFormat("en-US", { type: "disjunction" }).format(categories.map((member) => fontCategoryLabels[member]))} fonts. Choose another kind, or upload a different font.`;
+	if (source === "upload") {
+		let missing = listMissingVariants(files ?? [], variants);
+		return !isDefined(missing) || `Upload a file for ${new Intl.ListFormat("en-US").format(missing.map((variant) => describeVariant(variant)))}, which this field needs.`;
+	}
+	if (!isDefined(family)) return "Select a font.";
+	let loaded = listVariants(weights ?? [], styles ?? []);
+	return !variants.some((variant) => !loaded.some(({ weight, style }) => weight === variant.weight && style === variant.style)) || "Select the font again to load the weights and styles this field needs.";
+}
+/**
+* Creates the font object type, applying the plugin's settings to fields that don't set their own.
+*
+* @param config - The plugin configuration.
+* @returns The font type.
+*/
+function createFontType(config) {
+	return defineType({
+		name: fontTypeName,
+		type: "object",
+		icon: createSanityIcon(TypeIcon),
+		description: "Font chosen from Google Fonts or uploaded.",
+		components: {
+			field: Field,
+			input: createInput(config)
+		},
+		validation: (rule) => rule.custom((value, context) => {
+			if (!isDefined(value)) return !0;
+			let { categories, weights, styles } = resolveFontOptions(readFontOptions(context.type?.options), config);
+			return validateFont(value, categories, listVariants(weights, styles));
+		}),
+		preview: {
+			select: {
+				source: "source",
+				family: "family",
+				files: "files"
+			},
+			prepare(selection) {
+				let { source, family, files } = selection;
+				return {
+					title: getFamilyName({
+						source,
+						family,
+						files
+					}) ?? "No font",
+					subtitle: source === "upload" ? "Uploaded" : "Google Fonts",
+					media: createFontPreview({
+						_type: fontTypeName,
+						source,
+						family,
+						files
+					})
+				};
+			}
+		},
+		fields: [
+			defineField({
+				name: "source",
+				type: "string",
+				description: "Where the font comes from, chosen from the tabs.",
+				components: { field: Hidden }
+			}),
+			defineField({
+				name: "family",
+				type: "string",
+				description: "Name the site uses for the font, filled in from the font files.",
+				placeholder: "Defaults to the family in the font files",
+				hidden: ({ parent }) => !isUpload(parent),
+				validation: (rule) => rule.custom((value, context) => {
+					let files = isRecord(context.parent) ? context.parent.files : void 0;
+					return isUpload(context.parent) && Array.isArray(files) && isDefined(files) && !isDefined(value) ? "Enter the name of the font family." : !0;
+				})
+			}),
+			defineField({
+				name: "category",
+				type: "string",
+				description: "Kind of typeface, which decides the fallback shown while the font loads.",
+				options: { list: fontCategories.map((category) => ({
+					title: fontCategoryLabels[category],
+					value: category
+				})) },
+				hidden: ({ parent }) => !isUpload(parent)
+			}),
+			defineField({
+				name: "weights",
+				type: "array",
+				description: "Weights to load from Google Fonts, saved when the family is chosen.",
+				of: [defineArrayMember({ type: "number" })],
+				hidden: !0
+			}),
+			defineField({
+				name: "styles",
+				type: "array",
+				description: "Styles to load from Google Fonts, saved when the family is chosen.",
+				of: [defineArrayMember({ type: "string" })],
+				hidden: !0
+			}),
+			defineField({
+				name: "files",
+				type: "array",
+				description: "WOFF2 or WOFF files, one for each weight and style, or a single variable font.",
+				components: { input: FilesInput },
+				hidden: ({ parent }) => !isUpload(parent),
+				validation: (rule) => [rule.custom((value, context) => isUpload(context.parent) && !isDefined(value) ? "Upload the font's files." : !0), rule.custom((value) => {
+					let duplicates = findDuplicateFiles(value ?? []);
+					return !isDefined(duplicates) || `More than one file holds ${new Intl.ListFormat("en-US").format(duplicates.map((file) => describeFile(file)))}. Remove the duplicates.`;
+				}).warning()],
+				of: [defineArrayMember({
+					name: fontFileTypeName,
+					type: "file",
+					options: { accept: ".woff2,.woff" },
+					preview: {
+						select: {
+							asset: "asset",
+							weight: "weight",
+							maxWeight: "maxWeight",
+							style: "style",
+							filename: "asset.originalFilename"
+						},
+						prepare(selection) {
+							let { asset, weight, maxWeight, style, filename } = selection;
+							return {
+								title: describeFile({
+									weight,
+									maxWeight,
+									style
+								}),
+								subtitle: filename,
+								media: isDefined(asset) ? createFontPreview({
+									_type: fontTypeName,
+									source: "upload",
+									files: [{
+										_type: fontFileTypeName,
+										_key: "preview",
+										asset,
+										weight,
+										maxWeight,
+										style
+									}]
+								}) : void 0
+							};
+						}
+					},
+					validation: (rule) => rule.custom((value) => isDefined(value?.asset?._ref) && !isDefined(value.weight) ? "This file has no weight or style. Remove it and upload it again." : !0),
+					fields: [
+						defineField({
+							name: "family",
+							type: "string",
+							description: "Name of the family the file belongs to, read from the file.",
+							hidden: !0
+						}),
+						defineField({
+							name: "weight",
+							type: "number",
+							description: "Weight the file holds, or the lightest a variable font file covers, read from the file.",
+							hidden: !0
+						}),
+						defineField({
+							name: "maxWeight",
+							type: "number",
+							description: "Heaviest weight a variable font file covers, read from the file.",
+							hidden: !0
+						}),
+						defineField({
+							name: "style",
+							type: "string",
+							description: "Style the file holds, read from the file.",
+							hidden: !0
+						})
+					]
+				})]
+			})
+		]
+	});
+}
+const plugin = definePlugin((config) => ({
+	name: pluginName,
+	schema: { types: [createFontType(config)] }
+}));
+/**
+* Adds a font field type to Sanity Studio, with a searchable picker for Google Fonts and uploads for anything else.
+*
+* @param config - The plugin configuration, which every field uses unless it sets its own.
+* @returns The plugin.
+* @public
+*/
+function fontPlugin(config = {}) {
+	return plugin(config);
+}
+export { createFontPreview, fontPlugin };
+
+//# sourceMappingURL=index.js.map