From 1035b1ca251f72c30214b56baf3055783b1d851b Mon Sep 17 00:00:00 2001
From: Mitchell Austin <mr.fye@oneandthesame.net>
Date: Tue, 16 Jul 2024 16:06:10 -0700
Subject: [PATCH] Try padding the vertical toolbars shift range

---
 .../src/components/block-tools/zoom-out-popover.js            | 1 +
 packages/components/src/popover/index.tsx                     | 2 +-
 packages/components/src/popover/types.ts                      | 4 ++--
 3 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/block-editor/src/components/block-tools/zoom-out-popover.js b/packages/block-editor/src/components/block-tools/zoom-out-popover.js
index 7b6f29382a6f2..a7a0dd5961648 100644
--- a/packages/block-editor/src/components/block-tools/zoom-out-popover.js
+++ b/packages/block-editor/src/components/block-tools/zoom-out-popover.js
@@ -28,6 +28,7 @@ export default function ZoomOutPopover( { clientId, __unstableContentRef } ) {
 		...popoverProps,
 		placement: 'left-start',
 		flip: false,
+		shift: { padding: { top: 48, bottom: 48 } },
 	};
 
 	return (
diff --git a/packages/components/src/popover/index.tsx b/packages/components/src/popover/index.tsx
index 68d331ce8266b..fc92388767a95 100644
--- a/packages/components/src/popover/index.tsx
+++ b/packages/components/src/popover/index.tsx
@@ -239,7 +239,7 @@ const UnforwardedPopover = (
 			shiftMiddleware( {
 				crossAxis: true,
 				limiter: limitShift(),
-				padding: 1, // Necessary to avoid flickering at the edge of the viewport.
+				padding: typeof shift === 'boolean' ? 1 : shift.padding ?? 1, // Necessary to avoid flickering at the edge of the viewport.
 			} ),
 		arrow( { element: arrowRef } ),
 	];
diff --git a/packages/components/src/popover/types.ts b/packages/components/src/popover/types.ts
index 427f4afb81bfb..7793c96026f81 100644
--- a/packages/components/src/popover/types.ts
+++ b/packages/components/src/popover/types.ts
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import type { ReactNode, MutableRefObject, SyntheticEvent } from 'react';
-import type { Placement } from '@floating-ui/react-dom';
+import type { Placement, ShiftOptions } from '@floating-ui/react-dom';
 
 type PositionYAxis = 'top' | 'middle' | 'bottom';
 type PositionXAxis = 'left' | 'center' | 'right';
@@ -139,7 +139,7 @@ export type PopoverProps = {
 	 *
 	 * @default false
 	 */
-	shift?: boolean;
+	shift?: boolean | ShiftOptions;
 	/**
 	 * Specifies the popover's style.
 	 *