Fix bug where Gallery scrollbar would not show up (#11938)

Author: freddyaboulton

.changeset/bitter-glasses-send.md

@@ -0,0 +1,6 @@
+---
+"@gradio/gallery": patch
+"gradio": patch
+---
+
+fix:Fix bug where Gallery scrollbar would not show up

js/gallery/Gallery.stories.svelte

@@ -34,7 +34,7 @@
 				defaultValue: 2
 			},
 			height: {
-				options: ["auto", 500, 600],
+				options: ["auto", 200, 500, 600],
 				description: "The height of the grid",
 				control: { type: "select" },
 				defaultValue: "auto"
@@ -258,7 +258,16 @@
 		height: 400
 	}}
 />
-
+<Story
+	name="Gallery with overflow of images and short height"
+	args={{
+		label: "My Cheetah Gallery",
+		show_label: true,
+		rows: 2,
+		columns: 2,
+		height: 200
+	}}
+/>
 <Story
 	name="Gallery with download button"
 	args={{

js/gallery/shared/Gallery.svelte

@@ -461,6 +461,7 @@
 			class:minimal={mode === "minimal"}
 			class:fixed-height={mode !== "minimal" && (!height || height == "auto")}
 			class:hidden={is_full_screen}
+			style:height={height !== "auto" ? height + "px" : null}
 		>
 			{#if interactive && selected_index === null}
 				<ModifyUpload {i18n} on:clear={() => (value = [])}>
@@ -484,7 +485,7 @@
 			{/if}
 			<div
 				class="grid-container"
-				style="--grid-cols:{effective_columns}; --grid-rows:{rows}; --object-fit: {object_fit}; height: {height};"
+				style="--grid-cols:{effective_columns}; --grid-rows:{rows}; --object-fit: {object_fit};"
 				class:pt-6={show_label}
 			>
 				{#each resolved_value as entry, i}
@@ -722,7 +723,6 @@
 	.grid-wrap {
 		position: relative;
 		padding: var(--size-2);
-		height: var(--size-full);
 		overflow-y: scroll;
 	}