@sanity/ui 2.15.17 → 2.16.0

package/dist/_visual-editing.d.mts

@@ -537,6 +537,16 @@ declare interface PopoverProps
   overflow?: BoxOverflow
   padding?: number | number[]
   placement?: Placement
+  /**
+   * When 'flip' (default), the placement is determined from the initial placement and the
+   * fallback placements in order. Whichever fits in the viewport first.
+   *
+   * When 'autoPlacement', the initial placement and all fallback placements are evaluated
+   * and the placement with the most viewport space available.
+   *
+   * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
+   */
+  placementStrategy?: 'flip' | 'autoPlacement'
   /** Whether or not to render the popover in a portal element. */
   portal?: boolean | string
   preventOverflow?: boolean

package/dist/_visual-editing.d.ts

@@ -537,6 +537,16 @@ declare interface PopoverProps
   overflow?: BoxOverflow
   padding?: number | number[]
   placement?: Placement
+  /**
+   * When 'flip' (default), the placement is determined from the initial placement and the
+   * fallback placements in order. Whichever fits in the viewport first.
+   *
+   * When 'autoPlacement', the initial placement and all fallback placements are evaluated
+   * and the placement with the most viewport space available.
+   *
+   * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
+   */
+  placementStrategy?: 'flip' | 'autoPlacement'
   /** Whether or not to render the popover in a portal element. */
   portal?: boolean | string
   preventOverflow?: boolean

package/dist/index.d.mts

@@ -1596,6 +1596,16 @@ export declare interface PopoverProps
   overflow?: BoxOverflow
   padding?: number | number[]
   placement?: Placement
+  /**
+   * When 'flip' (default), the placement is determined from the initial placement and the
+   * fallback placements in order. Whichever fits in the viewport first.
+   *
+   * When 'autoPlacement', the initial placement and all fallback placements are evaluated
+   * and the placement with the most viewport space available.
+   *
+   * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
+   */
+  placementStrategy?: 'flip' | 'autoPlacement'
   /** Whether or not to render the popover in a portal element. */
   portal?: boolean | string
   preventOverflow?: boolean

package/dist/index.d.ts

@@ -1596,6 +1596,16 @@ export declare interface PopoverProps
   overflow?: BoxOverflow
   padding?: number | number[]
   placement?: Placement
+  /**
+   * When 'flip' (default), the placement is determined from the initial placement and the
+   * fallback placements in order. Whichever fits in the viewport first.
+   *
+   * When 'autoPlacement', the initial placement and all fallback placements are evaluated
+   * and the placement with the most viewport space available.
+   *
+   * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
+   */
+  placementStrategy?: 'flip' | 'autoPlacement'
   /** Whether or not to render the popover in a portal element. */
   portal?: boolean | string
   preventOverflow?: boolean

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sanity/ui",
-  "version": "2.15.17",
+  "version": "2.16.0",
   "keywords": [
     "sanity",
     "ui",
@@ -120,7 +120,7 @@
     "@sanity/icons": "^3.7.0",
     "csstype": "^3.1.3",
     "framer-motion": "^12.9.7",
-    "react-compiler-runtime": "19.1.0-rc.1",
+    "react-compiler-runtime": "19.1.0-rc.2",
     "react-refractor": "^2.2.0",
     "use-effect-event": "^1.0.2"
   },
@@ -162,7 +162,7 @@
     "@types/react-is": "^19.0.0",
     "@types/refractor": "^3.4.1",
     "@vitejs/plugin-react": "^4.4.1",
-    "babel-plugin-react-compiler": "19.1.0-rc.1",
+    "babel-plugin-react-compiler": "19.1.0-rc.2",
     "babel-plugin-styled-components": "^2.1.4",
     "commitizen": "^4.3.1",
     "cypress": "^13.17.0",
@@ -175,7 +175,7 @@
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-jsx-a11y": "^6.10.2",
     "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "0.0.0-experimental-7a2c7045-20250506",
+    "eslint-plugin-react-hooks": "0.0.0-experimental-4448b187-20250515",
     "eslint-plugin-react-refresh": "^0.4.20",
     "eslint-plugin-simple-import-sort": "^12.1.1",
     "eslint-plugin-storybook": "^0.12.0",

package/src/core/primitives/popover/popover.tsx

@@ -1,5 +1,6 @@
 import {
   arrow,
+  autoPlacement,
   autoUpdate,
   flip,
   hide,
@@ -96,6 +97,16 @@ export interface PopoverProps
   overflow?: BoxOverflow
   padding?: number | number[]
   placement?: Placement
+  /**
+   * When 'flip' (default), the placement is determined from the initial placement and the
+   * fallback placements in order. Whichever fits in the viewport first.
+   *
+   * When 'autoPlacement', the initial placement and all fallback placements are evaluated
+   * and the placement with the most viewport space available.
+   *
+   * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
+   */
+  placementStrategy?: 'flip' | 'autoPlacement'
   /** Whether or not to render the popover in a portal element. */
   portal?: boolean | string
   preventOverflow?: boolean
@@ -154,6 +165,7 @@ export const Popover = memo(
       overflow = 'hidden',
       padding: paddingProp,
       placement: placementProp = 'bottom',
+      placementStrategy = 'flip',
       portal,
       preventOverflow = true,
       radius: radiusProp = 3,
@@ -240,14 +252,22 @@ export const Popover = memo(
 
       // Flip the floating element when leaving the boundary box
       if (constrainSize || preventOverflow) {
-        ret.push(
-          flip({
-            boundary: floatingBoundary || undefined,
-            fallbackPlacements,
-            padding: DEFAULT_POPOVER_PADDING,
-            rootBoundary,
-          }),
-        )
+        if (placementStrategy === 'autoPlacement') {
+          ret.push(
+            autoPlacement({
+              allowedPlacements: [placementProp].concat(fallbackPlacements),
+            }),
+          )
+        } else {
+          ret.push(
+            flip({
+              boundary: floatingBoundary || undefined,
+              fallbackPlacements,
+              padding: DEFAULT_POPOVER_PADDING,
+              rootBoundary,
+            }),
+          )
+        }
       }
 
       // Define distance between reference and floating element
@@ -330,6 +350,8 @@ export const Popover = memo(
       arrowProp,
       constrainSize,
       fallbackPlacements,
+      placementProp,
+      placementStrategy,
       floatingBoundary,
       margins,
       matchReferenceWidth,