From d55093a139f239c11b9c0e867ce27247b7b44d98 Mon Sep 17 00:00:00 2001
From: Daniel Richards <daniel.richards@automattic.com>
Date: Tue, 10 Oct 2023 13:42:12 +0800
Subject: [PATCH] Fix scrollbars on pattern transforms (#55069)

* Fix scrollbars on pattern transforms

* Fix single pattern previews

* Improve classname semantics

* Remove modal title
---
 .../block-switcher/pattern-transformations-menu.js          | 5 +----
 .../block-editor/src/components/block-switcher/style.scss   | 6 ++++++
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/packages/block-editor/src/components/block-switcher/pattern-transformations-menu.js b/packages/block-editor/src/components/block-switcher/pattern-transformations-menu.js
index 83eecd329d8c4..f9a4b7190a6dd 100644
--- a/packages/block-editor/src/components/block-switcher/pattern-transformations-menu.js
+++ b/packages/block-editor/src/components/block-switcher/pattern-transformations-menu.js
@@ -60,10 +60,7 @@ function PreviewPatternsPopover( { patterns, onSelect } ) {
 					className="block-editor-block-switcher__preview__popover"
 					position="bottom right"
 				>
-					<div className="block-editor-block-switcher__preview">
-						<div className="block-editor-block-switcher__preview-title">
-							{ __( 'Preview' ) }
-						</div>
+					<div className="block-editor-block-switcher__preview is-pattern-list-preview">
 						<BlockPatternsList
 							patterns={ patterns }
 							onSelect={ onSelect }
diff --git a/packages/block-editor/src/components/block-switcher/style.scss b/packages/block-editor/src/components/block-switcher/style.scss
index d587dddc35f99..b8503a0811e42 100644
--- a/packages/block-editor/src/components/block-switcher/style.scss
+++ b/packages/block-editor/src/components/block-switcher/style.scss
@@ -98,6 +98,7 @@
 
 .block-editor-block-switcher__preview__popover {
 	display: none;
+	overflow: hidden;
 
 	// Position correctly. Needs specificity.
 	&.components-popover {
@@ -115,6 +116,7 @@
 		border-radius: $radius-block-ui;
 		outline: none;
 		box-shadow: none;
+		overflow: auto;
 	}
 
 	.block-editor-block-switcher__preview {
@@ -124,6 +126,10 @@
 		// Use padding to prevent the pattern previews focus style from being cut-off.
 		padding: 0 $grid-unit-20;
 		overflow: hidden;
+
+		&.is-pattern-list-preview {
+			overflow: unset;
+		}
 	}
 }