@sanity/ui 4.0.0-static.34 → 4.0.0-static.35

package/dist/index.d.ts

@@ -41,7 +41,7 @@ import type {Radius} from '@sanity/ui/theme'
 import {RadiusStyleProps} from '@sanity/ui/css'
 import {ReactElement} from 'react'
 import {ReactNode} from 'react'
-import type {ReactPortal} from 'react'
+import {ReactPortal} from 'react'
 import {Ref} from 'react'
 import {RefAttributes} from 'react'
 import {ResponsiveProp} from '@sanity/ui/css'
@@ -359,10 +359,7 @@ export declare interface BaseAutocompleteOption {
 }
 
 /** @public */
-export declare interface BoundaryElementContextValue {
-  version: 0.0
-  element: HTMLElement | null
-}
+export declare type BoundaryElementContextValue = HTMLElement | null
 
 /** @public */
 export declare function BoundaryElementProvider(
@@ -2364,7 +2361,10 @@ export declare interface TreeState {
 }
 
 /** @public */
-export declare function useBoundaryElement(): BoundaryElementContextValue
+export declare function useBoundaryElement(): {
+  version: 0.0
+  element: BoundaryElementContextValue
+}
 
 /** @public */
 export declare function useCard(): CardContextValue

package/dist/index.js

@@ -487,16 +487,7 @@ function createGlobalScopedContext(key2, defaultValue) {
   const symbolMap = globalScope;
   return symbolMap[symbol] = symbolMap[symbol] || createContext(defaultValue), symbolMap[symbol];
 }
-const BoundaryElementContext = createGlobalScopedContext("@sanity/ui/v4/boundaryElement", null), DEFAULT_VALUE = {
-  version: 0,
-  element: null
-};
-function useBoundaryElement() {
-  const value = use(BoundaryElementContext);
-  if (value && (!isRecord(value) || value.version !== 0))
-    throw new Error("useBoundaryElement(): the context value is not compatible");
-  return value || DEFAULT_VALUE;
-}
+const BoundaryElementContext = createGlobalScopedContext("@sanity/ui/v4/boundaryElement", null);
 function getElementRef(element) {
   let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
   return mayWarn ? element.ref : (getter = Object.getOwnPropertyDescriptor(element, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning, mayWarn ? element.props.ref : element.props.ref || element.ref);
@@ -520,9 +511,13 @@ function CardProvider(props) {
 }
 function useCard() {
   const card2 = use(CardContext);
+  return assertCardContext(card2), card2;
+}
+function assertCardContext(card2) {
   if (!card2)
-    throw new Error("useCard(): missing context value");
-  return card2;
+    throw new Error("useCard(): missing context value", {
+      cause: card2
+    });
 }
 const key = "@sanity/ui/v4/portal", elementKey = Symbol.for(`${key}/element`), elementMap = globalScope;
 elementMap[elementKey] = null;
@@ -535,19 +530,23 @@ const defaultContextValue = {
 }, PortalContext = createGlobalScopedContext(key, defaultContextValue);
 function usePortal() {
   const value = use(PortalContext);
+  return assertPortalContext(value), value;
+}
+function assertPortalContext(value) {
   if (!value)
     throw new Error("usePortal(): missing context value");
   if (!isRecord(value) || value.version !== 0)
     throw new Error("usePortal(): the context value is not compatible");
-  return value;
 }
 function Portal(props) {
   const $ = c(6), {
     children,
     __unstable_name: name
-  } = props, card2 = useCard(), portal = usePortal(), portalElement = (name ? portal.elements && portal.elements[name] : portal.element) || portal.elements?.default;
+  } = props, portal = usePortal(), portalElement = (name ? portal.elements && portal.elements[name] : portal.element) || portal.elements?.default;
   if (!portalElement)
     return null;
+  const card2 = use(CardContext);
+  assertCardContext(card2);
   let t0;
   $[0] !== card2.scheme || $[1] !== children ? (t0 = /* @__PURE__ */ jsx(CardProvider, { tone: "transparent", scheme: card2.scheme, children }), $[0] = card2.scheme, $[1] = children, $[2] = t0) : t0 = $[2];
   let t1;
@@ -1036,7 +1035,7 @@ function ViewportOverlay() {
   } }), $[0] = zIndex, $[1] = t0) : t0 = $[1], t0;
 }
 function Popover(props) {
-  const $ = c(113), boundaryElementContext = useBoundaryElement(), t0 = props;
+  const $ = c(113), t0 = props;
   let _fallbackPlacements, _floatingBoundary, _referenceBoundary, childProp, className, content2, disabled, forwardedRef, matchReferenceWidth, modal, open, padding, portal, referenceElement, rest, scheme, t1, t10, t11, t12, t13, t14, t2, t3, t4, t5, t6, t7, t8, t9, updateRef;
   if ($[0] !== t0) {
     const {
@@ -1058,7 +1057,7 @@ function Popover(props) {
       overflow: t292,
       padding: t302,
       placement: t312,
-      placementStrategy: t322,
+      placementStrategy: t32,
       portal: t33,
       preventOverflow: t34,
       radius: t35,
@@ -1073,10 +1072,10 @@ function Popover(props) {
       updateRef: t44,
       ...t45
     } = t0;
-    t1 = t152, t2 = t162, t3 = t172, t4 = t182, childProp = t192, className = t202, t5 = t212, content2 = t222, disabled = t232, _fallbackPlacements = t242, matchReferenceWidth = t252, _floatingBoundary = t262, modal = t272, open = t282, t6 = t292, padding = t302, t7 = t312, t8 = t322, portal = t33, t9 = t34, t10 = t35, forwardedRef = t36, _referenceBoundary = t37, referenceElement = t38, scheme = t39, t11 = t40, t12 = t41, t13 = t42, t14 = t43, updateRef = t44, rest = t45, $[0] = t0, $[1] = _fallbackPlacements, $[2] = _floatingBoundary, $[3] = _referenceBoundary, $[4] = childProp, $[5] = className, $[6] = content2, $[7] = disabled, $[8] = forwardedRef, $[9] = matchReferenceWidth, $[10] = modal, $[11] = open, $[12] = padding, $[13] = portal, $[14] = referenceElement, $[15] = rest, $[16] = scheme, $[17] = t1, $[18] = t10, $[19] = t11, $[20] = t12, $[21] = t13, $[22] = t14, $[23] = t2, $[24] = t3, $[25] = t4, $[26] = t5, $[27] = t6, $[28] = t7, $[29] = t8, $[30] = t9, $[31] = updateRef;
+    t1 = t152, t2 = t162, t3 = t172, t4 = t182, childProp = t192, className = t202, t5 = t212, content2 = t222, disabled = t232, _fallbackPlacements = t242, matchReferenceWidth = t252, _floatingBoundary = t262, modal = t272, open = t282, t6 = t292, padding = t302, t7 = t312, t8 = t32, portal = t33, t9 = t34, t10 = t35, forwardedRef = t36, _referenceBoundary = t37, referenceElement = t38, scheme = t39, t11 = t40, t12 = t41, t13 = t42, t14 = t43, updateRef = t44, rest = t45, $[0] = t0, $[1] = _fallbackPlacements, $[2] = _floatingBoundary, $[3] = _referenceBoundary, $[4] = childProp, $[5] = className, $[6] = content2, $[7] = disabled, $[8] = forwardedRef, $[9] = matchReferenceWidth, $[10] = modal, $[11] = open, $[12] = padding, $[13] = portal, $[14] = referenceElement, $[15] = rest, $[16] = scheme, $[17] = t1, $[18] = t10, $[19] = t11, $[20] = t12, $[21] = t13, $[22] = t14, $[23] = t2, $[24] = t3, $[25] = t4, $[26] = t5, $[27] = t6, $[28] = t7, $[29] = t8, $[30] = t9, $[31] = updateRef;
   } else
     _fallbackPlacements = $[1], _floatingBoundary = $[2], _referenceBoundary = $[3], childProp = $[4], className = $[5], content2 = $[6], disabled = $[7], forwardedRef = $[8], matchReferenceWidth = $[9], modal = $[10], open = $[11], padding = $[12], portal = $[13], referenceElement = $[14], rest = $[15], scheme = $[16], t1 = $[17], t10 = $[18], t11 = $[19], t12 = $[20], t13 = $[21], t14 = $[22], t2 = $[23], t3 = $[24], t4 = $[25], t5 = $[26], t6 = $[27], t7 = $[28], t8 = $[29], t9 = $[30], updateRef = $[31];
-  const margins = t1 === void 0 ? DEFAULT_POPOVER_MARGINS : t1, _animate = t2 === void 0 ? !1 : t2, arrowProp = t3 === void 0 ? !1 : t3, as = t4 === void 0 ? DEFAULT_POPOVER_ELEMENT : t4, constrainSize = t5 === void 0 ? !1 : t5, overflow = t6 === void 0 ? "hidden" : t6, placementProp = t7 === void 0 ? "bottom" : t7, placementStrategy = t8 === void 0 ? "flip" : t8, preventOverflow = t9 === void 0 ? !0 : t9, radius = t10 === void 0 ? 3 : t10, shadow = t11 === void 0 ? 3 : t11, tone = t12 === void 0 ? "inherit" : t12, widthProp = t13 === void 0 ? "auto" : t13, zOffsetProp = t14 === void 0 ? Z_OFFSETS.popover : t14, fallbackPlacements = _fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS$1[props.placement ?? "bottom"], floatingBoundary = _floatingBoundary ?? boundaryElementContext.element, referenceBoundary = _referenceBoundary ?? boundaryElementContext.element, card2 = useCard(), animate = usePrefersReducedMotion() ? !1 : _animate;
+  const margins = t1 === void 0 ? DEFAULT_POPOVER_MARGINS : t1, _animate = t2 === void 0 ? !1 : t2, arrowProp = t3 === void 0 ? !1 : t3, as = t4 === void 0 ? DEFAULT_POPOVER_ELEMENT : t4, constrainSize = t5 === void 0 ? !1 : t5, overflow = t6 === void 0 ? "hidden" : t6, placementProp = t7 === void 0 ? "bottom" : t7, placementStrategy = t8 === void 0 ? "flip" : t8, preventOverflow = t9 === void 0 ? !0 : t9, radius = t10 === void 0 ? 3 : t10, shadow = t11 === void 0 ? 3 : t11, tone = t12 === void 0 ? "inherit" : t12, widthProp = t13 === void 0 ? "auto" : t13, zOffsetProp = t14 === void 0 ? Z_OFFSETS.popover : t14, fallbackPlacements = _fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS$1[props.placement ?? "bottom"], floatingBoundary = _floatingBoundary ?? use(BoundaryElementContext), referenceBoundary = _referenceBoundary ?? use(BoundaryElementContext), animate = usePrefersReducedMotion() ? !1 : _animate;
   let t15;
   $[32] !== zOffsetProp ? (t15 = _getResponsiveProp(zOffsetProp), $[32] = zOffsetProp, $[33] = t15) : t15 = $[33];
   const zOffset = t15, ref = useRef(null), arrowRef = useRef(null);
@@ -1165,16 +1164,26 @@ function Popover(props) {
     t28
   ] }), $[97] = t26, $[98] = t28, $[99] = t29) : t29 = $[99];
   const node_0 = t29;
+  let children = open ? node_0 : null;
+  if (open && portal) {
+    let resolvedTone = tone;
+    if (tone === "inherit") {
+      const card2 = use(CardContext);
+      assertCardContext(card2), resolvedTone = card2.tone;
+    }
+    const t302 = typeof portal == "string" ? portal : void 0, t312 = scheme ?? "light";
+    let t32;
+    $[100] !== node_0 || $[101] !== resolvedTone || $[102] !== t312 ? (t32 = /* @__PURE__ */ jsx(CardProvider, { tone: resolvedTone, scheme: t312, children: node_0 }), $[100] = node_0, $[101] = resolvedTone, $[102] = t312, $[103] = t32) : t32 = $[103];
+    let t33;
+    $[104] !== t302 || $[105] !== t32 ? (t33 = /* @__PURE__ */ jsx(Portal, { __unstable_name: t302, children: t32 }), $[104] = t302, $[105] = t32, $[106] = t33) : t33 = $[106], children = t33;
+  }
   let t30;
-  $[100] !== card2 || $[101] !== node_0 || $[102] !== open || $[103] !== portal || $[104] !== scheme || $[105] !== tone ? (t30 = open && (portal ? /* @__PURE__ */ jsx(Portal, { __unstable_name: typeof portal == "string" ? portal : void 0, children: /* @__PURE__ */ jsx(CardProvider, { tone: tone === "inherit" ? card2.tone : tone, scheme: scheme ?? "light", children: node_0 }) }) : node_0), $[100] = card2, $[101] = node_0, $[102] = open, $[103] = portal, $[104] = scheme, $[105] = tone, $[106] = t30) : t30 = $[106];
-  const children = t30;
+  $[107] !== animate || $[108] !== children ? (t30 = animate ? /* @__PURE__ */ jsx(AnimatePresence, { children }) : children, $[107] = animate, $[108] = children, $[109] = t30) : t30 = $[109];
   let t31;
-  $[107] !== animate || $[108] !== children ? (t31 = animate ? /* @__PURE__ */ jsx(AnimatePresence, { children }) : children, $[107] = animate, $[108] = children, $[109] = t31) : t31 = $[109];
-  let t32;
-  return $[110] !== child || $[111] !== t31 ? (t32 = /* @__PURE__ */ jsxs(Fragment, { children: [
-    t31,
+  return $[110] !== child || $[111] !== t30 ? (t31 = /* @__PURE__ */ jsxs(Fragment, { children: [
+    t30,
     child
-  ] }), $[110] = child, $[111] = t31, $[112] = t32) : t32 = $[112], t32;
+  ] }), $[110] = child, $[111] = t30, $[112] = t31) : t31 = $[112], t31;
 }
 function useMiddleware$1(t0) {
   const $ = c(36), {
@@ -2029,9 +2038,9 @@ function DialogCard(props) {
     ref: forwardedRef,
     ...rest
   } = t0, $[0] = t0, $[1] = autoFocus, $[2] = children, $[3] = footer, $[4] = forwardedContentRef, $[5] = forwardedRef, $[6] = header, $[7] = hideCloseButton, $[8] = id, $[9] = onClickOutside, $[10] = onClose, $[11] = portalProp, $[12] = rest, $[13] = t1) : (autoFocus = $[1], children = $[2], footer = $[3], forwardedContentRef = $[4], forwardedRef = $[5], header = $[6], hideCloseButton = $[7], id = $[8], onClickOutside = $[9], onClose = $[10], portalProp = $[11], rest = $[12], t1 = $[13]);
-  const as = t1 === void 0 ? DEFAULT_DIALOG_CARD_ELEMENT : t1, portal = usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = useBoundaryElement().element, ref = useRef(null), contentRef = useRef(null), layer = useLayer(), {
+  const as = t1 === void 0 ? DEFAULT_DIALOG_CARD_ELEMENT : t1, portal = usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = use(BoundaryElementContext), ref = useRef(null), contentRef = useRef(null), {
     isTopLayer
-  } = layer, labelId = `${id}_label`, showCloseButton = !!onClose && hideCloseButton === !1, showHeader = !!header || showCloseButton, [scrollTop, setScrollTop] = useState(0), [scrollHeight, setScrollHeight] = useState(0), scrollBottom = scrollHeight - scrollTop;
+  } = useLayer(), labelId = `${id}_label`, showCloseButton = !!onClose && hideCloseButton === !1, showHeader = !!header || showCloseButton, [scrollTop, setScrollTop] = useState(0), [scrollHeight, setScrollHeight] = useState(0), scrollBottom = scrollHeight - scrollTop;
   let t2;
   $[14] === Symbol.for("react.memo_cache_sentinel") ? (t2 = () => ref.current, $[14] = t2) : t2 = $[14], useImperativeHandle(forwardedRef, t2);
   let t3;
@@ -2139,7 +2148,7 @@ function Dialog(props) {
     tone,
     ...rest
   } = t0, $[0] = t0, $[1] = _positionProp, $[2] = _zOffsetProp, $[3] = children, $[4] = className, $[5] = contentRef, $[6] = footer, $[7] = header, $[8] = id, $[9] = onActivate, $[10] = onClickOutside, $[11] = onClose, $[12] = onFocus, $[13] = portalProp, $[14] = rest, $[15] = scheme, $[16] = t1, $[17] = t2, $[18] = t3, $[19] = t4, $[20] = t5, $[21] = t6, $[22] = t7, $[23] = tone) : (_positionProp = $[1], _zOffsetProp = $[2], children = $[3], className = $[4], contentRef = $[5], footer = $[6], header = $[7], id = $[8], onActivate = $[9], onClickOutside = $[10], onClose = $[11], onFocus = $[12], portalProp = $[13], rest = $[14], scheme = $[15], t1 = $[16], t2 = $[17], t3 = $[18], t4 = $[19], t5 = $[20], t6 = $[21], t7 = $[22], tone = $[23]);
-  const autoFocus = t1 === void 0 ? !0 : t1, hideCloseButton = t2 === void 0 ? !1 : t2, _animate = t3 === void 0 ? !1 : t3, cardRadiusProp = t4 === void 0 ? 4 : t4, padding = t5 === void 0 ? 3 : t5, cardShadow = t6 === void 0 ? 4 : t6, width = t7 === void 0 ? 0 : t7, positionProp = _positionProp ?? context.position ?? "fixed", zOffsetProp = _zOffsetProp ?? context.zOffset ?? Z_OFFSETS.dialog, animate = usePrefersReducedMotion() ? !1 : _animate, portal = usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = useBoundaryElement().element;
+  const autoFocus = t1 === void 0 ? !0 : t1, hideCloseButton = t2 === void 0 ? !1 : t2, _animate = t3 === void 0 ? !1 : t3, cardRadiusProp = t4 === void 0 ? 4 : t4, padding = t5 === void 0 ? 3 : t5, cardShadow = t6 === void 0 ? 4 : t6, width = t7 === void 0 ? 0 : t7, positionProp = _positionProp ?? context.position ?? "fixed", zOffsetProp = _zOffsetProp ?? context.zOffset ?? Z_OFFSETS.dialog, animate = usePrefersReducedMotion() ? !1 : _animate, portal = usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = use(BoundaryElementContext);
   let t8;
   $[24] !== cardRadiusProp ? (t8 = _getResponsiveProp(cardRadiusProp), $[24] = cardRadiusProp, $[25] = t8) : t8 = $[25];
   const cardRadius = t8;
@@ -4436,9 +4445,6 @@ const DEFAULT_TOOLTIP_ARROW_WIDTH = 15, DEFAULT_TOOLTIP_ARROW_HEIGHT = 6, DEFAUL
   "right-start": ["right", "right-end", "left-start", "top-start", "bottom-start"],
   "right-end": ["right", "right-start", "left-end", "top-end", "bottom-end"]
 }, TooltipDelayGroupContext = createGlobalScopedContext("@sanity/ui/v4/tooltipDelayGroup", null);
-function useTooltipDelayGroup() {
-  return use(TooltipDelayGroupContext);
-}
 function TooltipLayer(props) {
   const $ = c(50);
   let animate, arrow2, arrowRef, arrowX, arrowY, children, originX, originY, padding, placement, radius, rest, scheme, shadow, style, t0;
@@ -4493,7 +4499,7 @@ function TooltipLayer(props) {
 }
 const DEFAULT_TOOLTIP_ELEMENT = "div";
 function Tooltip(props) {
-  const $ = c(143), boundaryElementContext = useBoundaryElement(), t0 = props;
+  const $ = c(143), t0 = props;
   let _boundaryElement, _fallbackPlacements, childProp, className, content2, delay, disabled, forwardedRef, portalProp, rest, scheme, t1, t2, t3, t4, t5, t6, t7, t8, t9;
   $[0] !== t0 ? ({
     animate: t1,
@@ -4517,10 +4523,14 @@ function Tooltip(props) {
     tone: t9,
     ...rest
   } = t0, $[0] = t0, $[1] = _boundaryElement, $[2] = _fallbackPlacements, $[3] = childProp, $[4] = className, $[5] = content2, $[6] = delay, $[7] = disabled, $[8] = forwardedRef, $[9] = portalProp, $[10] = rest, $[11] = scheme, $[12] = t1, $[13] = t2, $[14] = t3, $[15] = t4, $[16] = t5, $[17] = t6, $[18] = t7, $[19] = t8, $[20] = t9) : (_boundaryElement = $[1], _fallbackPlacements = $[2], childProp = $[3], className = $[4], content2 = $[5], delay = $[6], disabled = $[7], forwardedRef = $[8], portalProp = $[9], rest = $[10], scheme = $[11], t1 = $[12], t2 = $[13], t3 = $[14], t4 = $[15], t5 = $[16], t6 = $[17], t7 = $[18], t8 = $[19], t9 = $[20]);
-  const _animate = t1 === void 0 ? !1 : t1, arrowProp = t2 === void 0 ? !1 : t2, as = t3 === void 0 ? DEFAULT_TOOLTIP_ELEMENT : t3, padding = t4 === void 0 ? 2 : t4, placementProp = t5 === void 0 ? "bottom" : t5, radius = t6 === void 0 ? 3 : t6, shadow = t7 === void 0 ? 2 : t7, zOffset = t8 === void 0 ? Z_OFFSETS.tooltip : t8, tone = t9 === void 0 ? "inherit" : t9, boundaryElement = _boundaryElement ?? boundaryElementContext?.element, fallbackPlacements = _fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS[props.placement ?? "bottom"], card2 = useCard(), animate = usePrefersReducedMotion() ? !1 : _animate, ref = useRef(null), [referenceElement, setReferenceElement] = useState(null), arrowRef = useRef(null), [tooltipMaxWidth, setTooltipMaxWidth] = useState(0);
+  const _animate = t1 === void 0 ? !1 : t1, arrowProp = t2 === void 0 ? !1 : t2, as = t3 === void 0 ? DEFAULT_TOOLTIP_ELEMENT : t3, padding = t4 === void 0 ? 2 : t4, placementProp = t5 === void 0 ? "bottom" : t5, radius = t6 === void 0 ? 3 : t6, shadow = t7 === void 0 ? 2 : t7, zOffset = t8 === void 0 ? Z_OFFSETS.tooltip : t8, tone = t9 === void 0 ? "inherit" : t9, boundaryElement = _boundaryElement ?? use(BoundaryElementContext), fallbackPlacements = _fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS[props.placement ?? "bottom"], animate = usePrefersReducedMotion() ? !1 : _animate, ref = useRef(null), [referenceElement, setReferenceElement] = useState(null), arrowRef = useRef(null), [tooltipMaxWidth, setTooltipMaxWidth] = useState(0);
   let t10;
   $[21] === Symbol.for("react.memo_cache_sentinel") ? (t10 = () => ref.current, $[21] = t10) : t10 = $[21], useImperativeHandle(forwardedRef, t10);
-  const portal = usePortal(), portalElement = typeof portalProp == "string" ? portal.elements?.[portalProp] || null : portal.element;
+  let portalElement = null;
+  if (portalProp) {
+    const portal = use(PortalContext);
+    assertPortalContext(portal), portalElement = typeof portalProp == "string" ? portal.elements?.[portalProp] || null : portal.element;
+  }
   let t11;
   $[22] !== animate || $[23] !== arrowProp || $[24] !== boundaryElement || $[25] !== fallbackPlacements ? (t11 = {
     animate,
@@ -4549,7 +4559,7 @@ function Tooltip(props) {
     middlewareData,
     refs,
     update
-  } = useFloating(t13), arrowX = middlewareData.arrow?.x, arrowY = middlewareData.arrow?.y, originX = middlewareData["@sanity/ui/origin"]?.originX, originY = middlewareData["@sanity/ui/origin"]?.originY, tooltipId = useId(), [isOpen, setIsOpen] = useDelayedState(!1), delayGroupContext = useTooltipDelayGroup();
+  } = useFloating(t13), arrowX = middlewareData.arrow?.x, arrowY = middlewareData.arrow?.y, originX = middlewareData["@sanity/ui/origin"]?.originX, originY = middlewareData["@sanity/ui/origin"]?.originY, tooltipId = useId(), [isOpen, setIsOpen] = useDelayedState(!1), delayGroupContext = use(TooltipDelayGroupContext);
   let t14;
   $[33] !== delayGroupContext ? (t14 = delayGroupContext || {}, $[33] = delayGroupContext, $[34] = t14) : t14 = $[34];
   const {
@@ -4627,10 +4637,10 @@ function Tooltip(props) {
     };
   }, t28 = [handleIsOpenChange, showTooltip], $[76] = handleIsOpenChange, $[77] = showTooltip, $[78] = t27, $[79] = t28) : (t27 = $[78], t28 = $[79]), useEffect(t27, t28);
   let t29;
-  $[80] !== boundaryElement || $[81] !== portalElement?.offsetWidth ? (t29 = () => {
+  $[80] !== boundaryElement || $[81] !== portalElement ? (t29 = () => {
     const availableWidths = [...boundaryElement ? [boundaryElement.offsetWidth] : [], portalElement?.offsetWidth || document.body.offsetWidth];
     setTooltipMaxWidth(Math.min(...availableWidths) - DEFAULT_TOOLTIP_PADDING * 2);
-  }, $[80] = boundaryElement, $[81] = portalElement?.offsetWidth, $[82] = t29) : t29 = $[82];
+  }, $[80] = boundaryElement, $[81] = portalElement, $[82] = t29) : t29 = $[82];
   let t30;
   $[83] !== boundaryElement || $[84] !== portalElement ? (t30 = [boundaryElement, portalElement], $[83] = boundaryElement, $[84] = portalElement, $[85] = t30) : t30 = $[85], useLayoutEffect(t29, t30);
   let t31;
@@ -4683,16 +4693,26 @@ function Tooltip(props) {
   let t40;
   $[109] !== animate || $[110] !== arrowProp || $[111] !== arrowX || $[112] !== arrowY || $[113] !== as || $[114] !== content2 || $[115] !== originX || $[116] !== originY || $[117] !== padding || $[118] !== placement || $[119] !== radius || $[120] !== rest || $[121] !== scheme || $[122] !== setArrow || $[123] !== setFloating || $[124] !== shadow || $[125] !== t37 || $[126] !== t39 || $[127] !== tone || $[128] !== zOffset ? (t40 = /* @__PURE__ */ jsx(TooltipLayer, { "data-ui": "Tooltip", ...rest, animate, arrow: arrowProp, arrowRef: setArrow, arrowX, arrowY, as, className: t37, originX, originY, padding, placement, radius, ref: setFloating, scheme, shadow, style: t39, tone, zOffset, children: content2 }), $[109] = animate, $[110] = arrowProp, $[111] = arrowX, $[112] = arrowY, $[113] = as, $[114] = content2, $[115] = originX, $[116] = originY, $[117] = padding, $[118] = placement, $[119] = radius, $[120] = rest, $[121] = scheme, $[122] = setArrow, $[123] = setFloating, $[124] = shadow, $[125] = t37, $[126] = t39, $[127] = tone, $[128] = zOffset, $[129] = t40) : t40 = $[129];
   const node_0 = t40;
+  let children = showTooltip ? node_0 : null;
+  if (showTooltip && portalProp) {
+    let resolvedTone = tone;
+    if (tone === "inherit") {
+      const card2 = use(CardContext);
+      assertCardContext(card2), resolvedTone = card2.tone;
+    }
+    const t412 = typeof portalProp == "string" ? portalProp : void 0, t422 = scheme ?? "light";
+    let t43;
+    $[130] !== node_0 || $[131] !== resolvedTone || $[132] !== t422 ? (t43 = /* @__PURE__ */ jsx(CardProvider, { tone: resolvedTone, scheme: t422, children: node_0 }), $[130] = node_0, $[131] = resolvedTone, $[132] = t422, $[133] = t43) : t43 = $[133];
+    let t44;
+    $[134] !== t412 || $[135] !== t43 ? (t44 = /* @__PURE__ */ jsx(Portal, { __unstable_name: t412, children: t43 }), $[134] = t412, $[135] = t43, $[136] = t44) : t44 = $[136], children = t44;
+  }
   let t41;
-  $[130] !== card2 || $[131] !== node_0 || $[132] !== portalProp || $[133] !== scheme || $[134] !== showTooltip || $[135] !== tone ? (t41 = showTooltip && (portalProp ? /* @__PURE__ */ jsx(Portal, { __unstable_name: typeof portalProp == "string" ? portalProp : void 0, children: /* @__PURE__ */ jsx(CardProvider, { tone: tone === "inherit" ? card2.tone : tone, scheme: scheme ?? "light", children: node_0 }) }) : node_0), $[130] = card2, $[131] = node_0, $[132] = portalProp, $[133] = scheme, $[134] = showTooltip, $[135] = tone, $[136] = t41) : t41 = $[136];
-  const children = t41;
+  $[137] !== animate || $[138] !== children ? (t41 = animate ? /* @__PURE__ */ jsx(AnimatePresence, { children }) : children, $[137] = animate, $[138] = children, $[139] = t41) : t41 = $[139];
   let t42;
-  $[137] !== animate || $[138] !== children ? (t42 = animate ? /* @__PURE__ */ jsx(AnimatePresence, { children }) : children, $[137] = animate, $[138] = children, $[139] = t42) : t42 = $[139];
-  let t43;
-  return $[140] !== child || $[141] !== t42 ? (t43 = /* @__PURE__ */ jsxs(Fragment, { children: [
-    t42,
+  return $[140] !== child || $[141] !== t41 ? (t42 = /* @__PURE__ */ jsxs(Fragment, { children: [
+    t41,
     child
-  ] }), $[140] = child, $[141] = t42, $[142] = t43) : t43 = $[142], t43;
+  ] }), $[140] = child, $[141] = t41, $[142] = t42) : t42 = $[142], t42;
 }
 function useMiddleware(t0) {
   const $ = c(17), {
@@ -4777,19 +4797,24 @@ function TooltipDelayGroupProvider(props) {
   let t2;
   return $[6] !== children || $[7] !== value ? (t2 = /* @__PURE__ */ jsx(TooltipDelayGroupContext, { value, children }), $[6] = children, $[7] = value, $[8] = t2) : t2 = $[8], t2;
 }
+function useTooltipDelayGroup() {
+  return use(TooltipDelayGroupContext);
+}
 function BoundaryElementProvider(props) {
-  const $ = c(5), {
+  const $ = c(3), {
     children,
     element
   } = props;
   let t0;
-  $[0] !== element ? (t0 = {
+  return $[0] !== children || $[1] !== element ? (t0 = /* @__PURE__ */ jsx(BoundaryElementContext, { value: element, children }), $[0] = children, $[1] = element, $[2] = t0) : t0 = $[2], t0;
+}
+function useBoundaryElement() {
+  const $ = c(2), element = use(BoundaryElementContext);
+  let t0;
+  return $[0] !== element ? (t0 = {
     version: 0,
     element
-  }, $[0] = element, $[1] = t0) : t0 = $[1];
-  const value = t0;
-  let t1;
-  return $[2] !== children || $[3] !== value ? (t1 = /* @__PURE__ */ jsx(BoundaryElementContext, { value, children }), $[2] = children, $[3] = value, $[4] = t1) : t1 = $[4], t1;
+  }, $[0] = element, $[1] = t0) : t0 = $[1], t0;
 }
 function findMaxBreakpoints(media2, width) {
   const ret = [];