From 24a074a3400cffa31c44ab09e8fad666efceb2f1 Mon Sep 17 00:00:00 2001
From: yu859 <15715093608@163.com>
Date: Mon, 3 Aug 2026 11:14:48 +0800
Subject: [PATCH] fix: keep plugin flow timeline vertically scrollable

---
 packages/rolldown/src/app/components/flowmap/PluginFlow.vue   | 2 +-
 .../src/app/components/flowmap/PluginFlowTimeline.vue         | 4 ++--
 packages/vite/src/app/components/flowmap/PluginFlow.vue       | 2 +-
 .../vite/src/app/components/flowmap/PluginFlowTimeline.vue    | 4 ++--
 4 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/rolldown/src/app/components/flowmap/PluginFlow.vue b/packages/rolldown/src/app/components/flowmap/PluginFlow.vue
index 2efcfbf86..579948ff0 100644
--- a/packages/rolldown/src/app/components/flowmap/PluginFlow.vue
+++ b/packages/rolldown/src/app/components/flowmap/PluginFlow.vue
@@ -100,7 +100,7 @@ function toggleShowType() {
 <template>
   <div class="p2 h-full w-full">
     <div class="flex border border-base rounded-2 h-full relative of-hidden">
-      <div v-if="expanded" class="of-hidden border-r border-base shrink-0">
+      <div v-if="expanded" class="of-hidden border-r border-base shrink-0 h-full min-h-0 flex flex-col">
         <FlowmapPluginFlowTimeline
           :session="session"
           :build-metrics="buildMetrics"
diff --git a/packages/rolldown/src/app/components/flowmap/PluginFlowTimeline.vue b/packages/rolldown/src/app/components/flowmap/PluginFlowTimeline.vue
index 12e43d316..dc13ee678 100644
--- a/packages/rolldown/src/app/components/flowmap/PluginFlowTimeline.vue
+++ b/packages/rolldown/src/app/components/flowmap/PluginFlowTimeline.vue
@@ -51,9 +51,9 @@ const endTime = computed(() => {
 </script>
 
 <template>
-  <div class="flex flex-col">
+  <div class="flex flex-col h-full min-h-0">
     <slot name="header" />
-    <div class="select-none h-full of-auto ws-nowrap w-auto of-visible p4 flex flex-col">
+    <div class="select-none flex-1 min-h-0 of-x-hidden of-y-auto ws-nowrap w-auto p4 flex flex-col" style="scrollbar-gutter: stable">
       <div class="flex">
         <FlowmapNode
           :active="false"
diff --git a/packages/vite/src/app/components/flowmap/PluginFlow.vue b/packages/vite/src/app/components/flowmap/PluginFlow.vue
index e5ed4cfd2..4b4a2f6d2 100644
--- a/packages/vite/src/app/components/flowmap/PluginFlow.vue
+++ b/packages/vite/src/app/components/flowmap/PluginFlow.vue
@@ -102,7 +102,7 @@ function toggleShowType() {
 <template>
   <div class="p2 h-full w-full">
     <div class="flex border border-base rounded-2 h-full relative of-hidden">
-      <div v-if="expanded" class="of-hidden border-r border-base shrink-0">
+      <div v-if="expanded" class="of-hidden border-r border-base shrink-0 h-full min-h-0 flex flex-col">
         <FlowmapPluginFlowTimeline
           :build-metrics="buildMetrics"
         >
diff --git a/packages/vite/src/app/components/flowmap/PluginFlowTimeline.vue b/packages/vite/src/app/components/flowmap/PluginFlowTimeline.vue
index 9a5a4e4ce..89a33ba48 100644
--- a/packages/vite/src/app/components/flowmap/PluginFlowTimeline.vue
+++ b/packages/vite/src/app/components/flowmap/PluginFlowTimeline.vue
@@ -49,9 +49,9 @@ const endTime = computed(() => {
 </script>
 
 <template>
-  <div class="flex flex-col">
+  <div class="flex flex-col h-full min-h-0">
     <slot name="header" />
-    <div class="select-none h-full of-auto ws-nowrap w-auto of-visible p4 flex flex-col">
+    <div class="select-none flex-1 min-h-0 of-x-hidden of-y-auto ws-nowrap w-auto p4 flex flex-col" style="scrollbar-gutter: stable">
       <div class="flex">
         <FlowmapNode
           :active="false"