@sanity/ui 2.9.0-canary.4 → 2.9.0-canary.5

package/dist/index.js

@@ -3757,8 +3757,8 @@ const MotionCard$1 = styledComponents.styled(framerMotion.motion(Card))`
     will-change: opacity;
   }
 `, PopoverCard = react.memo(react.forwardRef(function(props, ref) {
-  const $ = reactCompilerRuntime.c(60);
-  let marginsProp, xProp, yProp, animate, originX, originY, strategy, style, width, arrowX, arrowY, restProps, padding, children, overflow, arrow, arrowRef, placement, radius, scheme, shadow, tone;
+  const $ = reactCompilerRuntime.c(58);
+  let marginsProp, xProp, yProp, animate, originX, originY, strategy, style, arrowX, arrowY, restProps, padding, children, overflow, arrow, arrowRef, placement, radius, scheme, shadow, tone;
   $[0] !== props ? ({
     __unstable_margins: marginsProp,
     animate,
@@ -3778,11 +3778,10 @@ const MotionCard$1 = styledComponents.styled(framerMotion.motion(Card))`
     strategy,
     style,
     tone,
-    width,
     x: xProp,
     y: yProp,
     ...restProps
-  } = props, $[0] = props, $[1] = marginsProp, $[2] = xProp, $[3] = yProp, $[4] = animate, $[5] = originX, $[6] = originY, $[7] = strategy, $[8] = style, $[9] = width, $[10] = arrowX, $[11] = arrowY, $[12] = restProps, $[13] = padding, $[14] = children, $[15] = overflow, $[16] = arrow, $[17] = arrowRef, $[18] = placement, $[19] = radius, $[20] = scheme, $[21] = shadow, $[22] = tone) : (marginsProp = $[1], xProp = $[2], yProp = $[3], animate = $[4], originX = $[5], originY = $[6], strategy = $[7], style = $[8], width = $[9], arrowX = $[10], arrowY = $[11], restProps = $[12], padding = $[13], children = $[14], overflow = $[15], arrow = $[16], arrowRef = $[17], placement = $[18], radius = $[19], scheme = $[20], shadow = $[21], tone = $[22]);
+  } = props, $[0] = props, $[1] = marginsProp, $[2] = xProp, $[3] = yProp, $[4] = animate, $[5] = originX, $[6] = originY, $[7] = strategy, $[8] = style, $[9] = arrowX, $[10] = arrowY, $[11] = restProps, $[12] = padding, $[13] = children, $[14] = overflow, $[15] = arrow, $[16] = arrowRef, $[17] = placement, $[18] = radius, $[19] = scheme, $[20] = shadow, $[21] = tone) : (marginsProp = $[1], xProp = $[2], yProp = $[3], animate = $[4], originX = $[5], originY = $[6], strategy = $[7], style = $[8], arrowX = $[9], arrowY = $[10], restProps = $[11], padding = $[12], children = $[13], overflow = $[14], arrow = $[15], arrowRef = $[16], placement = $[17], radius = $[18], scheme = $[19], shadow = $[20], tone = $[21]);
   const {
     zIndex
   } = useLayer();
@@ -3792,139 +3791,163 @@ const MotionCard$1 = styledComponents.styled(framerMotion.motion(Card))`
   let t1;
   const t2 = animate ? "transform" : void 0;
   let t3;
-  $[23] !== x || $[24] !== originX || $[25] !== originY || $[26] !== strategy || $[27] !== y || $[28] !== width || $[29] !== zIndex || $[30] !== t2 || $[31] !== style ? (t3 = {
+  $[22] !== x || $[23] !== originX || $[24] !== originY || $[25] !== strategy || $[26] !== y || $[27] !== zIndex || $[28] !== t2 || $[29] !== style ? (t3 = {
     left: x,
     originX,
     originY,
     position: strategy,
     top: y,
-    width,
     zIndex,
     willChange: t2,
     ...style
-  }, $[23] = x, $[24] = originX, $[25] = originY, $[26] = strategy, $[27] = y, $[28] = width, $[29] = zIndex, $[30] = t2, $[31] = style, $[32] = t3) : t3 = $[32], t1 = t3;
+  }, $[22] = x, $[23] = originX, $[24] = originY, $[25] = strategy, $[26] = y, $[27] = zIndex, $[28] = t2, $[29] = style, $[30] = t3) : t3 = $[30], t1 = t3;
   const rootStyle2 = t1;
   let t4;
   const t5 = arrowX !== null ? arrowX : void 0, t6 = arrowY !== null ? arrowY : void 0;
   let t7;
-  $[33] !== t5 || $[34] !== t6 ? (t7 = {
+  $[31] !== t5 || $[32] !== t6 ? (t7 = {
     left: t5,
     top: t6,
     right: void 0,
     bottom: void 0
-  }, $[33] = t5, $[34] = t6, $[35] = t7) : t7 = $[35], t4 = t7;
+  }, $[31] = t5, $[32] = t6, $[33] = t7) : t7 = $[33], t4 = t7;
   const arrowStyle = t4, t8 = restProps;
   let t9;
-  $[36] !== animate ? (t9 = animate ? POPOVER_MOTION_PROPS : {}, $[36] = animate, $[37] = t9) : t9 = $[37];
+  $[34] !== animate ? (t9 = animate ? POPOVER_MOTION_PROPS : {}, $[34] = animate, $[35] = t9) : t9 = $[35];
   let t10;
-  $[38] !== padding || $[39] !== children ? (t10 = /* @__PURE__ */ jsxRuntime.jsx(Flex, { direction: "column", flex: 1, padding, children }), $[38] = padding, $[39] = children, $[40] = t10) : t10 = $[40];
+  $[36] !== padding || $[37] !== children ? (t10 = /* @__PURE__ */ jsxRuntime.jsx(Flex, { direction: "column", flex: 1, padding, children }), $[36] = padding, $[37] = children, $[38] = t10) : t10 = $[38];
   let t11;
-  $[41] !== overflow || $[42] !== t10 ? (t11 = /* @__PURE__ */ jsxRuntime.jsx(Flex, { "data-ui": "Popover__wrapper", direction: "column", flex: 1, overflow, children: t10 }), $[41] = overflow, $[42] = t10, $[43] = t11) : t11 = $[43];
+  $[39] !== overflow || $[40] !== t10 ? (t11 = /* @__PURE__ */ jsxRuntime.jsx(Flex, { "data-ui": "Popover__wrapper", direction: "column", flex: 1, overflow, children: t10 }), $[39] = overflow, $[40] = t10, $[41] = t11) : t11 = $[41];
   let t12;
-  $[44] !== arrow || $[45] !== arrowRef || $[46] !== arrowStyle ? (t12 = arrow && /* @__PURE__ */ jsxRuntime.jsx(Arrow, { ref: arrowRef, style: arrowStyle, width: DEFAULT_POPOVER_ARROW_WIDTH, height: DEFAULT_POPOVER_ARROW_HEIGHT, radius: DEFAULT_POPOVER_ARROW_RADIUS }), $[44] = arrow, $[45] = arrowRef, $[46] = arrowStyle, $[47] = t12) : t12 = $[47];
+  $[42] !== arrow || $[43] !== arrowRef || $[44] !== arrowStyle ? (t12 = arrow && /* @__PURE__ */ jsxRuntime.jsx(Arrow, { ref: arrowRef, style: arrowStyle, width: DEFAULT_POPOVER_ARROW_WIDTH, height: DEFAULT_POPOVER_ARROW_HEIGHT, radius: DEFAULT_POPOVER_ARROW_RADIUS }), $[42] = arrow, $[43] = arrowRef, $[44] = arrowStyle, $[45] = t12) : t12 = $[45];
   let t13;
-  return $[48] !== t8 || $[49] !== placement || $[50] !== radius || $[51] !== ref || $[52] !== scheme || $[53] !== shadow || $[54] !== rootStyle2 || $[55] !== tone || $[56] !== t9 || $[57] !== t11 || $[58] !== t12 ? (t13 = /* @__PURE__ */ jsxRuntime.jsxs(MotionCard$1, { "data-ui": "Popover", ...t8, "data-placement": placement, radius, ref, scheme, shadow, sizing: "border", style: rootStyle2, tone, ...t9, children: [
+  return $[46] !== t8 || $[47] !== placement || $[48] !== radius || $[49] !== ref || $[50] !== scheme || $[51] !== shadow || $[52] !== rootStyle2 || $[53] !== tone || $[54] !== t9 || $[55] !== t11 || $[56] !== t12 ? (t13 = /* @__PURE__ */ jsxRuntime.jsxs(MotionCard$1, { "data-ui": "Popover", ...t8, "data-placement": placement, radius, ref, scheme, shadow, sizing: "border", style: rootStyle2, tone, ...t9, children: [
     t11,
     t12
-  ] }), $[48] = t8, $[49] = placement, $[50] = radius, $[51] = ref, $[52] = scheme, $[53] = shadow, $[54] = rootStyle2, $[55] = tone, $[56] = t9, $[57] = t11, $[58] = t12, $[59] = t13) : t13 = $[59], t13;
+  ] }), $[46] = t8, $[47] = placement, $[48] = radius, $[49] = ref, $[50] = scheme, $[51] = shadow, $[52] = rootStyle2, $[53] = tone, $[54] = t9, $[55] = t11, $[56] = t12, $[57] = t13) : t13 = $[57], t13;
 }));
 PopoverCard.displayName = "Memo(ForwardRef(PopoverCard))";
 const Popover = react.memo(react.forwardRef(function(props, forwardedRef) {
-  const {
+  const $ = reactCompilerRuntime.c(128), {
     container,
     layer
-  } = useTheme_v2(), boundaryElementContext = useBoundaryElement(), {
-    __unstable_margins: margins = DEFAULT_POPOVER_MARGINS,
-    animate: _animate = !1,
-    arrow: arrowProp = !1,
-    boundaryElement: _boundaryElement,
-    children: childProp,
-    constrainSize = !1,
-    content,
-    disabled,
-    fallbackPlacements: _fallbackPlacements,
-    matchReferenceWidth,
-    floatingBoundary: _floatingBoundary,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    onActivate,
-    open,
-    overflow = "hidden",
-    padding: paddingProp,
-    placement: placementProp = "bottom",
-    portal,
-    preventOverflow = !0,
-    radius: radiusProp = 3,
-    referenceBoundary: _referenceBoundary,
-    referenceElement,
-    scheme,
-    shadow: shadowProp = 3,
-    tone = "inherit",
-    width: widthProp = "auto",
-    zOffset: _zOffsetProp,
-    updateRef,
-    ...restProps
-  } = props, boundaryElement = _boundaryElement ?? boundaryElementContext.element, fallbackPlacements = _fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS$1[props.placement ?? "bottom"], floatingBoundary = _floatingBoundary ?? boundaryElement ?? boundaryElementContext.element, referenceBoundary = _referenceBoundary ?? boundaryElement ?? boundaryElementContext.element, zOffsetProp = _zOffsetProp ?? layer.popover.zOffset, animate = usePrefersReducedMotion() ? !1 : _animate, boundarySize = useElementSize(boundaryElement)?.border, padding = useArrayProp(paddingProp), radius = useArrayProp(radiusProp), shadow = useArrayProp(shadowProp), widthArrayProp = useArrayProp(widthProp), zOffset = useArrayProp(zOffsetProp), ref = react.useRef(null), [arrowElement, setArrowElement] = react.useState(null), rootBoundary = "viewport";
-  react.useImperativeHandle(forwardedRef, () => ref.current);
-  const mediaIndex = useMediaIndex(), boundaryWidth = constrainSize || preventOverflow ? boundarySize?.width : void 0, width = calcCurrentWidth({
-    container,
-    mediaIndex,
-    width: widthArrayProp
-  }), widthRef = react.useRef(width);
-  react.useEffect(() => {
-    widthRef.current = width;
-  }, [width]);
-  const maxWidth = calcMaxWidth({
-    boundaryWidth,
-    currentWidth: width
-  }), maxWidthRef = react.useRef(maxWidth);
-  react.useEffect(() => {
-    maxWidthRef.current = maxWidth;
-  }, [maxWidth]);
-  const referenceWidthRef = react.useRef();
-  react.useLayoutEffect(() => {
+  } = useTheme_v2(), boundaryElementContext = useBoundaryElement();
+  let t0, t1, t2, t3, t4, t5, t6, t7, t8, t9, t10, _boundaryElement, _fallbackPlacements, _floatingBoundary, _referenceBoundary, _zOffsetProp, paddingProp, open, matchReferenceWidth, childProp, referenceElement, updateRef, disabled, restProps, scheme, content, portal;
+  if ($[0] !== props) {
+    const {
+      __unstable_margins: t112,
+      animate: t122,
+      arrow: t132,
+      boundaryElement: t142,
+      children: t152,
+      constrainSize: t162,
+      content: t172,
+      disabled: t182,
+      fallbackPlacements: t192,
+      matchReferenceWidth: t202,
+      floatingBoundary: t212,
+      onActivate,
+      open: t222,
+      overflow: t232,
+      padding: t242,
+      placement: t252,
+      portal: t262,
+      preventOverflow: t272,
+      radius: t282,
+      referenceBoundary: t292,
+      referenceElement: t302,
+      scheme: t312,
+      shadow: t322,
+      tone: t332,
+      width: t342,
+      zOffset: t352,
+      updateRef: t362,
+      ...t372
+    } = props;
+    t0 = t112, t1 = t122, t2 = t132, _boundaryElement = t142, childProp = t152, t3 = t162, content = t172, disabled = t182, _fallbackPlacements = t192, matchReferenceWidth = t202, _floatingBoundary = t212, open = t222, t4 = t232, paddingProp = t242, t5 = t252, portal = t262, t6 = t272, t7 = t282, _referenceBoundary = t292, referenceElement = t302, scheme = t312, t8 = t322, t9 = t332, t10 = t342, _zOffsetProp = t352, updateRef = t362, restProps = t372, $[0] = props, $[1] = t0, $[2] = t1, $[3] = t2, $[4] = t3, $[5] = t4, $[6] = t5, $[7] = t6, $[8] = t7, $[9] = t8, $[10] = t9, $[11] = t10, $[12] = _boundaryElement, $[13] = _fallbackPlacements, $[14] = _floatingBoundary, $[15] = _referenceBoundary, $[16] = _zOffsetProp, $[17] = paddingProp, $[18] = open, $[19] = matchReferenceWidth, $[20] = childProp, $[21] = referenceElement, $[22] = updateRef, $[23] = disabled, $[24] = restProps, $[25] = scheme, $[26] = content, $[27] = portal;
+  } else
+    t0 = $[1], t1 = $[2], t2 = $[3], t3 = $[4], t4 = $[5], t5 = $[6], t6 = $[7], t7 = $[8], t8 = $[9], t9 = $[10], t10 = $[11], _boundaryElement = $[12], _fallbackPlacements = $[13], _floatingBoundary = $[14], _referenceBoundary = $[15], _zOffsetProp = $[16], paddingProp = $[17], open = $[18], matchReferenceWidth = $[19], childProp = $[20], referenceElement = $[21], updateRef = $[22], disabled = $[23], restProps = $[24], scheme = $[25], content = $[26], portal = $[27];
+  const margins = t0 === void 0 ? DEFAULT_POPOVER_MARGINS : t0, _animate = t1 === void 0 ? !1 : t1, arrowProp = t2 === void 0 ? !1 : t2, constrainSize = t3 === void 0 ? !1 : t3, overflow = t4 === void 0 ? "hidden" : t4, placementProp = t5 === void 0 ? "bottom" : t5, preventOverflow = t6 === void 0 ? !0 : t6, radiusProp = t7 === void 0 ? 3 : t7, shadowProp = t8 === void 0 ? 3 : t8, tone = t9 === void 0 ? "inherit" : t9, widthProp = t10 === void 0 ? "auto" : t10, boundaryElement = _boundaryElement ?? boundaryElementContext.element, fallbackPlacements = _fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS$1[props.placement ?? "bottom"], floatingBoundary = _floatingBoundary ?? boundaryElement ?? boundaryElementContext.element, referenceBoundary = _referenceBoundary ?? boundaryElement ?? boundaryElementContext.element, zOffsetProp = _zOffsetProp ?? layer.popover.zOffset, animate = usePrefersReducedMotion() ? !1 : _animate, boundarySize = useElementSize(boundaryElement)?.border, padding = useArrayProp(paddingProp), radius = useArrayProp(radiusProp), shadow = useArrayProp(shadowProp), widthArrayProp = useArrayProp(widthProp), zOffset = useArrayProp(zOffsetProp), ref = react.useRef(null), [arrowElement, setArrowElement] = react.useState(null);
+  let t11;
+  $[28] === Symbol.for("react.memo_cache_sentinel") ? (t11 = () => ref.current, $[28] = t11) : t11 = $[28], react.useImperativeHandle(forwardedRef, t11);
+  const mediaIndex = useMediaIndex(), boundaryWidth = constrainSize || preventOverflow ? boundarySize?.width : void 0;
+  let t12, t13;
+  $[29] !== open || $[30] !== constrainSize || $[31] !== matchReferenceWidth || $[32] !== container || $[33] !== mediaIndex || $[34] !== widthArrayProp || $[35] !== boundaryWidth ? (t12 = () => {
     const floatingElement = ref.current;
-    if (!open || !floatingElement) return;
-    const referenceWidth = referenceWidthRef.current;
-    matchReferenceWidth ? referenceWidthRef.current !== void 0 && (floatingElement.style.width = `${referenceWidth}px`) : width !== void 0 && (floatingElement.style.width = `${width}px`), typeof maxWidth == "number" && (floatingElement.style.maxWidth = `${maxWidth}px`);
-  }, [width, matchReferenceWidth, maxWidth, open]);
-  const middleware = react.useMemo(() => {
-    const ret = [];
-    return (constrainSize || preventOverflow) && ret.push(reactDom$1.flip({
-      boundary: floatingBoundary || void 0,
-      fallbackPlacements,
-      padding: DEFAULT_POPOVER_PADDING,
-      rootBoundary
-    })), ret.push(reactDom$1.offset({
-      mainAxis: DEFAULT_POPOVER_DISTANCE
-    })), (constrainSize || matchReferenceWidth) && ret.push(size({
-      apply({
+    if (!open || !floatingElement || constrainSize || matchReferenceWidth)
+      return;
+    const currentWidth = calcCurrentWidth({
+      container,
+      mediaIndex,
+      width: widthArrayProp
+    }), maxWidth = calcMaxWidth({
+      boundaryWidth,
+      currentWidth
+    });
+    currentWidth !== void 0 && (floatingElement.style.width = `${currentWidth}px`), typeof maxWidth == "number" && (floatingElement.style.maxWidth = `${maxWidth}px`);
+  }, t13 = [boundaryWidth, constrainSize, container, matchReferenceWidth, mediaIndex, open, widthArrayProp], $[29] = open, $[30] = constrainSize, $[31] = matchReferenceWidth, $[32] = container, $[33] = mediaIndex, $[34] = widthArrayProp, $[35] = boundaryWidth, $[36] = t12, $[37] = t13) : (t12 = $[36], t13 = $[37]), react.useLayoutEffect(t12, t13);
+  let t14;
+  $[38] !== constrainSize || $[39] !== preventOverflow || $[40] !== floatingBoundary || $[41] !== fallbackPlacements ? (t14 = (constrainSize || preventOverflow) && reactDom$1.flip({
+    boundary: floatingBoundary || void 0,
+    fallbackPlacements,
+    padding: DEFAULT_POPOVER_PADDING,
+    rootBoundary: "viewport"
+  }), $[38] = constrainSize, $[39] = preventOverflow, $[40] = floatingBoundary, $[41] = fallbackPlacements, $[42] = t14) : t14 = $[42];
+  let t15;
+  $[43] === Symbol.for("react.memo_cache_sentinel") ? (t15 = reactDom$1.offset({
+    mainAxis: DEFAULT_POPOVER_DISTANCE
+  }), $[43] = t15) : t15 = $[43];
+  let t16;
+  $[44] !== constrainSize || $[45] !== matchReferenceWidth || $[46] !== container || $[47] !== mediaIndex || $[48] !== widthArrayProp || $[49] !== boundaryWidth || $[50] !== floatingBoundary || $[51] !== margins ? (t16 = (constrainSize || matchReferenceWidth) && size({
+    apply(t172) {
+      const {
         availableWidth,
         availableHeight,
         elements,
-        referenceWidth: referenceWidth_0
-      }) {
-        referenceWidthRef.current = referenceWidth_0;
-        const _currentWidth = widthRef.current, _maxWidth = maxWidthRef.current;
-        matchReferenceWidth ? elements.floating.style.width = `${referenceWidth_0}px` : _currentWidth !== void 0 && (elements.floating.style.width = `${_currentWidth}px`), constrainSize && (elements.floating.style.maxWidth = `${Math.min(availableWidth, _maxWidth ?? 1 / 0)}px`, elements.floating.style.maxHeight = `${availableHeight}px`);
-      },
-      boundaryElement: floatingBoundary || void 0,
-      constrainSize,
-      margins,
-      matchReferenceWidth,
-      padding: DEFAULT_POPOVER_PADDING
-    })), preventOverflow && ret.push(reactDom$1.shift({
-      boundary: floatingBoundary || void 0,
-      rootBoundary,
-      padding: DEFAULT_POPOVER_PADDING
-    })), arrowProp && ret.push(reactDom$1.arrow({
-      element: arrowElement,
-      padding: DEFAULT_POPOVER_PADDING
-    })), animate && ret.push(origin), ret.push(reactDom$1.hide({
-      boundary: referenceBoundary || void 0,
-      padding: DEFAULT_POPOVER_PADDING,
-      strategy: "referenceHidden"
-    })), ret;
-  }, [animate, arrowElement, arrowProp, constrainSize, fallbackPlacements, floatingBoundary, margins, matchReferenceWidth, preventOverflow, referenceBoundary]), {
+        referenceWidth
+      } = t172, currentWidth_0 = calcCurrentWidth({
+        container,
+        mediaIndex,
+        width: widthArrayProp
+      }), maxWidth_0 = calcMaxWidth({
+        boundaryWidth,
+        currentWidth: currentWidth_0
+      });
+      matchReferenceWidth ? elements.floating.style.width = `${referenceWidth}px` : currentWidth_0 !== void 0 && (elements.floating.style.width = `${currentWidth_0}px`), constrainSize && (elements.floating.style.maxWidth = `${Math.min(availableWidth, maxWidth_0 ?? 1 / 0)}px`, elements.floating.style.maxHeight = `${availableHeight}px`);
+    },
+    boundaryElement: floatingBoundary || void 0,
+    constrainSize,
+    margins,
+    matchReferenceWidth,
+    padding: DEFAULT_POPOVER_PADDING
+  }), $[44] = constrainSize, $[45] = matchReferenceWidth, $[46] = container, $[47] = mediaIndex, $[48] = widthArrayProp, $[49] = boundaryWidth, $[50] = floatingBoundary, $[51] = margins, $[52] = t16) : t16 = $[52];
+  let t17;
+  $[53] !== preventOverflow || $[54] !== floatingBoundary ? (t17 = preventOverflow && reactDom$1.shift({
+    boundary: floatingBoundary || void 0,
+    rootBoundary: "viewport",
+    padding: DEFAULT_POPOVER_PADDING
+  }), $[53] = preventOverflow, $[54] = floatingBoundary, $[55] = t17) : t17 = $[55];
+  let t18;
+  $[56] !== arrowProp || $[57] !== arrowElement ? (t18 = arrowProp && reactDom$1.arrow({
+    element: arrowElement,
+    padding: DEFAULT_POPOVER_PADDING
+  }), $[56] = arrowProp, $[57] = arrowElement, $[58] = t18) : t18 = $[58];
+  const t19 = animate && origin, t20 = referenceBoundary || void 0;
+  let t21;
+  $[59] !== t20 ? (t21 = reactDom$1.hide({
+    boundary: t20,
+    padding: DEFAULT_POPOVER_PADDING,
+    strategy: "referenceHidden"
+  }), $[59] = t20, $[60] = t21) : t21 = $[60];
+  let t22;
+  $[61] !== t14 || $[62] !== t16 || $[63] !== t17 || $[64] !== t18 || $[65] !== t19 || $[66] !== t21 ? (t22 = [t14, t15, t16, t17, t18, t19, t21], $[61] = t14, $[62] = t16, $[63] = t17, $[64] = t18, $[65] = t19, $[66] = t21, $[67] = t22) : t22 = $[67];
+  let t23;
+  $[68] !== t22 || $[69] !== placementProp ? (t23 = {
+    middleware: t22,
+    placement: placementProp,
+    whileElementsMounted: reactDom$1.autoUpdate
+  }, $[68] = t22, $[69] = placementProp, $[70] = t23) : t23 = $[70];
+  const {
     x,
     y,
     middlewareData,
@@ -3932,28 +3955,57 @@ const Popover = react.memo(react.forwardRef(function(props, forwardedRef) {
     refs,
     strategy,
     update
-  } = reactDom$1.useFloating({
-    middleware,
-    placement: placementProp,
-    whileElementsMounted: reactDom$1.autoUpdate
-  }), referenceHidden = middlewareData.hide?.referenceHidden, arrowX = middlewareData.arrow?.x, arrowY = middlewareData.arrow?.y, originX = middlewareData["@sanity/ui/origin"]?.originX, originY = middlewareData["@sanity/ui/origin"]?.originY, setFloating = react.useCallback((node) => {
+  } = reactDom$1.useFloating(t23), referenceHidden = middlewareData.hide?.referenceHidden, arrowX = middlewareData.arrow?.x, arrowY = middlewareData.arrow?.y, originX = middlewareData["@sanity/ui/origin"]?.originX, originY = middlewareData["@sanity/ui/origin"]?.originY;
+  let t24;
+  $[71] !== refs ? (t24 = (node) => {
     ref.current = node, refs.setFloating(node);
-  }, [refs]), [childElement, setChildElement] = react.useState(null), setReference = react.useCallback((node_0) => {
+  }, $[71] = refs, $[72] = t24) : t24 = $[72];
+  const setFloating = t24, [childElement, setChildElement] = react.useState(null);
+  let t25;
+  $[73] !== refs ? (t25 = (node_0) => {
     refs.setReference(node_0), setChildElement(node_0);
-  }, [refs]);
-  react.useImperativeHandle(getElementRef(childProp), () => childElement, [childElement]);
-  const child = react.useMemo(() => !childProp || referenceElement ? null : react.cloneElement(childProp, {
-    ref: setReference
-  }), [childProp, referenceElement, setReference]);
-  if (react.useImperativeHandle(updateRef, () => update, [update]), react.useEffect(() => {
+  }, $[73] = refs, $[74] = t25) : t25 = $[74];
+  const setReference = t25, t26 = childProp;
+  let t27;
+  $[75] !== t26 ? (t27 = getElementRef(t26), $[75] = t26, $[76] = t27) : t27 = $[76];
+  let t28, t29;
+  $[77] !== childElement ? (t28 = () => childElement, t29 = [childElement], $[77] = childElement, $[78] = t28, $[79] = t29) : (t28 = $[78], t29 = $[79]), react.useImperativeHandle(t27, t28, t29);
+  let t30;
+  bb0: {
+    if (!childProp || referenceElement) {
+      t30 = null;
+      break bb0;
+    }
+    let t312;
+    $[80] !== setReference || $[81] !== childProp ? (t312 = react.cloneElement(childProp, {
+      ref: setReference
+    }), $[80] = setReference, $[81] = childProp, $[82] = t312) : t312 = $[82], t30 = t312;
+  }
+  const child = t30;
+  let t31, t32;
+  $[83] !== update ? (t31 = () => update, t32 = [update], $[83] = update, $[84] = t31, $[85] = t32) : (t31 = $[84], t32 = $[85]), react.useImperativeHandle(updateRef, t31, t32);
+  let t33, t34;
+  if ($[86] !== child || $[87] !== refs || $[88] !== referenceElement ? (t33 = () => {
     child || refs.setReference(referenceElement || null);
-  }, [referenceElement, refs, child]), disabled)
-    return childProp || /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {});
-  const popover = /* @__PURE__ */ jsxRuntime.jsx(LayerProvider, { zOffset, children: /* @__PURE__ */ jsxRuntime.jsx(PopoverCard, { ...restProps, __unstable_margins: margins, animate, arrow: arrowProp, arrowRef: setArrowElement, arrowX, arrowY, hidden: referenceHidden, overflow, padding, placement, radius, ref: setFloating, scheme, shadow, originX, originY, strategy, tone, width: matchReferenceWidth ? referenceWidthRef.current : width, x, y, children: content }) }), children = open && (portal ? /* @__PURE__ */ jsxRuntime.jsx(Portal, { __unstable_name: typeof portal == "string" ? portal : void 0, children: popover }) : popover);
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    animate ? /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children }) : children,
+  }, t34 = [referenceElement, refs, child], $[86] = child, $[87] = refs, $[88] = referenceElement, $[89] = t33, $[90] = t34) : (t33 = $[89], t34 = $[90]), react.useEffect(t33, t34), disabled) {
+    let t352;
+    return $[91] !== childProp ? (t352 = childProp || /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {}), $[91] = childProp, $[92] = t352) : t352 = $[92], t352;
+  }
+  let t35;
+  $[93] !== restProps || $[94] !== margins || $[95] !== animate || $[96] !== arrowProp || $[97] !== arrowX || $[98] !== arrowY || $[99] !== referenceHidden || $[100] !== overflow || $[101] !== padding || $[102] !== placement || $[103] !== radius || $[104] !== setFloating || $[105] !== scheme || $[106] !== shadow || $[107] !== originX || $[108] !== originY || $[109] !== strategy || $[110] !== tone || $[111] !== x || $[112] !== y || $[113] !== content ? (t35 = /* @__PURE__ */ jsxRuntime.jsx(PopoverCard, { ...restProps, __unstable_margins: margins, animate, arrow: arrowProp, arrowRef: setArrowElement, arrowX, arrowY, hidden: referenceHidden, overflow, padding, placement, radius, ref: setFloating, scheme, shadow, originX, originY, strategy, tone, x, y, children: content }), $[93] = restProps, $[94] = margins, $[95] = animate, $[96] = arrowProp, $[97] = arrowX, $[98] = arrowY, $[99] = referenceHidden, $[100] = overflow, $[101] = padding, $[102] = placement, $[103] = radius, $[104] = setFloating, $[105] = scheme, $[106] = shadow, $[107] = originX, $[108] = originY, $[109] = strategy, $[110] = tone, $[111] = x, $[112] = y, $[113] = content, $[114] = t35) : t35 = $[114];
+  let t36;
+  $[115] !== zOffset || $[116] !== t35 ? (t36 = /* @__PURE__ */ jsxRuntime.jsx(LayerProvider, { zOffset, children: t35 }), $[115] = zOffset, $[116] = t35, $[117] = t36) : t36 = $[117];
+  const popover = t36;
+  let t37;
+  $[118] !== open || $[119] !== portal || $[120] !== popover ? (t37 = open && (portal ? /* @__PURE__ */ jsxRuntime.jsx(Portal, { __unstable_name: typeof portal == "string" ? portal : void 0, children: popover }) : popover), $[118] = open, $[119] = portal, $[120] = popover, $[121] = t37) : t37 = $[121];
+  const children = t37;
+  let t38;
+  $[122] !== animate || $[123] !== children ? (t38 = animate ? /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children }) : children, $[122] = animate, $[123] = children, $[124] = t38) : t38 = $[124];
+  let t39;
+  return $[125] !== t38 || $[126] !== child ? (t39 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    t38,
     child
-  ] });
+  ] }), $[125] = t38, $[126] = child, $[127] = t39) : t39 = $[127], t39;
 }));
 Popover.displayName = "Memo(ForwardRef(Popover))";
 function getElementRef(element) {