` (the `Classes.POPOVER` element), so a
// ref slot typed for the wider `HTMLElement` safely receives it. Cast narrowly here so
// the unsoundness stays scoped to this one prop instead of the whole bag.
nextProps.popoverRef = popoverRef as React.Ref
;
}
// Legacy default for `shouldReturnFocusOnClose` is `false`; PopoverNext's is `true`.
nextProps.shouldReturnFocusOnClose = shouldReturnFocusOnClose ?? false;
return nextProps;
}
/**
* Converts a Popper.js `Boundary` value to a Floating UI `PopoverNextBoundary` value.
*
* The two systems use different names for the "all clipping ancestors" sentinel:
* - Popper.js: `"clippingParents"`
* - Floating UI: `"clippingAncestors"`
*
* Element / `Element[]` values pass through unchanged.
*/
export function popperBoundaryToNextBoundary(boundary: PopperBoundary): PopoverNextBoundary {
return boundary === "clippingParents" ? "clippingAncestors" : boundary;
}
/**
* Converts a Popper.js `Placement` value to a `PopoverNextPlacement` value for use with `PopoverNext`.
*
* `"auto"`, `"auto-start"`, and `"auto-end"` have no direct equivalent in Floating UI — they return
* `undefined`, which causes `PopoverNext` to use its default automatic placement behavior.
* All other values pass through unchanged (the residual literal union is identical to `PopoverNextPlacement`).
*
* @example
* // Before (Popover)
*
*
* // After (PopoverNext)
*
*/
export function popoverPlacementToNextPlacement(placement: Placement): PopoverNextPlacement | undefined {
switch (placement) {
case "auto":
case "auto-start":
case "auto-end":
// PopoverNext uses autoPlacement middleware by default when placement is undefined.
return undefined;
default:
return placement;
}
}
/**
* Converts a legacy `PopoverPosition` value to a `PopoverNextPlacement` value for use with `PopoverNext`.
*
* The `position` prop is not supported in `PopoverNext`; use the `placement` prop instead.
* `"auto"`, `"auto-start"`, and `"auto-end"` have no direct equivalent — they return `undefined`,
* which causes `PopoverNext` to use its default automatic placement behavior.
*
* @example
* // Before (Popover)
*
*
* // After (PopoverNext)
*
*/
export function popoverPositionToNextPlacement(position: PopoverPosition): PopoverNextPlacement | undefined {
// `positionToPlacement` translates PopoverPosition's `"top-left"`/`"bottom-right"` forms to
// Popper's `"top-start"`/`"bottom-end"` forms, and passes `"auto"`/`"auto-start"`/`"auto-end"`
// through unchanged. `popoverPlacementToNextPlacement` then filters out the auto* values.
return popoverPlacementToNextPlacement(positionToPlacement(position));
}