B: Fix nodes not being selectable through hidden div

This commit is contained in:
Ivan 2025-01-15 19:16:13 +03:00
parent 8c3e5dfd4d
commit 912fd22bfa
3 changed files with 5 additions and 3 deletions

View File

@ -16,7 +16,7 @@ interface GraphSelectorsProps {
function GraphSelectors({ schema, coloring, onChangeColoring }: GraphSelectorsProps) { function GraphSelectors({ schema, coloring, onChangeColoring }: GraphSelectorsProps) {
return ( return (
<div className='border rounded-b-none select-none clr-input rounded-t-md'> <div className='border rounded-b-none select-none clr-input rounded-t-md pointer-events-auto'>
<Overlay position='right-[2.5rem] top-[0.25rem]'> <Overlay position='right-[2.5rem] top-[0.25rem]'>
{coloring === 'status' ? <BadgeHelp topic={HelpTopic.UI_CST_STATUS} className='min-w-[25rem]' /> : null} {coloring === 'status' ? <BadgeHelp topic={HelpTopic.UI_CST_STATUS} className='min-w-[25rem]' /> : null}
{coloring === 'type' ? <BadgeHelp topic={HelpTopic.UI_CST_CLASS} className='min-w-[25rem]' /> : null} {coloring === 'type' ? <BadgeHelp topic={HelpTopic.UI_CST_CLASS} className='min-w-[25rem]' /> : null}

View File

@ -380,7 +380,7 @@ function TGFlow({ onOpenEdit }: TGFlowProps) {
</Overlay> </Overlay>
) : null} ) : null}
<Overlay position='top-[6.15rem] sm:top-[5.9rem] left-0' className='flex gap-1'> <Overlay position='top-[6.15rem] sm:top-[5.9rem] left-0' className='flex gap-1 pointer-events-none'>
<div className='flex flex-col ml-2 w-[13.5rem]'> <div className='flex flex-col ml-2 w-[13.5rem]'>
<GraphSelectors schema={controller.schema} coloring={coloring} onChangeColoring={setColoring} /> <GraphSelectors schema={controller.schema} coloring={coloring} onChangeColoring={setColoring} />
<ViewHidden <ViewHidden

View File

@ -48,7 +48,7 @@ function ViewHidden({ items, selected, toggleSelection, setFocus, schema, colori
} }
return ( return (
<div className='flex flex-col'> <div className='flex flex-col'>
<Overlay position='right-[calc(0.7rem-2px)] top-2'> <Overlay position='right-[calc(0.7rem-2px)] top-2 pointer-events-auto'>
<MiniButton <MiniButton
noPadding noPadding
noHover noHover
@ -73,6 +73,7 @@ function ViewHidden({ items, selected, toggleSelection, setFocus, schema, colori
</div> </div>
<div <div
tabIndex={-1}
className={clsx( className={clsx(
'flex flex-wrap justify-center gap-2 py-2 mt-[-0.5rem]', 'flex flex-wrap justify-center gap-2 py-2 mt-[-0.5rem]',
'text-sm', 'text-sm',
@ -80,6 +81,7 @@ function ViewHidden({ items, selected, toggleSelection, setFocus, schema, colori
'cc-scroll-y' 'cc-scroll-y'
)} )}
style={{ style={{
pointerEvents: isFolded ? 'none' : 'auto',
maxHeight: hiddenHeight, maxHeight: hiddenHeight,
transitionProperty: 'clip-path', transitionProperty: 'clip-path',
transitionDuration: `${PARAMETER.fastAnimation}ms`, transitionDuration: `${PARAMETER.fastAnimation}ms`,