Wrap workflow node library in scroll area

This commit is contained in:
mlogclub
2026-06-22 22:45:15 +08:00
parent 5c59f0ad8a
commit 4ae37f48f1
@@ -24,6 +24,7 @@ import { AlertCircleIcon, CheckCircle2Icon } from "lucide-react"
import { useCallback, useEffect, useMemo, useRef, useState } from "react" import { useCallback, useEffect, useMemo, useRef, useState } from "react"
import { Badge } from "@/components/ui/badge" import { Badge } from "@/components/ui/badge"
import { ScrollArea } from "@/components/ui/scroll-area"
import { import {
Popover, Popover,
PopoverContent, PopoverContent,
@@ -331,7 +332,9 @@ export function WorkflowEditor({
return ( return (
<ResizablePanelGroup orientation="horizontal" className="h-full min-h-0"> <ResizablePanelGroup orientation="horizontal" className="h-full min-h-0">
<ResizablePanel defaultSize="18%" minSize="12%" maxSize="34%" className="min-h-0"> <ResizablePanel defaultSize="18%" minSize="12%" maxSize="34%" className="min-h-0">
<aside className="h-full min-h-0 overflow-y-auto bg-muted/20 p-3"> <aside className="h-full min-h-0 bg-muted/20">
<ScrollArea className="h-full min-h-0">
<div className="p-3">
<div className="mb-3 text-sm font-medium"></div> <div className="mb-3 text-sm font-medium"></div>
<div className="space-y-2"> <div className="space-y-2">
{nodeSpecs.map((spec) => ( {nodeSpecs.map((spec) => (
@@ -361,6 +364,8 @@ export function WorkflowEditor({
</button> </button>
))} ))}
</div> </div>
</div>
</ScrollArea>
</aside> </aside>
</ResizablePanel> </ResizablePanel>
<ResizableHandle withHandle /> <ResizableHandle withHandle />