Moved scroll out to tool panel and works better with zoom (#4282)

Co-authored-by: Connor Yoh <connor@stirlingpdf.com>
This commit is contained in:
ConnorYoh 2025-08-26 10:12:15 +01:00 committed by GitHub
parent 1cc803545a
commit 4b70ef1298
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 13 additions and 9 deletions

View File

@ -8,6 +8,7 @@ import ToolRenderer from './ToolRenderer';
import ToolSearch from './toolPicker/ToolSearch'; import ToolSearch from './toolPicker/ToolSearch';
import { useSidebarContext } from "../../contexts/SidebarContext"; import { useSidebarContext } from "../../contexts/SidebarContext";
import rainbowStyles from '../../styles/rainbow.module.css'; import rainbowStyles from '../../styles/rainbow.module.css';
import { Stack, ScrollArea } from '@mantine/core';
// No props needed - component uses context // No props needed - component uses context
@ -91,15 +92,17 @@ export default function ToolPanel() {
</div> </div>
) : ( ) : (
// Selected Tool Content View // Selected Tool Content View
<div className="flex-1 flex flex-col"> <div className="flex-1 flex flex-col overflow-hidden">
{/* Tool content */} {/* Tool content */}
<div className="flex-1 min-h-0"> <div className="flex-1 min-h-0 overflow-hidden">
{selectedToolKey && ( <ScrollArea h="100%">
<ToolRenderer {selectedToolKey && (
selectedToolKey={selectedToolKey} <ToolRenderer
onPreviewFile={setPreviewFile} selectedToolKey={selectedToolKey}
/> onPreviewFile={setPreviewFile}
)} />
)}
</ScrollArea>
</div> </div>
</div> </div>
)} )}

View File

@ -65,7 +65,8 @@ export function createToolFlow(config: ToolFlowConfig) {
const steps = createToolSteps(); const steps = createToolSteps();
return ( return (
<Stack gap="sm" p="sm" h="95vh" w="100%" style={{ overflow: 'auto' }}> <Stack gap="sm" p="sm" >
{/* <Stack gap="sm" p="sm" h="100%" w="100%" style={{ overflow: 'auto' }}> */}
<ToolStepProvider forceStepNumbers={config.forceStepNumbers}> <ToolStepProvider forceStepNumbers={config.forceStepNumbers}>
{config.title && <ToolWorkflowTitle {...config.title} />} {config.title && <ToolWorkflowTitle {...config.title} />}