@sanity/ui 3.4.1 → 3.4.3

package/dist/_chunks/tabList.mjs

@@ -273,7 +273,6 @@ function ThemeProvider$1(props) {
 		children: t2
 	}), $[12] = t2, $[13] = themeContext, $[14] = t3) : t3 = $[14], t3;
 }
-ThemeProvider$1.displayName = "ThemeProvider";
 /**
 * @public
 */
@@ -294,7 +293,6 @@ function ThemeColorProvider(props) {
 		children
 	}), $[0] = children, $[1] = root.theme, $[2] = t0, $[3] = tone, $[4] = t1) : t1 = $[4], t1;
 }
-ThemeColorProvider.displayName = "ThemeColorProvider";
 /**
 * @public
 */
@@ -636,8 +634,8 @@ const SpanWithTextOverflow = styled.span.withConfig({
 	componentId: "sc-xkyu3h-0"
 })`display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;overflow:clip;`, StyledBox = /* @__PURE__ */ styled.div.withConfig({
 	displayName: "StyledBox",
-	componentId: "sc-7yq461-0"
-})(boxStyle, flexItemStyle, responsiveBoxStyle, responsiveGridItemStyle, responsiveMarginStyle, responsivePaddingStyle), BoxComponent = forwardRef(function(props, ref) {
+	componentId: "sc-yj6ffl-0"
+})(boxStyle, flexItemStyle, responsiveBoxStyle, responsiveGridItemStyle, responsiveMarginStyle, responsivePaddingStyle), Box = forwardRef(function Box(props, ref) {
 	let $ = c(115), deprecated_column, deprecated_columnEnd, deprecated_columnStart, deprecated_row, deprecated_rowEnd, deprecated_rowStart, flex, gridColumn, gridColumnEnd, gridColumnStart, gridRow, gridRowEnd, gridRowStart, height, marginBottom, marginLeft, marginRight, marginTop, marginX, marginY, overflow, paddingBottom, paddingLeft, paddingRight, paddingTop, paddingX, paddingY, restProps, sizing, t0, t1, t2, t3;
 	$[0] === props ? (deprecated_column = $[1], deprecated_columnEnd = $[2], deprecated_columnStart = $[3], deprecated_row = $[4], deprecated_rowEnd = $[5], deprecated_rowStart = $[6], flex = $[7], gridColumn = $[8], gridColumnEnd = $[9], gridColumnStart = $[10], gridRow = $[11], gridRowEnd = $[12], gridRowStart = $[13], height = $[14], marginBottom = $[15], marginLeft = $[16], marginRight = $[17], marginTop = $[18], marginX = $[19], marginY = $[20], overflow = $[21], paddingBottom = $[22], paddingLeft = $[23], paddingRight = $[24], paddingTop = $[25], paddingX = $[26], paddingY = $[27], restProps = $[28], sizing = $[29], t0 = $[30], t1 = $[31], t2 = $[32], t3 = $[33]) : ({as: t0, gridColumn, column: deprecated_column, gridColumnStart, columnStart: deprecated_columnStart, gridColumnEnd, columnEnd: deprecated_columnEnd, display: t1, flex, height, margin: t2, marginX, marginY, marginTop, marginRight, marginBottom, marginLeft, overflow, padding: t3, paddingX, paddingY, paddingTop, paddingRight, paddingBottom, paddingLeft, gridRow, row: deprecated_row, gridRowStart, rowStart: deprecated_rowStart, gridRowEnd, rowEnd: deprecated_rowEnd, sizing, ...restProps} = props, $[0] = props, $[1] = deprecated_column, $[2] = deprecated_columnEnd, $[3] = deprecated_columnStart, $[4] = deprecated_row, $[5] = deprecated_rowEnd, $[6] = deprecated_rowStart, $[7] = flex, $[8] = gridColumn, $[9] = gridColumnEnd, $[10] = gridColumnStart, $[11] = gridRow, $[12] = gridRowEnd, $[13] = gridRowStart, $[14] = height, $[15] = marginBottom, $[16] = marginLeft, $[17] = marginRight, $[18] = marginTop, $[19] = marginX, $[20] = marginY, $[21] = overflow, $[22] = paddingBottom, $[23] = paddingLeft, $[24] = paddingRight, $[25] = paddingTop, $[26] = paddingX, $[27] = paddingY, $[28] = restProps, $[29] = sizing, $[30] = t0, $[31] = t1, $[32] = t2, $[33] = t3);
 	let asProp = t0 === void 0 ? "div" : t0, display = t1 === void 0 ? "block" : t1, margin = t2 === void 0 ? 0 : t2, padding = t3 === void 0 ? 0 : t3, column = gridColumn === void 0 ? deprecated_column : gridColumn, columnStart = gridColumnStart === void 0 ? deprecated_columnStart : gridColumnStart, columnEnd = gridColumnEnd === void 0 ? deprecated_columnEnd : gridColumnEnd, row = gridRow === void 0 ? deprecated_row : gridRow, rowStart = gridRowStart === void 0 ? deprecated_rowStart : gridRowStart, rowEnd = gridRowEnd === void 0 ? deprecated_rowEnd : gridRowEnd, t4 = typeof asProp == "string" ? asProp : void 0, t5;
@@ -725,22 +723,14 @@ const SpanWithTextOverflow = styled.span.withConfig({
 		children: props.children
 	}), $[84] = asProp, $[85] = props.children, $[86] = ref, $[87] = restProps, $[88] = t10, $[89] = t11, $[90] = t12, $[91] = t13, $[92] = t14, $[93] = t15, $[94] = t16, $[95] = t17, $[96] = t18, $[97] = t19, $[98] = t20, $[99] = t21, $[100] = t22, $[101] = t23, $[102] = t24, $[103] = t25, $[104] = t26, $[105] = t27, $[106] = t28, $[107] = t29, $[108] = t4, $[109] = t5, $[110] = t6, $[111] = t7, $[112] = t8, $[113] = t9, $[114] = t30) : t30 = $[114], t30;
 });
-BoxComponent.displayName = "ForwardRef(Box)";
-/**
-* The `Box` component is a basic layout wrapper component which provides utility properties
-* for flex, margins and padding.
-*
-* @public
-*/
-const Box = BoxComponent;
 function textBaseStyle(props) {
 	let { $accent, $muted } = props, { font } = getTheme_v2(props.theme);
 	return css`color:var(--card-fg-color);${$accent && css`color:var(--card-accent-fg-color);`} ${$muted && css`color:var(--card-muted-fg-color);`} & code{font-family:${font.code.family};border-radius:1px;background-color:var(--card-code-bg-color);color:var(--card-code-fg-color);}& a{text-decoration:none;border-radius:1px;color:var(--card-link-color);outline:none;@media (hover:hover){&:hover{text-decoration:underline;}}&:focus{box-shadow:0 0 0 1px var(--card-bg-color),0 0 0 3px var(--card-focus-ring-color);}&:focus:not(:focus-visible){box-shadow:none;}}& strong{font-weight:${font.text.weights.bold};}& svg{display:inline;}& [data-sanity-icon]{vertical-align:baseline;color:var(--card-icon-color);& path{vector-effect:non-scaling-stroke !important;}}`;
 }
 const StyledText = /* @__PURE__ */ styled.div.withConfig({
 	displayName: "StyledText",
-	componentId: "sc-aca14k-0"
-})(responsiveTextFont, responsiveTextAlignStyle, textBaseStyle), TextComponent = forwardRef(function(props, ref) {
+	componentId: "sc-d4ufel-0"
+})(responsiveTextFont, responsiveTextAlignStyle, textBaseStyle), Text = forwardRef(function Text(props, ref) {
 	let $ = c(26), align, childrenProp, restProps, t0, t1, t2, textOverflow, weight;
 	$[0] === props ? (align = $[1], childrenProp = $[2], restProps = $[3], t0 = $[4], t1 = $[5], t2 = $[6], textOverflow = $[7], weight = $[8]) : ({accent: t0, align, children: childrenProp, muted: t1, size: t2, textOverflow, weight, ...restProps} = props, $[0] = props, $[1] = align, $[2] = childrenProp, $[3] = restProps, $[4] = t0, $[5] = t1, $[6] = t2, $[7] = textOverflow, $[8] = weight);
 	let accent = t0 !== void 0 && t0, muted = t1 !== void 0 && t1, size = t2 === void 0 ? 2 : t2, children = childrenProp;
@@ -766,17 +756,10 @@ const StyledText = /* @__PURE__ */ styled.div.withConfig({
 		$weight: weight,
 		children: t5
 	}), $[17] = accent, $[18] = muted, $[19] = ref, $[20] = restProps, $[21] = t3, $[22] = t4, $[23] = t5, $[24] = weight, $[25] = t6) : t6 = $[25], t6;
-});
-TextComponent.displayName = "ForwardRef(Text)";
-/**
-* The `Text` component is an agile, themed typographic element.
-*
-* @public
-*/
-const Text = TextComponent, StyledFlex = /* @__PURE__ */ styled(Box).withConfig({
+}), StyledFlex = /* @__PURE__ */ styled(Box).withConfig({
 	displayName: "StyledFlex",
-	componentId: "sc-r9nqck-0"
-})(flexItemStyle, responsiveFlexStyle), FlexComponent = forwardRef(function(props, ref) {
+	componentId: "sc-ux9uze-0"
+})(flexItemStyle, responsiveFlexStyle), Flex = forwardRef(function Flex(props, ref) {
 	let $ = c(27), align, as, gap, justify, restProps, t0, wrap;
 	$[0] === props ? (align = $[1], as = $[2], gap = $[3], justify = $[4], restProps = $[5], t0 = $[6], wrap = $[7]) : ({align, as, direction: t0, gap, justify, wrap, ...restProps} = props, $[0] = props, $[1] = align, $[2] = as, $[3] = gap, $[4] = justify, $[5] = restProps, $[6] = t0, $[7] = wrap);
 	let direction = t0 === void 0 ? "row" : t0, t1;
@@ -801,17 +784,10 @@ const Text = TextComponent, StyledFlex = /* @__PURE__ */ styled(Box).withConfig(
 		forwardedAs: as,
 		ref
 	}), $[18] = as, $[19] = ref, $[20] = restProps, $[21] = t1, $[22] = t2, $[23] = t3, $[24] = t4, $[25] = t5, $[26] = t6) : t6 = $[26], t6;
-});
-FlexComponent.displayName = "ForwardRef(Flex)";
-/**
-* The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).
-*
-* @public
-*/
-const Flex = FlexComponent, rotate = keyframes`from{transform:rotate(0deg);}to{transform:rotate(360deg);}`, StyledSpinner = styled(Text).withConfig({
+}), rotate = keyframes`from{transform:rotate(0deg);}to{transform:rotate(360deg);}`, StyledSpinner = styled(Text).withConfig({
 	displayName: "StyledSpinner",
-	componentId: "sc-6ky9bg-0"
-})`& > span > svg{animation:${rotate} 500ms linear infinite;}`, Spinner = forwardRef(function(props, ref) {
+	componentId: "sc-10l2iw-0"
+})`& > span > svg{animation:${rotate} 500ms linear infinite;}`, Spinner = forwardRef(function Spinner(props, ref) {
 	let $ = c(4), t0;
 	$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = /* @__PURE__ */ jsx(SpinnerIcon, {}), $[0] = t0) : t0 = $[0];
 	let t1;
@@ -822,7 +798,6 @@ const Flex = FlexComponent, rotate = keyframes`from{transform:rotate(0deg);}to{t
 		children: t0
 	}), $[1] = props, $[2] = ref, $[3] = t1) : t1 = $[3], t1;
 });
-Spinner.displayName = "ForwardRef(Spinner)";
 /**
 * @internal
 */
@@ -953,11 +928,11 @@ function buttonColorStyles(props) {
 }
 const StyledButton = /* @__PURE__ */ styled.button.withConfig({
 	displayName: "StyledButton",
-	componentId: "sc-u1hrlw-0"
+	componentId: "sc-rwh0gh-0"
 })(responsiveRadiusStyle, buttonBaseStyles, buttonColorStyles), LoadingBox = styled.div.withConfig({
 	displayName: "LoadingBox",
-	componentId: "sc-u1hrlw-1"
-})`position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background-color:var(--card-bg-color);border-radius:inherit;z-index:1;box-shadow:inherit;`, ButtonComponent = forwardRef(function(props, ref) {
+	componentId: "sc-rwh0gh-1"
+})`position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background-color:var(--card-bg-color);border-radius:inherit;z-index:1;box-shadow:inherit;`, Button = forwardRef(function Button(props, ref) {
 	let $ = c(87), IconComponent, IconRightComponent, children, disabled, gap, loading, paddingBottomProp, paddingLeftProp, paddingRightProp, paddingTopProp, paddingXProp, paddingYProp, restProps, selected, t0, t1, t2, t3, t4, t5, t6, t7, t8, text, textAlign, textWeight, width;
 	$[0] === props ? (IconComponent = $[1], IconRightComponent = $[2], children = $[3], disabled = $[4], gap = $[5], loading = $[6], paddingBottomProp = $[7], paddingLeftProp = $[8], paddingRightProp = $[9], paddingTopProp = $[10], paddingXProp = $[11], paddingYProp = $[12], restProps = $[13], selected = $[14], t0 = $[15], t1 = $[16], t2 = $[17], t3 = $[18], t4 = $[19], t5 = $[20], t6 = $[21], t7 = $[22], t8 = $[23], text = $[24], textAlign = $[25], textWeight = $[26], width = $[27]) : ({children, disabled, fontSize: t0, icon: IconComponent, iconRight: IconRightComponent, justify: t1, loading, mode: t2, padding: t3, paddingX: paddingXProp, paddingY: paddingYProp, paddingTop: paddingTopProp, paddingBottom: paddingBottomProp, paddingLeft: paddingLeftProp, paddingRight: paddingRightProp, radius: t4, selected, gap, space: t5, text, textAlign, textWeight, tone: t6, type: t7, muted: t8, width, ...restProps} = props, $[0] = props, $[1] = IconComponent, $[2] = IconRightComponent, $[3] = children, $[4] = disabled, $[5] = gap, $[6] = loading, $[7] = paddingBottomProp, $[8] = paddingLeftProp, $[9] = paddingRightProp, $[10] = paddingTopProp, $[11] = paddingXProp, $[12] = paddingYProp, $[13] = restProps, $[14] = selected, $[15] = t0, $[16] = t1, $[17] = t2, $[18] = t3, $[19] = t4, $[20] = t5, $[21] = t6, $[22] = t7, $[23] = t8, $[24] = text, $[25] = textAlign, $[26] = textWeight, $[27] = width);
 	let fontSize = t0 === void 0 ? 1 : t0, justifyProp = t1 === void 0 ? "center" : t1, mode = t2 === void 0 ? "default" : t2, paddingProp = t3 === void 0 ? 3 : t3, radiusProp = t4 === void 0 ? 2 : t4, deprecated_space = t5 === void 0 ? 3 : t5, tone = t6 === void 0 ? "default" : t6, type = t7 === void 0 ? "button" : t7, muted = t8 !== void 0 && t8, { button } = useTheme_v2(), t9;
@@ -1046,11 +1021,6 @@ const StyledButton = /* @__PURE__ */ styled.button.withConfig({
 		]
 	}), $[73] = mode, $[74] = radius, $[75] = ref, $[76] = restProps, $[77] = t21, $[78] = t22, $[79] = t23, $[80] = t24, $[81] = t25, $[82] = t26, $[83] = tone, $[84] = type, $[85] = width, $[86] = t27) : t27 = $[86], t27;
 });
-ButtonComponent.displayName = "ForwardRef(Button)";
-/**
-* @public
-*/
-const Button = ButtonComponent;
 function cardStyle(props) {
 	return [cardBaseStyle(props), cardColorStyle(props)];
 }
@@ -1075,8 +1045,8 @@ function cardColorStyle(props) {
 }
 const StyledCard = /* @__PURE__ */ styled(Box).withConfig({
 	displayName: "StyledCard",
-	componentId: "sc-5721dn-0"
-})(responsiveBorderStyle, responsiveRadiusStyle, responsiveShadowStyle, cardStyle), CardComponent = forwardRef(function(props, ref) {
+	componentId: "sc-p2pbep-0"
+})(responsiveBorderStyle, responsiveRadiusStyle, responsiveShadowStyle, cardStyle), Card = forwardRef(function Card(props, ref) {
 	let $ = c(56), asProp, border, borderBottom, borderLeft, borderRight, borderTop, muted, pressed, restProps, scheme, selected, shadow, t0, t1, t2, t3;
 	$[0] === props ? (asProp = $[1], border = $[2], borderBottom = $[3], borderLeft = $[4], borderRight = $[5], borderTop = $[6], muted = $[7], pressed = $[8], restProps = $[9], scheme = $[10], selected = $[11], shadow = $[12], t0 = $[13], t1 = $[14], t2 = $[15], t3 = $[16]) : ({__unstable_checkered: t0, __unstable_focusRing: t1, as: asProp, border, borderTop, borderRight, borderBottom, borderLeft, muted, pressed, radius: t2, scheme, selected, shadow, tone: t3, ...restProps} = props, $[0] = props, $[1] = asProp, $[2] = border, $[3] = borderBottom, $[4] = borderLeft, $[5] = borderRight, $[6] = borderTop, $[7] = muted, $[8] = pressed, $[9] = restProps, $[10] = scheme, $[11] = selected, $[12] = shadow, $[13] = t0, $[14] = t1, $[15] = t2, $[16] = t3);
 	let checkered = t0 !== void 0 && t0, focusRing = t1 !== void 0 && t1, radius = t2 === void 0 ? 0 : t2, toneProp = t3 === void 0 ? "default" : t3, as = isValidElementType(asProp) ? asProp : "div", rootTheme = useRootTheme(), tone = toneProp === "inherit" ? rootTheme.tone : toneProp, t4 = typeof as == "string" ? as : void 0, t5 = rootTheme.scheme, t6;
@@ -1125,14 +1095,6 @@ const StyledCard = /* @__PURE__ */ styled(Box).withConfig({
 		children: t16
 	}), $[52] = scheme, $[53] = t16, $[54] = tone, $[55] = t17) : t17 = $[55], t17;
 });
-CardComponent.displayName = "ForwardRef(Card)";
-/**
-* The `Card` component acts much like a `Box`, but with a background and foreground color.
-* Components within a `Card` inherit its colors.
-*
-* @public
-*/
-const Card = CardComponent;
 /**
 * @public
 */
@@ -1256,24 +1218,24 @@ function _createMediaStore(media) {
 			}
 		}
 		return sizes;
-	};
-	return {
-		getSnapshot: () => {
-			for (let { index, mq } of getSizes()) if (mq.matches) return index;
-			return 0;
-		},
-		subscribe: (onStoreChange) => {
-			let disposeFns = [];
-			for (let { mq } of getSizes()) {
-				let handleChange = () => {
-					mq.matches && onStoreChange();
-				};
-				mq.addEventListener("change", handleChange), disposeFns.push(() => mq.removeEventListener("change", handleChange));
-			}
-			return () => {
-				for (let disposeFn of disposeFns) disposeFn();
+	}, getSnapshot = () => {
+		for (let { index, mq } of getSizes()) if (mq.matches) return index;
+		return 0;
+	}, subscribe = (onStoreChange) => {
+		let disposeFns = [];
+		for (let { mq } of getSizes()) {
+			let handleChange = () => {
+				mq.matches && onStoreChange();
 			};
+			mq.addEventListener("change", handleChange), disposeFns.push(() => mq.removeEventListener("change", handleChange));
 		}
+		return () => {
+			for (let disposeFn of disposeFns) disposeFn();
+		};
+	};
+	return {
+		getSnapshot,
+		subscribe
 	};
 }
 /**
@@ -1324,8 +1286,8 @@ function usePrefersReducedMotion(getServerSnapshot = () => !1) {
 }
 const StyledGrid = /* @__PURE__ */ styled(Box).withConfig({
 	displayName: "StyledGrid",
-	componentId: "sc-p9qx07-0"
-})(responsiveGridStyle), GridComponent = forwardRef(function(props, ref) {
+	componentId: "sc-1yxm55-0"
+})(responsiveGridStyle), Grid = forwardRef(function Grid(props, ref) {
 	let $ = c(44), as, autoCols, autoFlow, autoRows, children, columns, gap, gapX, gapY, gridTemplateColumns, gridTemplateRows, restProps, rows;
 	$[0] === props ? (as = $[1], autoCols = $[2], autoFlow = $[3], autoRows = $[4], children = $[5], columns = $[6], gap = $[7], gapX = $[8], gapY = $[9], gridTemplateColumns = $[10], gridTemplateRows = $[11], restProps = $[12], rows = $[13]) : ({as, autoRows, autoCols, autoFlow, columns, gridTemplateColumns, gap, gapX, gapY, rows, gridTemplateRows, children, ...restProps} = props, $[0] = props, $[1] = as, $[2] = autoCols, $[3] = autoFlow, $[4] = autoRows, $[5] = children, $[6] = columns, $[7] = gap, $[8] = gapX, $[9] = gapY, $[10] = gridTemplateColumns, $[11] = gridTemplateRows, $[12] = restProps, $[13] = rows);
 	let t0 = typeof as == "string" ? as : void 0, t1;
@@ -1362,13 +1324,6 @@ const StyledGrid = /* @__PURE__ */ styled(Box).withConfig({
 		children
 	}), $[30] = as, $[31] = children, $[32] = ref, $[33] = restProps, $[34] = t0, $[35] = t1, $[36] = t10, $[37] = t2, $[38] = t3, $[39] = t5, $[40] = t6, $[41] = t7, $[42] = t8, $[43] = t11) : t11 = $[43], t11;
 });
-GridComponent.displayName = "ForwardRef(Grid)";
-/**
-* The `Grid` component is for building 2-dimensional layers (based on CSS grid).
-*
-* @public
-*/
-const Grid = GridComponent;
 function inlineBaseStyle() {
 	return {
 		lineHeight: "0",
@@ -1391,8 +1346,8 @@ function inlineSpaceStyle(props) {
 }
 const StyledInline = /* @__PURE__ */ styled(Box).withConfig({
 	displayName: "StyledInline",
-	componentId: "sc-aabqmb-0"
-})(inlineBaseStyle, inlineSpaceStyle), InlineComponent = forwardRef(function(props, ref) {
+	componentId: "sc-8j2qbm-0"
+})(inlineBaseStyle, inlineSpaceStyle), Inline = forwardRef(function Inline(props, ref) {
 	let $ = c(16), as, childrenProp, deprecated_space, gap, restProps;
 	$[0] === props ? (as = $[1], childrenProp = $[2], deprecated_space = $[3], gap = $[4], restProps = $[5]) : ({as, children: childrenProp, gap, space: deprecated_space, ...restProps} = props, $[0] = props, $[1] = as, $[2] = childrenProp, $[3] = deprecated_space, $[4] = gap, $[5] = restProps);
 	let spacing = gap === void 0 ? deprecated_space : gap, t0;
@@ -1409,13 +1364,6 @@ const StyledInline = /* @__PURE__ */ styled(Box).withConfig({
 		children
 	}), $[10] = as, $[11] = children, $[12] = restProps, $[13] = t1, $[14] = t2, $[15] = t3) : t3 = $[15], t3;
 });
-InlineComponent.displayName = "ForwardRef(Inline)";
-/**
-* The `Inline` component is a layout utility for aligning and spacing items horizontally.
-*
-* @public
-*/
-const Inline = InlineComponent;
 function _temp$4(child) {
 	return child && /* @__PURE__ */ jsx("div", { children: child });
 }
@@ -1424,8 +1372,8 @@ function kbdStyle() {
 }
 const StyledKBD = /* @__PURE__ */ styled.kbd.withConfig({
 	displayName: "StyledKBD",
-	componentId: "sc-ielwjm-0"
-})(responsiveRadiusStyle, kbdStyle), KBDComponent = forwardRef(function(props, ref) {
+	componentId: "sc-pgjv2l-0"
+})(responsiveRadiusStyle, kbdStyle), KBD = forwardRef(function KBD(props, ref) {
 	let $ = c(19), children, restProps, t0, t1, t2;
 	$[0] === props ? (children = $[1], restProps = $[2], t0 = $[3], t1 = $[4], t2 = $[5]) : ({children, fontSize: t0, padding: t1, radius: t2, ...restProps} = props, $[0] = props, $[1] = children, $[2] = restProps, $[3] = t0, $[4] = t1, $[5] = t2);
 	let fontSize = t0 === void 0 ? 0 : t0, padding = t1 === void 0 ? 1 : t1, radius = t2 === void 0 ? 2 : t2, t3;
@@ -1451,14 +1399,7 @@ const StyledKBD = /* @__PURE__ */ styled.kbd.withConfig({
 		ref,
 		children: t5
 	}), $[14] = ref, $[15] = restProps, $[16] = t3, $[17] = t5, $[18] = t6) : t6 = $[18], t6;
-});
-KBDComponent.displayName = "ForwardRef(KBD)";
-/**
-* Used to define some text as keyboard input.
-*
-* @public
-*/
-const KBD = KBDComponent, origin = {
+}), origin = {
 	name: "@sanity/ui/origin",
 	fn({ middlewareData, placement, rects }) {
 		let [side] = placement.split("-"), floatingWidth = rects.floating.width, floatingHeight = rects.floating.height, shiftX = middlewareData.shift?.x || 0, shiftY = middlewareData.shift?.y || 0;
@@ -1516,14 +1457,14 @@ function compileCommands(cmds) {
 }
 const StyledArrow = /* @__PURE__ */ styled.div.withConfig({
 	displayName: "StyledArrow",
-	componentId: "sc-d20m08-0"
+	componentId: "sc-1ev21f-0"
 })(({ $w: w }) => css`position:absolute;width:${w}px;height:${w}px;:empty + &{display:none;}& > svg{display:block;line-height:0;transform-origin:${w / 2}px ${w / 2}px;}[data-placement^='top'] > &{bottom:-${w}px;& > svg{transform:rotate(0);}}[data-placement^='right'] > &{left:-${w}px;& > svg{transform:rotate(90deg);}}[data-placement^='left'] > &{right:-${w}px;& > svg{transform:rotate(-90deg);}}[data-placement^='bottom'] > &{top:-${w}px;& > svg{transform:rotate(180deg);}}`), StrokePath = styled.path.withConfig({
 	displayName: "StrokePath",
-	componentId: "sc-d20m08-1"
+	componentId: "sc-1ev21f-1"
 })`stroke:var(--card-shadow-outline-color);`, ShapePath = styled.path.withConfig({
 	displayName: "ShapePath",
-	componentId: "sc-d20m08-2"
-})`fill:var(--card-bg-color);`, Arrow = forwardRef(function(props, ref) {
+	componentId: "sc-1ev21f-2"
+})`fill:var(--card-bg-color);`, Arrow = forwardRef(function Arrow(props, ref) {
 	let $ = c(29), h, restProps, t0, w;
 	$[0] === props ? (h = $[1], restProps = $[2], t0 = $[3], w = $[4]) : ({width: w, height: h, radius: t0, ...restProps} = props, $[0] = props, $[1] = h, $[2] = restProps, $[3] = t0, $[4] = w);
 	let radius = t0 === void 0 ? 0 : t0, { card } = useTheme_v2(), strokeWidth = card.shadow.outline, center = w / 2, t1;
@@ -1589,9 +1530,7 @@ const StyledArrow = /* @__PURE__ */ styled.div.withConfig({
 		ref,
 		children: t7
 	}), $[24] = ref, $[25] = restProps, $[26] = t7, $[27] = w, $[28] = t8) : t8 = $[28], t8;
-});
-Arrow.displayName = "ForwardRef(Arrow)";
-const BoundaryElementContext = createGlobalScopedContext("@sanity/ui/context/boundaryElement", null);
+}), BoundaryElementContext = createGlobalScopedContext("@sanity/ui/context/boundaryElement", null);
 function isRecord(value) {
 	return !!(value && typeof value == "object" && !Array.isArray(value));
 }
@@ -1663,7 +1602,6 @@ function _temp2$2(v_0) {
 function _temp$3(v) {
 	return v + 1;
 }
-LayerProvider.displayName = "LayerProvider";
 /**
 * @public
 */
@@ -1678,8 +1616,8 @@ function useLayer() {
 }
 const StyledLayer = /* @__PURE__ */ styled.div.withConfig({
 	displayName: "StyledLayer",
-	componentId: "sc-h90030-0"
-})({ position: "relative" }), LayerChildren = forwardRef(function(props, forwardedRef) {
+	componentId: "sc-100e5i-0"
+})({ position: "relative" }), LayerChildren = forwardRef(function LayerChildren(props, forwardedRef) {
 	let $ = c(22), children, onActivate, onFocus, restProps, t0;
 	$[0] === props ? (children = $[1], onActivate = $[2], onFocus = $[3], restProps = $[4], t0 = $[5]) : ({children, onActivate, onFocus, style: t0, ...restProps} = props, $[0] = props, $[1] = children, $[2] = onActivate, $[3] = onFocus, $[4] = restProps, $[5] = t0);
 	let style = t0 === void 0 ? EMPTY_RECORD : t0, { zIndex, isTopLayer } = useLayer(), lastFocusedRef = useRef(null), ref = useRef(null), isTopLayerRef = useRef(isTopLayer), t1;
@@ -1708,7 +1646,7 @@ const StyledLayer = /* @__PURE__ */ styled.div.withConfig({
 		style: t5,
 		children
 	}), $[17] = children, $[18] = handleFocus, $[19] = restProps, $[20] = t5, $[21] = t6) : t6 = $[21], t6;
-}), Layer = forwardRef(function(props, ref) {
+}), Layer = forwardRef(function Layer(props, ref) {
 	let $ = c(11), children, restProps, t0;
 	$[0] === props ? (children = $[1], restProps = $[2], t0 = $[3]) : ({children, zOffset: t0, ...restProps} = props, $[0] = props, $[1] = children, $[2] = restProps, $[3] = t0);
 	let zOffset = t0 === void 0 ? 1 : t0, t1;
@@ -1722,9 +1660,7 @@ const StyledLayer = /* @__PURE__ */ styled.div.withConfig({
 		zOffset,
 		children: t1
 	}), $[8] = t1, $[9] = zOffset, $[10] = t2) : t2 = $[10], t2;
-});
-Layer.displayName = "ForwardRef(Layer)";
-const key = "@sanity/ui/context/portal", elementKey = Symbol.for(`${key}/element`);
+}), key = "@sanity/ui/context/portal", elementKey = Symbol.for(`${key}/element`);
 globalScope[elementKey] = null;
 const PortalContext = createGlobalScopedContext(key, {
 	version: 0,
@@ -1749,7 +1685,6 @@ function Portal(props) {
 	let { children, __unstable_name: name } = props, portal = usePortal(), portalElement = (name ? portal.elements && portal.elements[name] : portal.element) || portal.elements?.default;
 	return portalElement ? createPortal(children, portalElement) : null;
 }
-Portal.displayName = "Portal";
 /**
 * @public
 */
@@ -1773,7 +1708,6 @@ function _temp2$1() {
 function _temp$2() {
 	return document.body;
 }
-PortalProvider.displayName = "PortalProvider";
 const emptySubscribe = () => () => {};
 function getElementRef(element) {
 	let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
@@ -1876,11 +1810,11 @@ function calcMaxWidth(params) {
 }
 const MotionCard$1 = styled(motion.create(Card)).withConfig({
 	displayName: "MotionCard",
-	componentId: "sc-5mkek4-0"
+	componentId: "sc-n3w53t-0"
 })`&:not([hidden]){display:flex;}flex-direction:column;width:max-content;min-width:min-content;will-change:transform;`, MotionFlex = styled(motion.create(Flex)).withConfig({
 	displayName: "MotionFlex",
-	componentId: "sc-5mkek4-1"
-})`will-change:opacity;`, PopoverCard = forwardRef(function(props, ref) {
+	componentId: "sc-n3w53t-1"
+})`will-change:opacity;`, PopoverCard = forwardRef(function PopoverCard(props, ref) {
 	let $ = c(66), animate, arrow, arrowRef, arrowX, arrowY, children, marginsProp, originX, originY, overflow, padding, placement, radius, restProps, scheme, shadow, strategy, style, tone, width, xProp, yProp;
 	$[0] === props ? (animate = $[1], arrow = $[2], arrowRef = $[3], arrowX = $[4], arrowY = $[5], children = $[6], marginsProp = $[7], originX = $[8], originY = $[9], overflow = $[10], padding = $[11], placement = $[12], radius = $[13], restProps = $[14], scheme = $[15], shadow = $[16], strategy = $[17], style = $[18], tone = $[19], width = $[20], xProp = $[21], yProp = $[22]) : ({__unstable_margins: marginsProp, animate, arrow, arrowRef, arrowX, arrowY, children, padding, placement, originX, originY, overflow, radius, scheme, shadow, strategy, style, tone, width, x: xProp, y: yProp, ...restProps} = props, $[0] = props, $[1] = animate, $[2] = arrow, $[3] = arrowRef, $[4] = arrowX, $[5] = arrowY, $[6] = children, $[7] = marginsProp, $[8] = originX, $[9] = originY, $[10] = overflow, $[11] = padding, $[12] = placement, $[13] = radius, $[14] = restProps, $[15] = scheme, $[16] = shadow, $[17] = strategy, $[18] = style, $[19] = tone, $[20] = width, $[21] = xProp, $[22] = yProp);
 	let { zIndex } = useLayer(), margins = marginsProp || DEFAULT_POPOVER_MARGINS, x = (xProp ?? 0) + margins[3], y = (yProp ?? 0) + margins[0], t0 = animate ? "transform" : void 0, t1;
@@ -1952,9 +1886,7 @@ const MotionCard$1 = styled(motion.create(Card)).withConfig({
 		exit: t8,
 		children: [t10, t11]
 	}), $[52] = placement, $[53] = radius, $[54] = ref, $[55] = rootStyle, $[56] = scheme, $[57] = shadow, $[58] = t10, $[59] = t11, $[60] = t5, $[61] = t6, $[62] = t7, $[63] = t8, $[64] = tone, $[65] = t12) : t12 = $[65], t12;
-});
-PopoverCard.displayName = "ForwardRef(PopoverCard)";
-const ViewportOverlay = () => {
+}), ViewportOverlay = () => {
 	let $ = c(2), { zIndex } = useLayer(), t0;
 	return $[0] === zIndex ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx("div", { style: {
 		height: "100vh",
@@ -1963,7 +1895,7 @@ const ViewportOverlay = () => {
 		width: "100vw",
 		zIndex
 	} }), $[0] = zIndex, $[1] = t0), t0;
-}, Popover = forwardRef(function(props, forwardedRef) {
+}, Popover = forwardRef(function Popover(props, forwardedRef) {
 	let $ = c(126), { container, layer } = useTheme_v2(), boundaryElementContext = useBoundaryElement(), _boundaryElement, _fallbackPlacements, _floatingBoundary, _referenceBoundary, _zOffsetProp, childProp, content, disabled, matchReferenceWidth, modal, open, paddingProp, portal, referenceElement, restProps, scheme, t0, t1, t10, t11, t2, t3, t4, t5, t6, t7, t8, t9, updateRef;
 	if ($[0] !== props) {
 		let { __unstable_margins: t12, animate: t13, arrow: t14, boundaryElement: t15, children: t16, constrainSize: t17, content: t18, disabled: t19, fallbackPlacements: t20, matchReferenceWidth: t21, floatingBoundary: t22, modal: t23, onActivate, open: t24, overflow: t25, padding: t26, placement: t27, placementStrategy: t28, portal: t29, preventOverflow: t30, radius: t31, referenceBoundary: t32, referenceElement: t33, scheme: t34, shadow: t35, tone: t36, width: t37, zOffset: t38, updateRef: t39, ...t40 } = props;
@@ -2110,7 +2042,6 @@ const ViewportOverlay = () => {
 	let t40;
 	return $[123] !== child || $[124] !== t39 ? (t40 = /* @__PURE__ */ jsxs(Fragment$1, { children: [t39, child] }), $[123] = child, $[124] = t39, $[125] = t40) : t40 = $[125], t40;
 });
-Popover.displayName = "ForwardRef(Popover)";
 function useMiddleware$1(t0) {
 	let $ = c(42), { animate, arrowProp, arrowRef, constrainSize, fallbackPlacements, floatingBoundary, margins, matchReferenceWidth, maxWidthRef, placementProp, placementStrategy, preventOverflow, referenceBoundary, referenceWidthRef, rootBoundary, setReferenceWidth, widthRef } = t0, ret;
 	if ($[0] !== animate || $[1] !== arrowProp || $[2] !== arrowRef || $[3] !== constrainSize || $[4] !== fallbackPlacements || $[5] !== floatingBoundary || $[6] !== margins || $[7] !== matchReferenceWidth || $[8] !== maxWidthRef || $[9] !== placementProp || $[10] !== placementStrategy || $[11] !== preventOverflow || $[12] !== referenceBoundary || $[13] !== referenceWidthRef || $[14] !== rootBoundary || $[15] !== setReferenceWidth || $[16] !== widthRef) {
@@ -2181,8 +2112,8 @@ function responsiveStackSpaceStyle(props) {
 }
 const StyledStack = /* @__PURE__ */ styled(Box).withConfig({
 	displayName: "StyledStack",
-	componentId: "sc-tusrcx-0"
-})(stackBaseStyle, responsiveStackSpaceStyle), StackComponent = forwardRef(function(props, ref) {
+	componentId: "sc-0k6050-0"
+})(stackBaseStyle, responsiveStackSpaceStyle), Stack = forwardRef(function Stack(props, ref) {
 	let $ = c(13), as, deprecated_space, gap, restProps;
 	$[0] === props ? (as = $[1], deprecated_space = $[2], gap = $[3], restProps = $[4]) : ({as, gap, space: deprecated_space, ...restProps} = props, $[0] = props, $[1] = as, $[2] = deprecated_space, $[3] = gap, $[4] = restProps);
 	let spacing = gap === void 0 ? deprecated_space : gap, t0 = typeof as == "string" ? as : void 0, t1;
@@ -2196,44 +2127,37 @@ const StyledStack = /* @__PURE__ */ styled(Box).withConfig({
 		forwardedAs: as,
 		ref
 	}), $[7] = as, $[8] = ref, $[9] = restProps, $[10] = t0, $[11] = t1, $[12] = t2) : t2 = $[12], t2;
-});
-StackComponent.displayName = "ForwardRef(Stack)";
-/**
-* The `Stack` component is used to place elements on top of each other.
-*
-* @public
-*/
-const Stack = StackComponent, CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, StyledTextInput = /* @__PURE__ */ styled(Card).attrs({ forwardedAs: "span" }).withConfig({
+}), CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, StyledTextInput = /* @__PURE__ */ styled(Card).attrs({ forwardedAs: "span" }).withConfig({
 	displayName: "StyledTextInput",
-	componentId: "sc-ab08rw-0"
+	componentId: "sc-iuvxo7-0"
 })(textInputRootStyle), InputRoot = styled.span.withConfig({
 	displayName: "InputRoot",
-	componentId: "sc-ab08rw-1"
+	componentId: "sc-iuvxo7-1"
 })`flex:1;min-width:0;display:block;position:relative;`, Prefix = styled(Card).attrs({ forwardedAs: "span" }).withConfig({
 	displayName: "Prefix",
-	componentId: "sc-ab08rw-2"
+	componentId: "sc-iuvxo7-2"
 })`border-top-right-radius:0;border-bottom-right-radius:0;& > span{display:block;margin:-1px;}`, Suffix = styled(Card).attrs({ forwardedAs: "span" }).withConfig({
 	displayName: "Suffix",
-	componentId: "sc-ab08rw-3"
+	componentId: "sc-iuvxo7-3"
 })`border-top-left-radius:0;border-bottom-left-radius:0;& > span{display:block;margin:-1px;}`, Input = /* @__PURE__ */ styled.input.withConfig({
 	displayName: "Input",
-	componentId: "sc-ab08rw-4"
+	componentId: "sc-iuvxo7-4"
 })(responsiveInputPaddingStyle, textInputBaseStyle, textInputFontSizeStyle), Presentation = /* @__PURE__ */ styled.span.withConfig({
 	displayName: "Presentation",
-	componentId: "sc-ab08rw-5"
+	componentId: "sc-iuvxo7-5"
 })(responsiveRadiusStyle, textInputRepresentationStyle), LeftBox = styled(Box).withConfig({
 	displayName: "LeftBox",
-	componentId: "sc-ab08rw-6"
+	componentId: "sc-iuvxo7-6"
 })`position:absolute;top:0;left:0;`, RightBox = styled(Box).withConfig({
 	displayName: "RightBox",
-	componentId: "sc-ab08rw-7"
+	componentId: "sc-iuvxo7-7"
 })`position:absolute;top:0;right:0;`, RightCard = styled(Card).withConfig({
 	displayName: "RightCard",
-	componentId: "sc-ab08rw-8"
+	componentId: "sc-iuvxo7-8"
 })`background-color:transparent;position:absolute;top:0;right:0;`, TextInputClearButton = /* @__PURE__ */ styled(Button).withConfig({
 	displayName: "TextInputClearButton",
-	componentId: "sc-ab08rw-9"
-})({ "&:not([hidden])": { display: "block" } }), TextInput = forwardRef(function(props, forwardedRef) {
+	componentId: "sc-iuvxo7-9"
+})({ "&:not([hidden])": { display: "block" } }), TextInput = forwardRef(function TextInput(props, forwardedRef) {
 	let $ = c(93), IconComponent, IconRightComponent, __unstable_disableFocusRing, clearButton, customValidity, gap, onClear, prefix, readOnly, restProps, suffix, t0, t1, t2, t3, t4, t5, t6, weight;
 	$[0] === props ? (IconComponent = $[1], IconRightComponent = $[2], __unstable_disableFocusRing = $[3], clearButton = $[4], customValidity = $[5], gap = $[6], onClear = $[7], prefix = $[8], readOnly = $[9], restProps = $[10], suffix = $[11], t0 = $[12], t1 = $[13], t2 = $[14], t3 = $[15], t4 = $[16], t5 = $[17], t6 = $[18], weight = $[19]) : ({__unstable_disableFocusRing, border: t0, clearButton, disabled: t1, fontSize: t2, gap, icon: IconComponent, iconRight: IconRightComponent, onClear, padding: t3, prefix, radius: t4, readOnly, space: t5, suffix, customValidity, type: t6, weight, ...restProps} = props, $[0] = props, $[1] = IconComponent, $[2] = IconRightComponent, $[3] = __unstable_disableFocusRing, $[4] = clearButton, $[5] = customValidity, $[6] = gap, $[7] = onClear, $[8] = prefix, $[9] = readOnly, $[10] = restProps, $[11] = suffix, $[12] = t0, $[13] = t1, $[14] = t2, $[15] = t3, $[16] = t4, $[17] = t5, $[18] = t6, $[19] = weight);
 	let border = t0 === void 0 || t0, disabled = t1 !== void 0 && t1, fontSizeProp = t2 === void 0 ? 2 : t2, paddingProp = t3 === void 0 ? 3 : t3, radiusProp = t4 === void 0 ? 2 : t4, deprecated_space = t5 === void 0 ? 3 : t5, type = t6 === void 0 ? "text" : t6, ref = useRef(null), rootTheme = useRootTheme(), t7;
@@ -2358,7 +2282,6 @@ const Stack = StackComponent, CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, StyledText
 		]
 	}), $[88] = prefixNode, $[89] = rootTheme.tone, $[90] = suffixNode, $[91] = t25, $[92] = t26) : t26 = $[92], t26;
 });
-TextInput.displayName = "ForwardRef(TextInput)";
 function _temp$1(event) {
 	event.preventDefault(), event.stopPropagation();
 }
@@ -2470,8 +2393,8 @@ const DEFAULT_FALLBACK_PLACEMENTS = {
 	]
 }, MotionCard = styled(motion.create(Card)).withConfig({
 	displayName: "MotionCard",
-	componentId: "sc-ae1zod-0"
-})`will-change:transform;`, TooltipCard = forwardRef(function(props, ref) {
+	componentId: "sc-d1w0oq-0"
+})`will-change:transform;`, TooltipCard = forwardRef(function TooltipCard(props, ref) {
 	let $ = c(48), animate, arrow, arrowRef, arrowX, arrowY, children, originX, originY, padding, placement, radius, restProps, scheme, shadow, style;
 	$[0] === props ? (animate = $[1], arrow = $[2], arrowRef = $[3], arrowX = $[4], arrowY = $[5], children = $[6], originX = $[7], originY = $[8], padding = $[9], placement = $[10], radius = $[11], restProps = $[12], scheme = $[13], shadow = $[14], style = $[15]) : ({animate, arrow, arrowRef, arrowX, arrowY, children, originX, originY, padding, placement, radius, scheme, shadow, style, ...restProps} = props, $[0] = props, $[1] = animate, $[2] = arrow, $[3] = arrowRef, $[4] = arrowX, $[5] = arrowY, $[6] = children, $[7] = originX, $[8] = originY, $[9] = padding, $[10] = placement, $[11] = radius, $[12] = restProps, $[13] = scheme, $[14] = shadow, $[15] = style);
 	let t0 = animate ? "transform" : void 0, t1;
@@ -2520,12 +2443,7 @@ const DEFAULT_FALLBACK_PLACEMENTS = {
 		exit: t8,
 		children: [children, t9]
 	}), $[34] = children, $[35] = padding, $[36] = placement, $[37] = radius, $[38] = ref, $[39] = rootStyle, $[40] = scheme, $[41] = shadow, $[42] = t5, $[43] = t6, $[44] = t7, $[45] = t8, $[46] = t9, $[47] = t10) : t10 = $[47], t10;
-});
-TooltipCard.displayName = "ForwardRef(TooltipCard)";
-/**
-* @beta
-*/
-const TooltipDelayGroupContext = createGlobalScopedContext("@sanity/ui/context/tooltipDelayGroup", null);
+}), TooltipDelayGroupContext = createGlobalScopedContext("@sanity/ui/context/tooltipDelayGroup", null);
 /**
 * @beta
 */
@@ -2534,8 +2452,8 @@ function useTooltipDelayGroup() {
 }
 const StyledTooltip = styled(Layer).withConfig({
 	displayName: "StyledTooltip",
-	componentId: "sc-hx8o7p-0"
-})`pointer-events:none;`, Tooltip = forwardRef(function(props, forwardedRef) {
+	componentId: "sc-dkqcjk-0"
+})`pointer-events:none;`, Tooltip = forwardRef(function Tooltip(props, forwardedRef) {
 	let $ = c(137), boundaryElementContext = useBoundaryElement(), { layer } = useTheme_v2(), _boundaryElement, _fallbackPlacementsProp, _zOffset, childProp, content, delay, disabled, portalProp, restProps, scheme, t0, t1, t2, t3, t4, t5;
 	$[0] === props ? (_boundaryElement = $[1], _fallbackPlacementsProp = $[2], _zOffset = $[3], childProp = $[4], content = $[5], delay = $[6], disabled = $[7], portalProp = $[8], restProps = $[9], scheme = $[10], t0 = $[11], t1 = $[12], t2 = $[13], t3 = $[14], t4 = $[15], t5 = $[16]) : ({animate: t0, arrow: t1, boundaryElement: _boundaryElement, children: childProp, content, disabled, fallbackPlacements: _fallbackPlacementsProp, padding: t2, placement: t3, portal: portalProp, radius: t4, scheme, shadow: t5, zOffset: _zOffset, delay, ...restProps} = props, $[0] = props, $[1] = _boundaryElement, $[2] = _fallbackPlacementsProp, $[3] = _zOffset, $[4] = childProp, $[5] = content, $[6] = delay, $[7] = disabled, $[8] = portalProp, $[9] = restProps, $[10] = scheme, $[11] = t0, $[12] = t1, $[13] = t2, $[14] = t3, $[15] = t4, $[16] = t5);
 	let _animate = t0 !== void 0 && t0, arrowProp = t1 !== void 0 && t1, padding = t2 === void 0 ? 2 : t2, placementProp = t3 === void 0 ? "bottom" : t3, radius = t4 === void 0 ? 2 : t4, shadow = t5 === void 0 ? 2 : t5, boundaryElement = _boundaryElement ?? boundaryElementContext?.element, fallbackPlacementsProp = _fallbackPlacementsProp ?? DEFAULT_FALLBACK_PLACEMENTS[props.placement ?? "bottom"], zOffset = _zOffset ?? layer.tooltip.zOffset, animate = !usePrefersReducedMotion() && _animate, t6;
@@ -2620,7 +2538,7 @@ const StyledTooltip = styled(Layer).withConfig({
 	let t24, t25;
 	$[74] !== handleIsOpenChange || $[75] !== showTooltip ? (t24 = () => {
 		if (!showTooltip) return;
-		let handleWindowKeyDown = function(event) {
+		let handleWindowKeyDown = function handleWindowKeyDown(event) {
 			event.key === "Escape" && handleIsOpenChange(!1, !0);
 		};
 		return window.addEventListener("keydown", handleWindowKeyDown), () => {
@@ -2709,7 +2627,6 @@ const StyledTooltip = styled(Layer).withConfig({
 	let t40;
 	return $[134] !== child || $[135] !== t39 ? (t40 = /* @__PURE__ */ jsxs(Fragment$1, { children: [t39, child] }), $[134] = child, $[135] = t39, $[136] = t40) : t40 = $[136], t40;
 });
-Tooltip.displayName = "ForwardRef(Tooltip)";
 function useMiddleware(t0) {
 	let $ = c(17), { animate, arrowProp, arrowRef, boundaryElement, fallbackPlacements, rootBoundary } = t0, ret;
 	if ($[0] !== animate || $[1] !== arrowProp || $[2] !== arrowRef || $[3] !== boundaryElement || $[4] !== fallbackPlacements || $[5] !== rootBoundary) {
@@ -2761,11 +2678,11 @@ function useCloseOnMouseLeave(t0) {
 }
 const StyledHotkeys = styled.kbd.withConfig({
 	displayName: "StyledHotkeys",
-	componentId: "sc-j9kh17-0"
+	componentId: "sc-07x5rd-0"
 })`font:inherit;padding:1px;&:not([hidden]){display:block;}`, Key = styled(KBD).withConfig({
 	displayName: "Key",
-	componentId: "sc-j9kh17-1"
-})`&:not([hidden]){display:block;}`, Hotkeys = forwardRef(function(props, ref) {
+	componentId: "sc-07x5rd-1"
+})`&:not([hidden]){display:block;}`, Hotkeys = forwardRef(function Hotkeys(props, ref) {
 	let $ = c(27), fontSize, gap, keys, padding, radius, restProps, t0;
 	$[0] === props ? (fontSize = $[1], gap = $[2], keys = $[3], padding = $[4], radius = $[5], restProps = $[6], t0 = $[7]) : ({fontSize, gap, keys, padding, radius, space: t0, ...restProps} = props, $[0] = props, $[1] = fontSize, $[2] = gap, $[3] = keys, $[4] = padding, $[5] = radius, $[6] = restProps, $[7] = t0);
 	let t1 = gap === void 0 ? t0 === void 0 ? .5 : t0 : gap, t2;
@@ -2798,9 +2715,7 @@ const StyledHotkeys = styled.kbd.withConfig({
 		ref,
 		children: t4
 	}), $[23] = ref, $[24] = restProps, $[25] = t4, $[26] = t5) : t5 = $[26], t5;
-});
-Hotkeys.displayName = "ForwardRef(Hotkeys)";
-const MenuContext = createGlobalScopedContext("@sanity/ui/context/menu", null);
+}), MenuContext = createGlobalScopedContext("@sanity/ui/context/menu", null);
 /**
 * @internal
 */
@@ -2832,14 +2747,15 @@ function _sortElements(rootElement, elements) {
 	if (!rootElement) return;
 	let map = /* @__PURE__ */ new WeakMap();
 	for (let el of elements) map.set(el, _getDOMPath(rootElement, el));
-	elements.sort((a, b) => {
+	let _sort = (a, b) => {
 		let _a = map.get(a) || EMPTY_PATH, _b = map.get(b) || EMPTY_PATH, len = Math.max(_a.length, _b.length);
 		for (let i = 0; i < len; i += 1) {
 			let aIndex = _a[i] || -1, bIndex = _b[i] || -1;
 			if (aIndex !== bIndex) return aIndex - bIndex;
 		}
 		return 0;
-	});
+	};
+	elements.sort(_sort);
 }
 /**
 * This controller is responsible for controlling UI menu state.
@@ -2950,8 +2866,8 @@ function useMenuController(props) {
 }
 const StyledMenu = styled(Box).withConfig({
 	displayName: "StyledMenu",
-	componentId: "sc-hkwd9h-0"
-})`outline:none;overflow:auto;`, Menu = forwardRef(function(props, forwardedRef) {
+	componentId: "sc-88w4l4-0"
+})`outline:none;overflow:auto;`, Menu = forwardRef(function Menu(props, forwardedRef) {
 	let $ = c(50), _shouldFocus, children, gap, onClickOutside, onEscape, onItemClick, onItemSelect, onKeyDown, originElement, registerElement, restProps, t0, t1;
 	if ($[0] !== props) {
 		let { children: t2, focusFirst, focusLast, onClickOutside: t3, onEscape: t4, onItemClick: t5, onItemSelect: t6, onKeyDown: t7, originElement: t8, padding: t9, registerElement: t10, shouldFocus: t11, gap: t12, space: t13, ...t14 } = props;
@@ -3013,17 +2929,10 @@ const StyledMenu = styled(Box).withConfig({
 		value,
 		children: t11
 	}), $[47] = t11, $[48] = value, $[49] = t12) : t12 = $[49], t12;
-});
-Menu.displayName = "ForwardRef(Menu)";
-const StyledMenuDivider = styled.hr.withConfig({
-	displayName: "StyledMenuDivider",
-	componentId: "sc-bemnwm-0"
+}), MenuDivider = styled.hr.withConfig({
+	displayName: "MenuDivider",
+	componentId: "sc-l4kws7-0"
 })`height:1px;border:0;background:var(--card-hairline-soft-color);margin:0;`;
-StyledMenuDivider.displayName = "MenuDivider";
-/**
-* @public
-*/
-const MenuDivider = StyledMenuDivider;
 function selectableBaseStyle() {
 	return css`background-color:inherit;color:inherit;&[data-as='button']{-webkit-font-smoothing:inherit;appearance:none;outline:none;font:inherit;text-align:inherit;border:0;width:-moz-available;width:-webkit-fill-available;width:stretch;}&[data-as='a']{text-decoration:none;}`;
 }
@@ -3036,16 +2945,18 @@ function selectableColorStyle(props) {
 */
 const Selectable = /* @__PURE__ */ styled(Box).withConfig({
 	displayName: "Selectable",
-	componentId: "sc-q5xa1z-0"
+	componentId: "sc-sk8nre-0"
 })(responsiveRadiusStyle, selectableBaseStyle, selectableColorStyle);
-Selectable.displayName = "Selectable";
 function useMenu() {
 	let value = useContext(MenuContext);
 	if (!value) throw Error("useMenu(): missing context value");
 	if (!isRecord(value) || value.version !== 2) throw Error("useMenu(): the context value is not compatible");
 	return value;
 }
-function MenuGroupComponent(props) {
+/**
+* @public
+*/
+const MenuGroup = function MenuGroup(props) {
 	let $ = c(82), IconComponent, children, gap, menuProps, onClick, popover, restProps, t0, t1, t2, t3, t4, t5, text;
 	$[0] === props ? (IconComponent = $[1], children = $[2], gap = $[3], menuProps = $[4], onClick = $[5], popover = $[6], restProps = $[7], t0 = $[8], t1 = $[9], t2 = $[10], t3 = $[11], t4 = $[12], t5 = $[13], text = $[14]) : ({as: t0, children, fontSize: t1, icon: IconComponent, menu: menuProps, onClick, padding: t2, popover, radius: t3, gap, space: t4, text, tone: t5, ...restProps} = props, $[0] = props, $[1] = IconComponent, $[2] = children, $[3] = gap, $[4] = menuProps, $[5] = onClick, $[6] = popover, $[7] = restProps, $[8] = t0, $[9] = t1, $[10] = t2, $[11] = t3, $[12] = t4, $[13] = t5, $[14] = text);
 	let as = t0 === void 0 ? "button" : t0, fontSize = t1 === void 0 ? 1 : t1, padding = t2 === void 0 ? 3 : t2, radius = t3 === void 0 ? 2 : t3, deprecated_space = t4 === void 0 ? 3 : t4, tone = t5 === void 0 ? "default" : t5, spacing = gap === void 0 ? deprecated_space : gap, menu = useMenu(), { scheme } = useRootTheme(), { activeElement, mount, onClickOutside, onEscape, onItemClick, onItemMouseEnter: _onItemMouseEnter, registerElement } = menu, onItemMouseEnter = _onItemMouseEnter ?? menu.onItemMouseEnter, [rootElement, setRootElement] = useState(null), [open, setOpen] = useState(!1), [shouldFocus, setShouldFocus] = useState(null), active = !!activeElement && activeElement === rootElement, [withinMenu, setWithinMenu] = useState(!1), t6;
@@ -3166,12 +3077,7 @@ function MenuGroupComponent(props) {
 		open,
 		children: t31
 	}), $[77] = childMenu, $[78] = open, $[79] = popover, $[80] = t31, $[81] = t32) : t32 = $[81], t32;
-}
-MenuGroupComponent.displayName = "MenuGroup";
-/**
-* @public
-*/
-const MenuGroup = MenuGroupComponent, MenuItemComponent = forwardRef(function(props, forwardedRef) {
+}, MenuItem = forwardRef(function MenuItem(props, forwardedRef) {
 	let $ = c(76), IconComponent, IconRightComponent, children, disabled, gap, hotkeys, onClick, paddingBottom, paddingLeft, paddingRight, paddingTop, paddingX, paddingY, pressed, restProps, selectedProp, t0, t1, t2, t3, t4, t5, text;
 	$[0] === props ? (IconComponent = $[1], IconRightComponent = $[2], children = $[3], disabled = $[4], gap = $[5], hotkeys = $[6], onClick = $[7], paddingBottom = $[8], paddingLeft = $[9], paddingRight = $[10], paddingTop = $[11], paddingX = $[12], paddingY = $[13], pressed = $[14], restProps = $[15], selectedProp = $[16], t0 = $[17], t1 = $[18], t2 = $[19], t3 = $[20], t4 = $[21], t5 = $[22], text = $[23]) : ({as: t0, children, disabled, fontSize: t1, hotkeys, icon: IconComponent, iconRight: IconRightComponent, onClick, padding: t2, paddingX, paddingY, paddingTop, paddingRight, paddingBottom, paddingLeft, pressed, radius: t3, selected: selectedProp, gap, space: t4, text, tone: t5, ...restProps} = props, $[0] = props, $[1] = IconComponent, $[2] = IconRightComponent, $[3] = children, $[4] = disabled, $[5] = gap, $[6] = hotkeys, $[7] = onClick, $[8] = paddingBottom, $[9] = paddingLeft, $[10] = paddingRight, $[11] = paddingTop, $[12] = paddingX, $[13] = paddingY, $[14] = pressed, $[15] = restProps, $[16] = selectedProp, $[17] = t0, $[18] = t1, $[19] = t2, $[20] = t3, $[21] = t4, $[22] = t5, $[23] = text);
 	let as = t0 === void 0 ? "button" : t0, fontSize = t1 === void 0 ? 1 : t1, padding = t2 === void 0 ? 3 : t2, radius = t3 === void 0 ? 2 : t3, deprecated_space = t4 === void 0 ? 3 : t4, tone = t5 === void 0 ? "default" : t5, spacing = gap === void 0 ? deprecated_space : gap, { scheme } = useRootTheme(), menu = useMenu(), { activeElement, mount, onItemClick, onItemMouseEnter: _onItemMouseEnter, onItemMouseLeave: _onItemMouseLeave } = menu, onItemMouseEnter = _onItemMouseEnter ?? menu.onItemMouseEnter, onItemMouseLeave = _onItemMouseLeave ?? menu.onItemMouseLeave, [rootElement, setRootElement] = useState(null), active = !!activeElement && activeElement === rootElement, ref = useRef(null), t6;
@@ -3269,18 +3175,13 @@ const MenuGroup = MenuGroupComponent, MenuItemComponent = forwardRef(function(pr
 		children: [t20, t21]
 	}), $[60] = as, $[61] = disabled, $[62] = handleClick, $[63] = onItemMouseEnter, $[64] = onItemMouseLeave, $[65] = restProps, $[66] = scheme, $[67] = t13, $[68] = t14, $[69] = t15, $[70] = t16, $[71] = t18, $[72] = t19, $[73] = t20, $[74] = t21, $[75] = t22) : t22 = $[75], t22;
 });
-MenuItemComponent.displayName = "ForwardRef(MenuItem)";
-/**
-* @public
-*/
-const MenuItem = MenuItemComponent;
 function _temp(s) {
 	return s - 1;
 }
 const CustomButton = styled(Button).withConfig({
 	displayName: "CustomButton",
-	componentId: "sc-epil5s-0"
-})`max-width:100%;`, Tab = forwardRef(function(props, forwardedRef) {
+	componentId: "sc-rhibqq-0"
+})`max-width:100%;`, Tab = forwardRef(function Tab(props, forwardedRef) {
 	let $ = c(30), focused, icon, id, label, onClick, onFocus, restProps, selected, t0, t1;
 	$[0] === props ? (focused = $[1], icon = $[2], id = $[3], label = $[4], onClick = $[5], onFocus = $[6], restProps = $[7], selected = $[8], t0 = $[9], t1 = $[10]) : ({icon, id, focused, fontSize: t0, label, onClick, onFocus, padding: t1, selected, ...restProps} = props, $[0] = props, $[1] = focused, $[2] = icon, $[3] = id, $[4] = label, $[5] = onClick, $[6] = onFocus, $[7] = restProps, $[8] = selected, $[9] = t0, $[10] = t1);
 	let fontSize = t0 === void 0 ? 1 : t0, padding = t1 === void 0 ? 2 : t1, ref = useRef(null), focusedRef = useRef(!1), t2;
@@ -3317,12 +3218,10 @@ const CustomButton = styled(Button).withConfig({
 		text: label,
 		type: "button"
 	}), $[18] = fontSize, $[19] = handleFocus, $[20] = icon, $[21] = id, $[22] = label, $[23] = onClick, $[24] = padding, $[25] = restProps, $[26] = selected, $[27] = t7, $[28] = t8, $[29] = t9) : t9 = $[29], t9;
-});
-Tab.displayName = "ForwardRef(Tab)";
-const CustomInline = styled(Inline).withConfig({
+}), CustomInline = styled(Inline).withConfig({
 	displayName: "CustomInline",
-	componentId: "sc-k5whbp-0"
-})`& > div{display:inline-block;vertical-align:middle;max-width:100%;box-sizing:border-box;}`, TabList = forwardRef(function(props, ref) {
+	componentId: "sc-40huc5-0"
+})`& > div{display:inline-block;vertical-align:middle;max-width:100%;box-sizing:border-box;}`, TabList = forwardRef(function TabList(props, ref) {
 	let $ = c(15), childrenProp, restProps;
 	$[0] === props ? (childrenProp = $[1], restProps = $[2]) : ({children: childrenProp, ...restProps} = props, $[0] = props, $[1] = childrenProp, $[2] = restProps);
 	let [focusedIndex, setFocusedIndex] = useState(-1), t0;
@@ -3348,7 +3247,6 @@ const CustomInline = styled(Inline).withConfig({
 		children: tabs
 	}), $[10] = handleKeyDown, $[11] = ref, $[12] = restProps, $[13] = tabs, $[14] = t2) : t2 = $[14], t2;
 });
-TabList.displayName = "ForwardRef(TabList)";
 export { responsiveInputPaddingStyle as $, useMediaIndex as A, parseColor as At, _cardColorStyle as B, BoundaryElementContext as C, isHTMLTextAreaElement as Ct, Grid as D, hexToRgb as Dt, Inline as E, createColorTheme as Et, _ResizeObserver as F, studioTheme as Ft, SpanWithTextOverflow as G, Flex as H, useCustomValidity as I, textInputBaseStyle as J, responsiveRadiusStyle as K, useClickOutsideEvent as L, useGlobalKeyDown as M, rgbToHsl as Mt, useElementSize as N, rgba as Nt, usePrefersReducedMotion as O, hslToRgb as Ot, _elementSizeObserver as P, screen as Pt, responsiveInputPaddingIconRightStyle as Q, Card as R, isRecord as S, isHTMLSelectElement as St, KBD as T, EMPTY_RECORD as Tt, Text as U, Spinner as V, Box as W, textInputRepresentationStyle as X, textInputFontSizeStyle as Y, textInputRootStyle as Z, usePortal as _, containsOrEqualsElement as _t, MenuDivider as a, useRootTheme as at, LayerProvider as b, isHTMLElement as bt, Tooltip as c, responsiveTextFont as ct, useDelayedState as d, _fillCSSObject as dt, focusRingBorderStyle as et, TextInput as f, _getArrayProp as ft, Portal as g, _isEnterToClickElement as gt, PortalProvider as h, rem as ht, MenuGroup as i, ThemeColorProvider as it, useMatchMedia as j, rgbToHex as jt, usePrefersDark as k, multiply as kt, useTooltipDelayGroup as l, responsiveTextAlignStyle as lt, Popover as m, _responsive as mt, Tab as n, useTheme$1 as nt, Menu as o, ThemeProvider$1 as ot, Stack as p, _getResponsiveSpace as pt, responsivePaddingStyle as q, MenuItem as r, useTheme_v2 as rt, Hotkeys as s, createGlobalScopedContext as st, TabList as t, focusRingStyle as tt, TooltipDelayGroupContext as u, responsiveFont as ut, Layer as v, isHTMLAnchorElement as vt, Arrow as w, EMPTY_ARRAY as wt, useBoundaryElement as x, isHTMLInputElement as xt, useLayer as y, isHTMLButtonElement as yt, Button as z };
 
 //# sourceMappingURL=tabList.mjs.map