mirror of
https://github.com/jlengrand/Maestro.git
synced 2026-03-10 08:31:19 +00:00
feat(file-preview): dismiss TOC overlay on click outside
Add an invisible fixed backdrop behind the TOC overlay that captures clicks outside the menu, providing standard dismiss-on-click-outside behavior.
This commit is contained in:
@@ -2085,16 +2085,22 @@ export const FilePreview = forwardRef<FilePreviewHandle, FilePreviewProps>(funct
|
||||
|
||||
{/* TOC Overlay */}
|
||||
{showTocOverlay && (
|
||||
<div
|
||||
className="absolute bottom-16 right-4 rounded-lg shadow-xl overflow-hidden z-20 animate-in fade-in slide-in-from-bottom-2 duration-200 flex flex-col"
|
||||
style={{
|
||||
backgroundColor: theme.colors.bgSidebar,
|
||||
border: `1px solid ${theme.colors.border}`,
|
||||
maxHeight: 'calc(70vh - 80px)',
|
||||
minWidth: '200px',
|
||||
maxWidth: '350px',
|
||||
}}
|
||||
>
|
||||
<>
|
||||
{/* Click-outside backdrop */}
|
||||
<div
|
||||
className="fixed inset-0 z-15"
|
||||
onClick={() => setShowTocOverlay(false)}
|
||||
/>
|
||||
<div
|
||||
className="absolute bottom-16 right-4 rounded-lg shadow-xl overflow-hidden z-20 animate-in fade-in slide-in-from-bottom-2 duration-200 flex flex-col"
|
||||
style={{
|
||||
backgroundColor: theme.colors.bgSidebar,
|
||||
border: `1px solid ${theme.colors.border}`,
|
||||
maxHeight: 'calc(70vh - 80px)',
|
||||
minWidth: '200px',
|
||||
maxWidth: '350px',
|
||||
}}
|
||||
>
|
||||
{/* TOC Header */}
|
||||
<div
|
||||
className="px-3 py-2 border-b flex items-center justify-between flex-shrink-0"
|
||||
@@ -2193,6 +2199,7 @@ export const FilePreview = forwardRef<FilePreviewHandle, FilePreviewProps>(funct
|
||||
<span>Bottom</span>
|
||||
</button>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user