@sanity/vision 6.20.0 → 6.21.0-next.103

package/lib/{SanityVision-ePOzvdmp.js → SanityVision-tHhBPbsg.js}

@@ -1,4 +1,4 @@
-import { t as visionLocaleNamespace } from "./i18n-JS8KzGj8.js";
+import { t as visionLocaleNamespace } from "./i18n-BGSN3nAJ.js";
 import { Component, Fragment, Suspense, createContext, lazy, use, useEffect, useImperativeHandle, useRef, useState, useSyncExternalStore } from "react";
 import { ContextMenuButton, RELEASES_STUDIO_CLIENT_OPTIONS, Translate, UserAvatar, VARIANTS_STUDIO_CLIENT_OPTIONS, getDefaultVariant, getReleaseIdFromReleaseDocumentId, getVariantTitle, isCardinalityOneRelease, sortReleases, useActiveReleases, useClient, useCurrentUser, useDataset, useDateTimeFormat, useKeyValueStore, usePerspective, useScheduledDraftsEnabled, useTranslation, useWorkspace } from "sanity";
 import { IntentLink } from "sanity/router";
@@ -20,7 +20,6 @@ import { EditorState } from "@codemirror/state";
 import { EditorView, drawSelection, highlightActiveLine, highlightActiveLineGutter, highlightSpecialChars, keymap, lineNumbers } from "@codemirror/view";
 import { groq } from "@sanity/lezer-groq";
 import CodeMirror, { EditorSelection as EditorSelection$1 } from "@uiw/react-codemirror";
-import { assignInlineVars } from "@vanilla-extract/dynamic";
 import { tags } from "@lezer/highlight";
 import { hues } from "@sanity/color";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -294,26 +293,26 @@ function getVisibleColumns(view, { lines, scrollbarWidth } = {}) {
 	let { scrollDOM, contentDOM, defaultCharacterWidth, defaultLineHeight } = view, gutters = scrollDOM.querySelector(".cm-gutters"), line = contentDOM.querySelector(".cm-line"), currentLines = view.state.doc.lines, nextLines = lines ?? currentLines, gutterGrowth = (lineNumberDigits(nextLines) - lineNumberDigits(currentLines)) * defaultCharacterWidth, willOverflowVertically = nextLines * defaultLineHeight + insets(contentDOM, ["Top", "Bottom"]) > scrollDOM.clientHeight, hasVerticalScrollbar = scrollDOM.scrollHeight > scrollDOM.clientHeight, scrollbarReserve = willOverflowVertically && !hasVerticalScrollbar ? scrollbarWidth ?? getScrollbarWidth() : 0, width = scrollDOM.clientWidth - (gutters instanceof HTMLElement ? gutters.offsetWidth : 0) - gutterGrowth - insets(contentDOM, ["Left", "Right"]) - (line ? insets(line, ["Left", "Right"]) : 0) - scrollbarReserve, columns = Math.floor(width / defaultCharacterWidth);
 	return Number.isFinite(columns) && columns > 0 ? columns : void 0;
 }
-var contentBorderRightWidthVar = "var(--_2nm9wj1)", contentPaddingTopVar = "var(--_2nm9wj2)", editorRoot = "_2nm9wj3", editorRootAutoHeight = "_2nm9wj4", linePaddingLeftVar = "var(--_2nm9wj0)";
+const _key0$5 = "HSFWEW_editorRoot";
 function EditorRoot(t0) {
-	let $ = c(14), { autoHeight, underHeader, children } = t0, { sanity } = useTheme(), t1 = autoHeight ? `${editorRoot} ${editorRootAutoHeight}` : editorRoot, t2;
-	$[0] === sanity.space[3] ? t2 = $[1] : (t2 = rem(sanity.space[3]), $[0] = sanity.space[3], $[1] = t2);
-	let t3 = `${t2}`, t4;
-	$[2] === sanity.space[4] ? t4 = $[3] : (t4 = rem(sanity.space[4]), $[2] = sanity.space[4], $[3] = t4);
-	let t5 = `${t4}`, t6 = sanity.space[underHeader ? 3 : 5], t7;
-	$[4] === t6 ? t7 = $[5] : (t7 = rem(t6), $[4] = t6, $[5] = t7);
-	let t8 = `${t7}`, t9;
-	$[6] !== t3 || $[7] !== t5 || $[8] !== t8 ? (t9 = assignInlineVars({
-		[linePaddingLeftVar]: t3,
-		[contentBorderRightWidthVar]: t5,
-		[contentPaddingTopVar]: t8
-	}), $[6] = t3, $[7] = t5, $[8] = t8, $[9] = t9) : t9 = $[9];
-	let t10;
-	return $[10] !== children || $[11] !== t1 || $[12] !== t9 ? (t10 = /* @__PURE__ */ jsx("div", {
-		className: t1,
-		style: t9,
+	let $ = c(14), { autoHeight, underHeader, children } = t0, { sanity } = useTheme(), t1;
+	$[0] === sanity.space[3] ? t1 = $[1] : (t1 = rem(sanity.space[3]), $[0] = sanity.space[3], $[1] = t1);
+	let t2 = `${t1}`, t3;
+	$[2] === sanity.space[4] ? t3 = $[3] : (t3 = rem(sanity.space[4]), $[2] = sanity.space[4], $[3] = t3);
+	let t4 = `${t3}`, t5 = sanity.space[underHeader ? 3 : 5], t6;
+	$[4] === t5 ? t6 = $[5] : (t6 = rem(t5), $[4] = t5, $[5] = t6);
+	let t7 = `${t6}`, t8;
+	$[6] !== t2 || $[7] !== t4 || $[8] !== t7 ? (t8 = {
+		"--vision-editor-line-padding-left": t2,
+		"--vision-editor-content-border-right-width": t4,
+		"--vision-editor-content-padding-top": t7
+	}, $[6] = t2, $[7] = t4, $[8] = t7, $[9] = t8) : t8 = $[9];
+	let style = t8, t9 = autoHeight ? `${_key0$5} HSFWEW_editorRootAutoHeight` : _key0$5, t10;
+	return $[10] !== children || $[11] !== style || $[12] !== t9 ? (t10 = /* @__PURE__ */ jsx("div", {
+		className: t9,
+		style,
 		children
-	}), $[10] = children, $[11] = t1, $[12] = t9, $[13] = t10) : t10 = $[13], t10;
+	}), $[10] = children, $[11] = style, $[12] = t9, $[13] = t10) : t10 = $[13], t10;
 }
 function VisionCodeMirror(t0) {
 	let $ = c(21), { ref, onChange, initialValue: initialValueProp, extensions, autoHeight: t1, underHeader: t2 } = t0, autoHeight = t1 !== void 0 && t1, underHeader = t2 === void 0 ? autoHeight : t2, [value, setValue] = useState(initialValueProp), [hasView, setHasView] = useState(!1), [seenInitialValue, setSeenInitialValue] = useState(initialValueProp);
@@ -399,6 +398,14 @@ function VisionCodeMirror(t0) {
 		children: t14
 	}), $[17] = autoHeight, $[18] = t14, $[19] = underHeader, $[20] = t15) : t15 = $[20], t15;
 }
+/**
+* Whether the workspace has variants switched on (`beta.variants.enabled`). The studio gates its
+* own variant UI on this flag, the navbar's variant selector included, so Vision shows and sends
+* variants only where the navbar does.
+*/
+function useVariantsEnabled() {
+	return !!useWorkspace().beta?.variants?.enabled;
+}
 const SUPPORTED_PERSPECTIVES = [
 	"pinnedRelease",
 	"scheduledDrafts",
@@ -595,7 +602,7 @@ function tryParseParams(val, t) {
 		return err.message = `${t("params.error.params-invalid-json")}:\n\n${err.message.replace("JSON5:", "")}`, err;
 	}
 }
-var controlsContainer = "_168md2ym", downloadsCard = "_168md2yj", header = "_168md2y3", inputBackgroundContainer = "_168md2y7", inputBackgroundContainerLeft = "_168md2y8", inputContainer = "_168md2y9", queryCopyLink = "_168md2y6", queryRecallPaneContainer = "_168md2y1", queryRecallPaneWrapper = "_168md2y2", result = "_168md2ye", resultContainer = "_168md2yc", resultContainerInvalid = "_168md2yd", resultFooter = "_168md2yf", resultInnerContainer = "_168md2yb", resultOuterContainer = "_168md2ya", root = "_168md2y0", saveResultLabel = "_168md2yl", saveResultSpanGapVar = "var(--_168md2yk)", splitpaneContainer = "_168md2y5", styledLabel = "_168md2y4", timingsCard = "_168md2yg", timingsTextContainer = "_168md2yi", timingsTextMinHeightVar = "var(--_168md2yh)";
+const _key3 = "lBV0cq_inputBackgroundContainer", _key10 = "lBV0cq_resultContainer";
 function Root(t0) {
 	let $ = c(6), props, ref;
 	$[0] === t0 ? (props = $[1], ref = $[2]) : ({ref, ...props} = t0, $[0] = t0, $[1] = props, $[2] = ref);
@@ -603,28 +610,28 @@ function Root(t0) {
 	return $[3] !== props || $[4] !== ref ? (t1 = /* @__PURE__ */ jsx(Flex, {
 		...props,
 		ref,
-		className: root
+		className: "lBV0cq_root"
 	}), $[3] = props, $[4] = ref, $[5] = t1) : t1 = $[5], t1;
 }
 function Header(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Card, {
 		...props,
-		className: header
+		className: "lBV0cq_header"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function StyledLabel(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Label, {
 		...props,
-		className: styledLabel
+		className: "lBV0cq_styledLabel"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function SplitpaneContainer(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Box, {
 		...props,
-		className: splitpaneContainer
+		className: "lBV0cq_splitpaneContainer"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function QueryRecallPaneContainer(props) {
@@ -632,7 +639,7 @@ function QueryRecallPaneContainer(props) {
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Flex, {
 		...props,
 		flexDirection: "column",
-		className: queryRecallPaneContainer
+		className: "lBV0cq_queryRecallPaneContainer"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function QueryRecallPaneWrapper(props) {
@@ -643,55 +650,55 @@ function QueryRecallPaneWrapper(props) {
 		flexBasis: "0%",
 		flexGrow: 1,
 		overflow: "hidden",
-		className: queryRecallPaneWrapper
+		className: "lBV0cq_queryRecallPaneWrapper"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function QueryCopyLink(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx("a", {
 		...props,
-		className: queryCopyLink
+		className: "lBV0cq_queryCopyLink"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function InputBackgroundContainer(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Box, {
 		...props,
-		className: inputBackgroundContainer
+		className: _key3
 	}), $[0] = props, $[1] = t0), t0;
 }
 function InputBackgroundContainerLeft(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Box, {
 		...props,
-		className: `${inputBackgroundContainer} ${inputBackgroundContainerLeft}`
+		className: `${_key3} lBV0cq_inputBackgroundContainerLeft`
 	}), $[0] = props, $[1] = t0), t0;
 }
 function InputContainer(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Card, {
 		...props,
-		className: inputContainer
+		className: "lBV0cq_inputContainer"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function ResultOuterContainer(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Flex, {
 		...props,
-		className: resultOuterContainer
+		className: "lBV0cq_resultOuterContainer"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function ResultInnerContainer(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Box, {
 		...props,
-		className: resultInnerContainer
+		className: "lBV0cq_resultInnerContainer"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function ResultContainer(t0) {
 	let $ = c(6), isInvalid, props;
 	$[0] === t0 ? (isInvalid = $[1], props = $[2]) : ({isInvalid, ...props} = t0, $[0] = t0, $[1] = isInvalid, $[2] = props);
-	let t1 = isInvalid ? `${resultContainer} ${resultContainerInvalid}` : resultContainer, t2;
+	let t1 = isInvalid ? `${_key10} lBV0cq_resultContainerInvalid` : _key10, t2;
 	return $[3] !== props || $[4] !== t1 ? (t2 = /* @__PURE__ */ jsx(Card, {
 		...props,
 		className: t1
@@ -701,59 +708,59 @@ function Result(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Box, {
 		...props,
-		className: result
+		className: "lBV0cq_result"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function ResultFooter(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Flex, {
 		...props,
-		className: resultFooter
+		className: "lBV0cq_resultFooter"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function TimingsCard(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Card, {
 		...props,
-		className: timingsCard
+		className: "lBV0cq_timingsCard"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function TimingsTextContainer(props) {
 	let $ = c(7), { space, font } = useTheme_v2(), textSize = font.text.sizes[2], t0 = space[3] * 2 + textSize.lineHeight - textSize.ascenderHeight - textSize.descenderHeight, t1;
 	$[0] === t0 ? t1 = $[1] : (t1 = rem(t0), $[0] = t0, $[1] = t1);
 	let t2 = `${t1}`, t3;
-	$[2] === t2 ? t3 = $[3] : (t3 = assignInlineVars({ [timingsTextMinHeightVar]: t2 }), $[2] = t2, $[3] = t3);
-	let t4;
-	return $[4] !== props || $[5] !== t3 ? (t4 = /* @__PURE__ */ jsx(Flex, {
+	$[2] === t2 ? t3 = $[3] : (t3 = { "--vision-timings-text-min-height": t2 }, $[2] = t2, $[3] = t3);
+	let style = t3, t4;
+	return $[4] !== props || $[5] !== style ? (t4 = /* @__PURE__ */ jsx(Flex, {
 		...props,
-		className: timingsTextContainer,
-		style: t3
-	}), $[4] = props, $[5] = t3, $[6] = t4) : t4 = $[6], t4;
+		className: "lBV0cq_timingsTextContainer",
+		style
+	}), $[4] = props, $[5] = style, $[6] = t4) : t4 = $[6], t4;
 }
 function DownloadsCard(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Card, {
 		...props,
-		className: downloadsCard
+		className: "lBV0cq_downloadsCard"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function SaveResultLabel(props) {
 	let $ = c(7), { space } = useTheme_v2(), t0;
 	$[0] === space[3] ? t0 = $[1] : (t0 = rem(space[3]), $[0] = space[3], $[1] = t0);
 	let t1 = `${t0}`, t2;
-	$[2] === t1 ? t2 = $[3] : (t2 = assignInlineVars({ [saveResultSpanGapVar]: t1 }), $[2] = t1, $[3] = t2);
-	let t3;
-	return $[4] !== props || $[5] !== t2 ? (t3 = /* @__PURE__ */ jsx(Text, {
+	$[2] === t1 ? t2 = $[3] : (t2 = { "--vision-save-result-gap": t1 }, $[2] = t1, $[3] = t2);
+	let style = t2, t3;
+	return $[4] !== props || $[5] !== style ? (t3 = /* @__PURE__ */ jsx(Text, {
 		...props,
-		className: saveResultLabel,
-		style: t2
-	}), $[4] = props, $[5] = t2, $[6] = t3) : t3 = $[6], t3;
+		className: "lBV0cq_saveResultLabel",
+		style
+	}), $[4] = props, $[5] = style, $[6] = t3) : t3 = $[6], t3;
 }
 function ControlsContainer(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Box, {
 		...props,
-		className: controlsContainer
+		className: "lBV0cq_controlsContainer"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function ParamsEditor(props) {
@@ -1109,12 +1116,11 @@ function _temp2$4(a, b) {
 	return new Date(b.savedAt || 0).getTime() - new Date(a.savedAt || 0).getTime();
 }
 function _temp$6() {}
-var fixedHeader = "_2440ks0", queryList = "_2440ks2", scrollContainer = "_2440ks1";
 function FixedHeader(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(VStack, {
 		...props,
-		className: fixedHeader
+		className: "A8N59q_fixedHeader"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function ScrollContainer(props) {
@@ -1125,7 +1131,7 @@ function ScrollContainer(props) {
 		flexBasis: "0%",
 		flexGrow: 1,
 		overflow: "hidden",
-		className: scrollContainer
+		className: "A8N59q_scrollContainer"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function QueryList(props) {
@@ -1135,7 +1141,7 @@ function QueryList(props) {
 		flexBasis: "0%",
 		flexGrow: 1,
 		overflow: "auto",
-		className: queryList
+		className: "A8N59q_queryList"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function QueryRecall(t0) {
@@ -1879,25 +1885,24 @@ function VisionGuiControls(t0) {
 		})
 	}) }), $[30] = hasValidParams, $[31] = t15, $[32] = t2, $[33] = t16) : t16 = $[33], t16;
 }
-var dot = "c29iyq2", perspectivePopoverContent = "c29iyq0", perspectivePopoverLink = "c29iyq1";
 function PerspectivePopoverContent(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Box, {
 		...props,
-		className: perspectivePopoverContent
+		className: "BsYI2a_perspectivePopoverContent"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function PerspectivePopoverLink(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx("a", {
 		...props,
-		className: perspectivePopoverLink
+		className: "BsYI2a_perspectivePopoverLink"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function Dot(t0) {
 	let $ = c(2), { tone } = t0, t1 = `var(--card-badge-${tone}-dot-color)`, t2;
 	return $[0] === t1 ? t2 = $[1] : (t2 = /* @__PURE__ */ jsx("div", {
-		className: dot,
+		className: "BsYI2a_dot",
 		style: { backgroundColor: t1 }
 	}), $[0] = t1, $[1] = t2), t2;
 }
@@ -1996,125 +2001,123 @@ function _temp$4(o) {
 	return !o;
 }
 const PinnedReleasePerspectiveOption = (t0) => {
-	let $ = c(17), { pinnedPerspective, t } = t0, name = typeof pinnedPerspective.selectedPerspective == "object" ? pinnedPerspective.selectedPerspective.metadata.title : pinnedPerspective.selectedPerspectiveName, t1;
-	if ($[0] !== pinnedPerspective.selectedVariantNames || $[1] !== pinnedPerspective.selectedVariants) {
-		let variant = getDefaultVariant(pinnedPerspective.selectedVariants), t2;
-		$[3] === pinnedPerspective.selectedVariantNames ? t2 = $[4] : (t2 = getDefaultVariant(pinnedPerspective.selectedVariantNames), $[3] = pinnedPerspective.selectedVariantNames, $[4] = t2), t1 = variant ? getVariantTitle(variant) : t2, $[0] = pinnedPerspective.selectedVariantNames, $[1] = pinnedPerspective.selectedVariants, $[2] = t1;
-	} else t1 = $[2];
-	let variantTitle = t1, t2;
-	$[5] !== pinnedPerspective || $[6] !== t ? (t2 = hasPinnedPerspective(pinnedPerspective) ? `(${t("settings.perspectives.pinned-release-label")})` : t("settings.perspectives.pinned-release-label"), $[5] = pinnedPerspective, $[6] = t, $[7] = t2) : t2 = $[7];
-	let label = t2, t3 = variantTitle ? `· ${variantTitle}` : void 0, t4;
-	$[8] !== label || $[9] !== name || $[10] !== t3 ? (t4 = [
+	let $ = c(12), { pinnedPerspective, variantTitle, t } = t0, name = typeof pinnedPerspective.selectedPerspective == "object" ? pinnedPerspective.selectedPerspective.metadata.title : pinnedPerspective.selectedPerspectiveName, t1;
+	$[0] !== pinnedPerspective || $[1] !== t ? (t1 = hasPinnedPerspective(pinnedPerspective) ? `(${t("settings.perspectives.pinned-release-label")})` : t("settings.perspectives.pinned-release-label"), $[0] = pinnedPerspective, $[1] = t, $[2] = t1) : t1 = $[2];
+	let label = t1, t2 = variantTitle ? `· ${variantTitle}` : void 0, t3;
+	$[3] !== label || $[4] !== name || $[5] !== t2 ? (t3 = [
 		name,
-		t3,
+		t2,
 		label
-	].filter(_temp$3), $[8] = label, $[9] = name, $[10] = t3, $[11] = t4) : t4 = $[11];
-	let text = t4.join(" "), t5;
-	$[12] === pinnedPerspective ? t5 = $[13] : (t5 = hasPinnedPerspective(pinnedPerspective), $[12] = pinnedPerspective, $[13] = t5);
-	let t6 = !t5, t7;
-	return $[14] !== t6 || $[15] !== text ? (t7 = /* @__PURE__ */ jsx("option", {
+	].filter(_temp$3), $[3] = label, $[4] = name, $[5] = t2, $[6] = t3) : t3 = $[6];
+	let text = t3.join(" "), t4;
+	$[7] === pinnedPerspective ? t4 = $[8] : (t4 = hasPinnedPerspective(pinnedPerspective), $[7] = pinnedPerspective, $[8] = t4);
+	let t5 = !t4, t6;
+	return $[9] !== t5 || $[10] !== text ? (t6 = /* @__PURE__ */ jsx("option", {
 		value: "pinnedRelease",
-		disabled: t6,
+		disabled: t5,
 		children: text
-	}), $[14] = t6, $[15] = text, $[16] = t7) : t7 = $[16], t7;
+	}), $[9] = t5, $[10] = text, $[11] = t6) : t6 = $[11], t6;
 };
 function VisionGuiHeader(t0) {
-	let $ = c(81), { onChangeDataset, dataset, customApiVersion, apiVersion, onChangeApiVersion, datasets, customApiVersionElementRef, onCustomApiVersionChange, isValidApiVersion, onChangePerspective, url, perspective, isScheduledDraftsEnabled } = t0, pinnedPerspective = usePerspective(), t1;
-	$[0] !== perspective || $[1] !== pinnedPerspective.selectedVariantNames ? (t1 = getActiveVariant(perspective, getDefaultVariant(pinnedPerspective.selectedVariantNames)), $[0] = perspective, $[1] = pinnedPerspective.selectedVariantNames, $[2] = t1) : t1 = $[2];
-	let isApiVersionLocked = !!t1, { t } = useTranslation(visionLocaleNamespace), operationUrlElement = useRef(null), t2;
-	$[3] === Symbol.for("react.memo_cache_sentinel") ? (t2 = () => {
+	let $ = c(85), { onChangeDataset, dataset, customApiVersion, apiVersion, onChangeApiVersion, datasets, customApiVersionElementRef, onCustomApiVersionChange, isValidApiVersion, onChangePerspective, url, perspective, isScheduledDraftsEnabled } = t0, pinnedPerspective = usePerspective(), isVariantsEnabled = useVariantsEnabled(), navbarVariantTitle, t1, t2;
+	if ($[0] !== isVariantsEnabled || $[1] !== perspective || $[2] !== pinnedPerspective) {
+		let navbarVariantName = isVariantsEnabled ? getDefaultVariant(pinnedPerspective.selectedVariantNames) : void 0, navbarVariant = isVariantsEnabled ? getDefaultVariant(pinnedPerspective.selectedVariants) : void 0;
+		navbarVariantTitle = navbarVariant ? getVariantTitle(navbarVariant) : navbarVariantName, t1 = Boolean, t2 = getActiveVariant(perspective, navbarVariantName), $[0] = isVariantsEnabled, $[1] = perspective, $[2] = pinnedPerspective, $[3] = navbarVariantTitle, $[4] = t1, $[5] = t2;
+	} else navbarVariantTitle = $[3], t1 = $[4], t2 = $[5];
+	let isApiVersionLocked = t1(t2), { t } = useTranslation(visionLocaleNamespace), operationUrlElement = useRef(null), t3;
+	$[6] === Symbol.for("react.memo_cache_sentinel") ? (t3 = () => {
 		let el = operationUrlElement.current;
 		if (el) try {
 			el.select(), document.execCommand("copy");
 		} catch {
 			console.error("Unable to copy to clipboard :(");
 		}
-	}, $[3] = t2) : t2 = $[3];
-	let handleCopyUrl = t2, t3;
-	$[4] === Symbol.for("react.memo_cache_sentinel") ? (t3 = [
+	}, $[6] = t3) : t3 = $[6];
+	let handleCopyUrl = t3, t4;
+	$[7] === Symbol.for("react.memo_cache_sentinel") ? (t4 = [
 		"repeat(1, minmax(0, 1fr))",
 		"repeat(4, minmax(0, 1fr))",
 		"repeat(8, minmax(0, 1fr))",
 		"repeat(12, minmax(0, 1fr))"
-	], $[4] = t3) : t3 = $[4];
-	let t4;
-	$[5] === Symbol.for("react.memo_cache_sentinel") ? (t4 = ["span 1 / span 1", "span 2 / span 2"], $[5] = t4) : t4 = $[5];
+	], $[7] = t4) : t4 = $[7];
 	let t5;
-	$[6] === t ? t5 = $[7] : (t5 = t("settings.dataset-label"), $[6] = t, $[7] = t5);
+	$[8] === Symbol.for("react.memo_cache_sentinel") ? (t5 = ["span 1 / span 1", "span 2 / span 2"], $[8] = t5) : t5 = $[8];
 	let t6;
-	$[8] === t5 ? t6 = $[9] : (t6 = /* @__PURE__ */ jsx(Card, {
+	$[9] === t ? t6 = $[10] : (t6 = t("settings.dataset-label"), $[9] = t, $[10] = t6);
+	let t7;
+	$[11] === t6 ? t7 = $[12] : (t7 = /* @__PURE__ */ jsx(Card, {
 		paddingTop: 2,
 		paddingBottom: 3,
-		children: /* @__PURE__ */ jsx(StyledLabel, { children: t5 })
-	}), $[8] = t5, $[9] = t6);
-	let t7;
-	$[10] === datasets ? t7 = $[11] : (t7 = datasets.map(_temp2$2), $[10] = datasets, $[11] = t7);
+		children: /* @__PURE__ */ jsx(StyledLabel, { children: t6 })
+	}), $[11] = t6, $[12] = t7);
 	let t8;
-	$[12] !== dataset || $[13] !== onChangeDataset || $[14] !== t7 ? (t8 = /* @__PURE__ */ jsx(Select, {
+	$[13] === datasets ? t8 = $[14] : (t8 = datasets.map(_temp2$2), $[13] = datasets, $[14] = t8);
+	let t9;
+	$[15] !== dataset || $[16] !== onChangeDataset || $[17] !== t8 ? (t9 = /* @__PURE__ */ jsx(Select, {
 		value: dataset,
 		onChange: onChangeDataset,
-		children: t7
-	}), $[12] = dataset, $[13] = onChangeDataset, $[14] = t7, $[15] = t8) : t8 = $[15];
-	let t9;
-	$[16] !== t6 || $[17] !== t8 ? (t9 = /* @__PURE__ */ jsx(Box, {
-		padding: 1,
-		gridColumn: t4,
-		children: /* @__PURE__ */ jsxs(VStack, { children: [t6, t8] })
-	}), $[16] = t6, $[17] = t8, $[18] = t9) : t9 = $[18];
+		children: t8
+	}), $[15] = dataset, $[16] = onChangeDataset, $[17] = t8, $[18] = t9) : t9 = $[18];
 	let t10;
-	$[19] === Symbol.for("react.memo_cache_sentinel") ? (t10 = ["span 1 / span 1", "span 2 / span 2"], $[19] = t10) : t10 = $[19];
+	$[19] !== t7 || $[20] !== t9 ? (t10 = /* @__PURE__ */ jsx(Box, {
+		padding: 1,
+		gridColumn: t5,
+		children: /* @__PURE__ */ jsxs(VStack, { children: [t7, t9] })
+	}), $[19] = t7, $[20] = t9, $[21] = t10) : t10 = $[21];
 	let t11;
-	$[20] === t ? t11 = $[21] : (t11 = t("settings.api-version-label"), $[20] = t, $[21] = t11);
+	$[22] === Symbol.for("react.memo_cache_sentinel") ? (t11 = ["span 1 / span 1", "span 2 / span 2"], $[22] = t11) : t11 = $[22];
 	let t12;
-	$[22] === t11 ? t12 = $[23] : (t12 = /* @__PURE__ */ jsx(Card, {
+	$[23] === t ? t12 = $[24] : (t12 = t("settings.api-version-label"), $[23] = t, $[24] = t12);
+	let t13;
+	$[25] === t12 ? t13 = $[26] : (t13 = /* @__PURE__ */ jsx(Card, {
 		paddingTop: 2,
 		paddingBottom: 3,
-		children: /* @__PURE__ */ jsx(StyledLabel, { children: t11 })
-	}), $[22] = t11, $[23] = t12);
-	let t13;
-	$[24] === t ? t13 = $[25] : (t13 = t("settings.api-version-locked-for-variant"), $[24] = t, $[25] = t13);
+		children: /* @__PURE__ */ jsx(StyledLabel, { children: t12 })
+	}), $[25] = t12, $[26] = t13);
 	let t14;
-	$[26] === t13 ? t14 = $[27] : (t14 = /* @__PURE__ */ jsx(Text, {
+	$[27] === t ? t14 = $[28] : (t14 = t("settings.api-version-locked-for-variant"), $[27] = t, $[28] = t14);
+	let t15;
+	$[29] === t14 ? t15 = $[30] : (t15 = /* @__PURE__ */ jsx(Text, {
 		size: 1,
-		children: t13
-	}), $[26] = t13, $[27] = t14);
-	let t15 = !isApiVersionLocked, t16 = customApiVersion === !1 ? apiVersion : "other", t17;
-	$[28] === Symbol.for("react.memo_cache_sentinel") ? (t17 = API_VERSIONS.map(_temp3$1), $[28] = t17) : t17 = $[28];
-	let t18;
-	$[29] === t ? t18 = $[30] : (t18 = t("settings.other-api-version-label"), $[29] = t, $[30] = t18);
+		children: t14
+	}), $[29] = t14, $[30] = t15);
+	let t16 = !isApiVersionLocked, t17 = customApiVersion === !1 ? apiVersion : "other", t18;
+	$[31] === Symbol.for("react.memo_cache_sentinel") ? (t18 = API_VERSIONS.map(_temp3$1), $[31] = t18) : t18 = $[31];
 	let t19;
-	$[31] === t18 ? t19 = $[32] : (t19 = /* @__PURE__ */ jsx("option", {
-		value: "other",
-		children: t18
-	}, "other"), $[31] = t18, $[32] = t19);
+	$[32] === t ? t19 = $[33] : (t19 = t("settings.other-api-version-label"), $[32] = t, $[33] = t19);
 	let t20;
-	$[33] !== isApiVersionLocked || $[34] !== onChangeApiVersion || $[35] !== t16 || $[36] !== t19 ? (t20 = /* @__PURE__ */ jsx(Box, {
+	$[34] === t19 ? t20 = $[35] : (t20 = /* @__PURE__ */ jsx("option", {
+		value: "other",
+		children: t19
+	}, "other"), $[34] = t19, $[35] = t20);
+	let t21;
+	$[36] !== isApiVersionLocked || $[37] !== onChangeApiVersion || $[38] !== t17 || $[39] !== t20 ? (t21 = /* @__PURE__ */ jsx(Box, {
 		"data-testid": "api-version-selector-wrap",
 		children: /* @__PURE__ */ jsxs(Select, {
 			"data-testid": "api-version-selector",
-			value: t16,
+			value: t17,
 			onChange: onChangeApiVersion,
 			disabled: isApiVersionLocked,
-			children: [t17, t19]
+			children: [t18, t20]
 		})
-	}), $[33] = isApiVersionLocked, $[34] = onChangeApiVersion, $[35] = t16, $[36] = t19, $[37] = t20) : t20 = $[37];
-	let t21;
-	$[38] !== t14 || $[39] !== t15 || $[40] !== t20 ? (t21 = /* @__PURE__ */ jsx(Tooltip, {
+	}), $[36] = isApiVersionLocked, $[37] = onChangeApiVersion, $[38] = t17, $[39] = t20, $[40] = t21) : t21 = $[40];
+	let t22;
+	$[41] !== t15 || $[42] !== t16 || $[43] !== t21 ? (t22 = /* @__PURE__ */ jsx(Tooltip, {
 		animate: !0,
-		content: t14,
-		disabled: t15,
+		content: t15,
+		disabled: t16,
 		placement: "bottom",
 		portal: !0,
-		children: t20
-	}), $[38] = t14, $[39] = t15, $[40] = t20, $[41] = t21) : t21 = $[41];
-	let t22;
-	$[42] !== t12 || $[43] !== t21 ? (t22 = /* @__PURE__ */ jsx(Box, {
-		padding: 1,
-		gridColumn: t10,
-		children: /* @__PURE__ */ jsxs(VStack, { children: [t12, t21] })
-	}), $[42] = t12, $[43] = t21, $[44] = t22) : t22 = $[44];
+		children: t21
+	}), $[41] = t15, $[42] = t16, $[43] = t21, $[44] = t22) : t22 = $[44];
 	let t23;
-	$[45] !== customApiVersion || $[46] !== customApiVersionElementRef || $[47] !== isApiVersionLocked || $[48] !== isValidApiVersion || $[49] !== onCustomApiVersionChange || $[50] !== t ? (t23 = !isApiVersionLocked && customApiVersion !== !1 && /* @__PURE__ */ jsx(Box, {
+	$[45] !== t13 || $[46] !== t22 ? (t23 = /* @__PURE__ */ jsx(Box, {
+		padding: 1,
+		gridColumn: t11,
+		children: /* @__PURE__ */ jsxs(VStack, { children: [t13, t22] })
+	}), $[45] = t13, $[46] = t22, $[47] = t23) : t23 = $[47];
+	let t24;
+	$[48] !== customApiVersion || $[49] !== customApiVersionElementRef || $[50] !== isApiVersionLocked || $[51] !== isValidApiVersion || $[52] !== onCustomApiVersionChange || $[53] !== t ? (t24 = !isApiVersionLocked && customApiVersion !== !1 && /* @__PURE__ */ jsx(Box, {
 		padding: 1,
 		gridColumn: ["span 1 / span 1", "span 2 / span 2"],
 		children: /* @__PURE__ */ jsxs(VStack, { children: [/* @__PURE__ */ jsx(Card, {
@@ -2131,28 +2134,29 @@ function VisionGuiHeader(t0) {
 			customValidity: isValidApiVersion ? void 0 : t("settings.error.invalid-api-version"),
 			maxLength: 11
 		})] })
-	}), $[45] = customApiVersion, $[46] = customApiVersionElementRef, $[47] = isApiVersionLocked, $[48] = isValidApiVersion, $[49] = onCustomApiVersionChange, $[50] = t, $[51] = t23) : t23 = $[51];
-	let t24;
-	$[52] === Symbol.for("react.memo_cache_sentinel") ? (t24 = ["span 1 / span 1", "span 2 / span 2"], $[52] = t24) : t24 = $[52];
+	}), $[48] = customApiVersion, $[49] = customApiVersionElementRef, $[50] = isApiVersionLocked, $[51] = isValidApiVersion, $[52] = onCustomApiVersionChange, $[53] = t, $[54] = t24) : t24 = $[54];
 	let t25;
-	$[53] === t ? t25 = $[54] : (t25 = t("settings.perspective-label"), $[53] = t, $[54] = t25);
+	$[55] === Symbol.for("react.memo_cache_sentinel") ? (t25 = ["span 1 / span 1", "span 2 / span 2"], $[55] = t25) : t25 = $[55];
 	let t26;
-	$[55] === t25 ? t26 = $[56] : (t26 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(StyledLabel, { children: t25 }) }), $[55] = t25, $[56] = t26);
+	$[56] === t ? t26 = $[57] : (t26 = t("settings.perspective-label"), $[56] = t, $[57] = t26);
 	let t27;
-	$[57] === Symbol.for("react.memo_cache_sentinel") ? (t27 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(PerspectivePopover, {}) }), $[57] = t27) : t27 = $[57];
+	$[58] === t26 ? t27 = $[59] : (t27 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(StyledLabel, { children: t26 }) }), $[58] = t26, $[59] = t27);
 	let t28;
-	$[58] === t26 ? t28 = $[59] : (t28 = /* @__PURE__ */ jsx(Card, {
+	$[60] === Symbol.for("react.memo_cache_sentinel") ? (t28 = /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(PerspectivePopover, {}) }), $[60] = t28) : t28 = $[60];
+	let t29;
+	$[61] === t27 ? t29 = $[62] : (t29 = /* @__PURE__ */ jsx(Card, {
 		paddingBottom: 1,
 		children: /* @__PURE__ */ jsxs(Inline, {
 			gap: 1,
-			children: [t26, t27]
+			children: [t27, t28]
 		})
-	}), $[58] = t26, $[59] = t28);
-	let t29 = perspective || "default", t30;
-	$[60] !== isScheduledDraftsEnabled || $[61] !== pinnedPerspective || $[62] !== t ? (t30 = SUPPORTED_PERSPECTIVES.map((perspectiveName) => perspectiveName === "pinnedRelease" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+	}), $[61] = t27, $[62] = t29);
+	let t30 = perspective || "default", t31;
+	$[63] !== isScheduledDraftsEnabled || $[64] !== navbarVariantTitle || $[65] !== pinnedPerspective || $[66] !== t ? (t31 = SUPPORTED_PERSPECTIVES.map((perspectiveName) => perspectiveName === "pinnedRelease" ? /* @__PURE__ */ jsxs(Fragment, { children: [
 		/* @__PURE__ */ jsx(PinnedReleasePerspectiveOption, {
 			pinnedPerspective,
-			t
+			t,
+			variantTitle: navbarVariantTitle
 		}),
 		/* @__PURE__ */ jsx("option", {
 			value: "default",
@@ -2162,22 +2166,22 @@ function VisionGuiHeader(t0) {
 	] }, "pinnedRelease") : perspectiveName === "scheduledDrafts" ? isScheduledDraftsEnabled ? /* @__PURE__ */ jsx("option", {
 		value: "scheduledDrafts",
 		children: t("settings.perspectives.scheduled-drafts")
-	}, "scheduledDrafts") : null : /* @__PURE__ */ jsx("option", { children: perspectiveName }, perspectiveName)), $[60] = isScheduledDraftsEnabled, $[61] = pinnedPerspective, $[62] = t, $[63] = t30) : t30 = $[63];
-	let t31;
-	$[64] !== onChangePerspective || $[65] !== t29 || $[66] !== t30 ? (t31 = /* @__PURE__ */ jsx(Select, {
+	}, "scheduledDrafts") : null : /* @__PURE__ */ jsx("option", { children: perspectiveName }, perspectiveName)), $[63] = isScheduledDraftsEnabled, $[64] = navbarVariantTitle, $[65] = pinnedPerspective, $[66] = t, $[67] = t31) : t31 = $[67];
+	let t32;
+	$[68] !== onChangePerspective || $[69] !== t30 || $[70] !== t31 ? (t32 = /* @__PURE__ */ jsx(Select, {
 		"data-testid": "perspective-selector",
-		value: t29,
+		value: t30,
 		onChange: onChangePerspective,
-		children: t30
-	}), $[64] = onChangePerspective, $[65] = t29, $[66] = t30, $[67] = t31) : t31 = $[67];
-	let t32;
-	$[68] !== t28 || $[69] !== t31 ? (t32 = /* @__PURE__ */ jsx(Box, {
-		padding: 1,
-		gridColumn: t24,
-		children: /* @__PURE__ */ jsxs(VStack, { children: [t28, t31] })
-	}), $[68] = t28, $[69] = t31, $[70] = t32) : t32 = $[70];
+		children: t31
+	}), $[68] = onChangePerspective, $[69] = t30, $[70] = t31, $[71] = t32) : t32 = $[71];
 	let t33;
-	$[71] !== customApiVersion || $[72] !== t || $[73] !== url ? (t33 = typeof url == "string" ? /* @__PURE__ */ jsx(Box, {
+	$[72] !== t29 || $[73] !== t32 ? (t33 = /* @__PURE__ */ jsx(Box, {
+		padding: 1,
+		gridColumn: t25,
+		children: /* @__PURE__ */ jsxs(VStack, { children: [t29, t32] })
+	}), $[72] = t29, $[73] = t32, $[74] = t33) : t33 = $[74];
+	let t34;
+	$[75] !== customApiVersion || $[76] !== t || $[77] !== url ? (t34 = typeof url == "string" ? /* @__PURE__ */ jsx(Box, {
 		padding: 1,
 		flexBasis: "0%",
 		flexGrow: 1,
@@ -2229,22 +2233,22 @@ function VisionGuiHeader(t0) {
 	}) : /* @__PURE__ */ jsx(Box, {
 		flexBasis: "0%",
 		flexGrow: 1
-	}), $[71] = customApiVersion, $[72] = t, $[73] = url, $[74] = t33) : t33 = $[74];
-	let t34;
-	return $[75] !== t22 || $[76] !== t23 || $[77] !== t32 || $[78] !== t33 || $[79] !== t9 ? (t34 = /* @__PURE__ */ jsx(Header, {
+	}), $[75] = customApiVersion, $[76] = t, $[77] = url, $[78] = t34) : t34 = $[78];
+	let t35;
+	return $[79] !== t10 || $[80] !== t23 || $[81] !== t24 || $[82] !== t33 || $[83] !== t34 ? (t35 = /* @__PURE__ */ jsx(Header, {
 		paddingX: 3,
 		paddingY: 2,
 		children: /* @__PURE__ */ jsxs(Grid, {
-			gridTemplateColumns: t3,
+			gridTemplateColumns: t4,
 			children: [
-				t9,
-				t22,
+				t10,
 				t23,
-				t32,
-				t33
+				t24,
+				t33,
+				t34
 			]
 		})
-	}), $[75] = t22, $[76] = t23, $[77] = t32, $[78] = t33, $[79] = t9, $[80] = t34) : t34 = $[80], t34;
+	}), $[79] = t10, $[80] = t23, $[81] = t24, $[82] = t33, $[83] = t34, $[84] = t35) : t35 = $[84], t35;
 }
 function _temp3$1(version) {
 	return /* @__PURE__ */ jsx("option", { children: version }, version);
@@ -2336,12 +2340,11 @@ function hasReleaseInPerspective(perspective) {
 function getUnsatisfiedApiVersionCapability(context, capabilities = API_VERSION_CAPABILITIES) {
 	if (context.statusCode === 400) return capabilities.find((capability) => capability.applies(context) && isApiVersionBelow(context.apiVersion, capability.requiredApiVersion));
 }
-var errorCode = "pae7z70";
 function ErrorCode(props) {
 	let $ = c(2), t0;
 	return $[0] === props ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx(Code, {
 		...props,
-		className: errorCode
+		className: "_7y6tDG_errorCode"
 	}), $[0] = props, $[1] = t0), t0;
 }
 function QueryErrorDetails(t0) {
@@ -2452,38 +2455,37 @@ function getAtKeypath(data, keypath) {
 	}
 	return { value: current };
 }
-var codeFamilyVar = "var(--l3n7s00)", codeFontSizeVar = "var(--l3n7s01)", codeLineHeightVar = "var(--l3n7s02)", copyNodeButton = "l3n7s0e", copyableResult = "l3n7s0d", resultViewWrapper = "l3n7s0c", space0Var = "var(--l3n7s03)", space2Var = "var(--l3n7s04)", space4HalfVar = "var(--l3n7s06)", space4Var = "var(--l3n7s05)", syntaxBooleanVar = "var(--l3n7s0a)", syntaxConstantVar = "var(--l3n7s08)", syntaxNumberVar = "var(--l3n7s0b)", syntaxPropertyVar = "var(--l3n7s07)", syntaxStringVar = "var(--l3n7s09)";
-const lru = new LRU({ maxSize: 5e4 });
+const _key2 = "VsSQ8q_resultViewWrapper", lru = new LRU({ maxSize: 5e4 });
 function ResultViewWrapper(t0) {
-	let $ = c(25), { children, copyable } = t0, { color, font, space } = useTheme_v2(), codeSize = font.code.sizes[2], t1 = copyable ? `${resultViewWrapper} ${copyableResult}` : resultViewWrapper, t2 = font.code.family, t3 = `${codeSize.fontSize}px`, t4 = `${codeSize.lineHeight}px`, t5;
-	$[0] === space[0] ? t5 = $[1] : (t5 = rem(space[0]), $[0] = space[0], $[1] = t5);
-	let t6 = `${t5}`, t7;
-	$[2] === space[2] ? t7 = $[3] : (t7 = rem(space[2]), $[2] = space[2], $[3] = t7);
-	let t8 = `${t7}`, t9;
-	$[4] === space[4] ? t9 = $[5] : (t9 = rem(space[4]), $[4] = space[4], $[5] = t9);
-	let t10 = `${t9}`, t11 = space[4] / 2, t12;
-	$[6] === t11 ? t12 = $[7] : (t12 = rem(t11), $[6] = t11, $[7] = t12);
-	let t13 = `${t12}`, t14;
-	$[8] !== color.syntax.boolean || $[9] !== color.syntax.constant || $[10] !== color.syntax.number || $[11] !== color.syntax.property || $[12] !== color.syntax.string || $[13] !== font.code.family || $[14] !== t10 || $[15] !== t13 || $[16] !== t3 || $[17] !== t4 || $[18] !== t6 || $[19] !== t8 ? (t14 = assignInlineVars({
-		[codeFamilyVar]: t2,
-		[codeFontSizeVar]: t3,
-		[codeLineHeightVar]: t4,
-		[space0Var]: t6,
-		[space2Var]: t8,
-		[space4Var]: t10,
-		[space4HalfVar]: t13,
-		[syntaxPropertyVar]: color.syntax.property,
-		[syntaxConstantVar]: color.syntax.constant,
-		[syntaxStringVar]: color.syntax.string,
-		[syntaxBooleanVar]: color.syntax.boolean,
-		[syntaxNumberVar]: color.syntax.number
-	}), $[8] = color.syntax.boolean, $[9] = color.syntax.constant, $[10] = color.syntax.number, $[11] = color.syntax.property, $[12] = color.syntax.string, $[13] = font.code.family, $[14] = t10, $[15] = t13, $[16] = t3, $[17] = t4, $[18] = t6, $[19] = t8, $[20] = t14) : t14 = $[20];
-	let t15;
-	return $[21] !== children || $[22] !== t1 || $[23] !== t14 ? (t15 = /* @__PURE__ */ jsx("div", {
-		className: t1,
-		style: t14,
+	let $ = c(25), { children, copyable } = t0, { color, font, space } = useTheme_v2(), codeSize = font.code.sizes[2], t1 = font.code.family, t2 = `${codeSize.fontSize}px`, t3 = `${codeSize.lineHeight}px`, t4;
+	$[0] === space[0] ? t4 = $[1] : (t4 = rem(space[0]), $[0] = space[0], $[1] = t4);
+	let t5 = `${t4}`, t6;
+	$[2] === space[2] ? t6 = $[3] : (t6 = rem(space[2]), $[2] = space[2], $[3] = t6);
+	let t7 = `${t6}`, t8;
+	$[4] === space[4] ? t8 = $[5] : (t8 = rem(space[4]), $[4] = space[4], $[5] = t8);
+	let t9 = `${t8}`, t10 = space[4] / 2, t11;
+	$[6] === t10 ? t11 = $[7] : (t11 = rem(t10), $[6] = t10, $[7] = t11);
+	let t12 = `${t11}`, t13;
+	$[8] !== color.syntax.boolean || $[9] !== color.syntax.constant || $[10] !== color.syntax.number || $[11] !== color.syntax.property || $[12] !== color.syntax.string || $[13] !== font.code.family || $[14] !== t12 || $[15] !== t2 || $[16] !== t3 || $[17] !== t5 || $[18] !== t7 || $[19] !== t9 ? (t13 = {
+		"--vision-result-code-family": t1,
+		"--vision-result-code-font-size": t2,
+		"--vision-result-code-line-height": t3,
+		"--vision-result-space-0": t5,
+		"--vision-result-space-2": t7,
+		"--vision-result-space-4": t9,
+		"--vision-result-space-4-half": t12,
+		"--vision-result-syntax-property": color.syntax.property,
+		"--vision-result-syntax-constant": color.syntax.constant,
+		"--vision-result-syntax-string": color.syntax.string,
+		"--vision-result-syntax-boolean": color.syntax.boolean,
+		"--vision-result-syntax-number": color.syntax.number
+	}, $[8] = color.syntax.boolean, $[9] = color.syntax.constant, $[10] = color.syntax.number, $[11] = color.syntax.property, $[12] = color.syntax.string, $[13] = font.code.family, $[14] = t12, $[15] = t2, $[16] = t3, $[17] = t5, $[18] = t7, $[19] = t9, $[20] = t13) : t13 = $[20];
+	let style = t13, t14 = copyable ? `${_key2} VsSQ8q_copyableResult` : _key2, t15;
+	return $[21] !== children || $[22] !== style || $[23] !== t14 ? (t15 = /* @__PURE__ */ jsx("div", {
+		className: t14,
+		style,
 		children
-	}), $[21] = children, $[22] = t1, $[23] = t14, $[24] = t15) : t15 = $[24], t15;
+	}), $[21] = children, $[22] = style, $[23] = t14, $[24] = t15) : t15 = $[24], t15;
 }
 const ResultLabelContext = createContext(null);
 function ResultView(props) {
@@ -2547,7 +2549,7 @@ function CopyNodeButton(props) {
 	let t2;
 	return $[5] !== copy.label || $[6] !== t0 ? (t2 = /* @__PURE__ */ jsx("button", {
 		"aria-label": copy.label,
-		className: copyNodeButton,
+		className: "VsSQ8q_copyNodeButton",
 		"data-testid": "result-copy-node",
 		onClick: t0,
 		title: copy.label,
@@ -2798,7 +2800,7 @@ function nodeContains(node, other) {
 }
 const isRunHotkey = (event) => isHotkey("ctrl+enter", event) || isHotkey("mod+enter", event);
 function VisionGui(props) {
-	let $ = c(234), { datasets, config, projectId, defaultDataset, onSwitchToRedesign } = props, toast = useToast(), { t } = useTranslation(visionLocaleNamespace), { perspectiveStack, selectedVariantNames } = usePerspective(), selectedVariantName = getDefaultVariant(selectedVariantNames), isScheduledDraftsEnabled = useScheduledDraftsEnabled(), { data: t0 } = useActiveReleases(), t1;
+	let $ = c(234), { datasets, config, projectId, defaultDataset, onSwitchToRedesign } = props, toast = useToast(), { t } = useTranslation(visionLocaleNamespace), { perspectiveStack, selectedVariantNames } = usePerspective(), selectedVariantName = useVariantsEnabled() ? getDefaultVariant(selectedVariantNames) : void 0, isScheduledDraftsEnabled = useScheduledDraftsEnabled(), { data: t0 } = useActiveReleases(), t1;
 	$[0] === t0 ? t1 = $[1] : (t1 = t0 === void 0 ? [] : t0, $[0] = t0, $[1] = t1);
 	let releases = t1, isDraftModelEnabled = useWorkspace().document.drafts.enabled, editorQueryRef = useRef(null), editorParamsRef = useRef(null), visionRootRef = useRef(null), customApiVersionElementRef = useRef(null), querySubscriptionRef = useRef(void 0), listenSubscriptionRef = useRef(void 0), t2;
 	$[2] === projectId ? t2 = $[3] : (t2 = () => getLocalStorage(projectId || "default"), $[2] = projectId, $[3] = t2);
@@ -3531,7 +3533,7 @@ function _temp() {
 	return DEFAULT_PREFERENCE;
 }
 var SanityVision_exports = /* @__PURE__ */ __exportAll({ default: () => SanityVision });
-const vistaGui = createRetryableLazy(() => import("./VistaGui-DmXZyJ6k.js").then((module) => ({ default: module.VistaGui }))), VistaGuiLoader = vistaGui.Component;
+const vistaGui = createRetryableLazy(() => import("./VistaGui-D3NHSIsK.js").then((module) => ({ default: module.VistaGui }))), VistaGuiLoader = vistaGui.Component;
 function SanityVision(props) {
 	let $ = c(31), t0;
 	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = { apiVersion: "1" }, $[0] = t0) : t0 = $[0];
@@ -3582,6 +3584,6 @@ function SanityVision(props) {
 		children: [t7, t8]
 	}), $[28] = t7, $[29] = t8, $[30] = t9) : t9 = $[30], t9;
 }
-export { VARIANTS_API_VERSION as A, getActivePerspective as C, resultJsonExtensions as D, paramsExtensions as E, API_VERSIONS as O, encodeQueryString as S, groqExtensions as T, VISION_STORAGE_KEY_PREFIX as _, getAtKeypath as a, isPlainObject as b, DelayedSpinner as c, getJsonBlobUrl as d, SanityVision as default, useSavedQueries as f, validateApiVersion as g, parseQueryUrl as h, describeKeypath as i, prefixApiVersion as j, DEFAULT_API_VERSION as k, canEncodeCsv as l, isApiCdnHost as m, createRetryableLazy as n, QueryErrorDialog as o, parseParams as p, ResultView as r, isApiVersionBelow as s, SanityVision_exports as t, getCsvBlobUrl as u, getStorage as v, VisionCodeMirror as w, isVisionPasteTarget as x, onLocalStorageCleared as y };
+export { DEFAULT_API_VERSION as A, getActivePerspective as C, paramsExtensions as D, groqExtensions as E, prefixApiVersion as M, resultJsonExtensions as O, encodeQueryString as S, VisionCodeMirror as T, VISION_STORAGE_KEY_PREFIX as _, getAtKeypath as a, isPlainObject as b, DelayedSpinner as c, getJsonBlobUrl as d, SanityVision as default, useSavedQueries as f, validateApiVersion as g, parseQueryUrl as h, describeKeypath as i, VARIANTS_API_VERSION as j, API_VERSIONS as k, canEncodeCsv as l, isApiCdnHost as m, createRetryableLazy as n, QueryErrorDialog as o, parseParams as p, ResultView as r, isApiVersionBelow as s, SanityVision_exports as t, getCsvBlobUrl as u, getStorage as v, useVariantsEnabled as w, isVisionPasteTarget as x, onLocalStorageCleared as y };
 
-//# sourceMappingURL=SanityVision-ePOzvdmp.js.map
+//# sourceMappingURL=SanityVision-tHhBPbsg.js.map