fix(workspace): enable clicking into empty bulletpoint to focus cursor
MindSift CI & Docker Release / Build, Test in Container & Push (push) Successful in 59s

This commit is contained in:
sandrodach committed 2026-10-27 21:33:18 +01:00
1 parent 1c71b09f20
commit c85f31eee5
1 file changed
+13 -5
@@ -513,6 +513,14 @@ export const OutlinerBlock: React.FC<OutlinerBlockProps> = ({
}} }}
onDragOver={(e) => onDragOverBlock?.(e, index)} onDragOver={(e) => onDragOverBlock?.(e, index)}
onDrop={() => onDropBlock?.(index)} onDrop={() => onDropBlock?.(index)}
onClick={(e) => {
if ((e.target as HTMLElement).closest('button, a, input, select')) return;
if (!activeFocus && canEdit && textareaRef.current) {
textareaRef.current.focus();
const len = textareaRef.current.value.length;
textareaRef.current.setSelectionRange(len, len);
}
}}
> >
{/* Indentation Guide Line */} {/* Indentation Guide Line */}
{visualLevel > 0 && {visualLevel > 0 &&
@@ -596,7 +604,7 @@ export const OutlinerBlock: React.FC<OutlinerBlockProps> = ({
</div> </div>
{/* Main Block Content */} {/* Main Block Content */}
<div className="flex-1 min-w-0 pr-1 relative"> <div className="flex-1 min-w-0 pr-1 relative min-h-[1.5rem]">
{block.type === 'divider' ? ( {block.type === 'divider' ? (
<div className="py-2"> <div className="py-2">
<hr className="border-t border-border" /> <hr className="border-t border-border" />
@@ -646,7 +654,7 @@ export const OutlinerBlock: React.FC<OutlinerBlockProps> = ({
/> />
</div> </div>
) : ( ) : (
<div className="relative w-full"> <div className="relative w-full min-h-[1.5rem]">
{/* View Layer with Inline Markdown & Actions (3-dots or Erweitert Badge) directly behind text */} {/* View Layer with Inline Markdown & Actions (3-dots or Erweitert Badge) directly behind text */}
<div <div
onClick={() => { onClick={() => {
@@ -656,7 +664,7 @@ export const OutlinerBlock: React.FC<OutlinerBlockProps> = ({
textareaRef.current.setSelectionRange(len, len); textareaRef.current.setSelectionRange(len, len);
} }
}} }}
className={`w-full leading-relaxed whitespace-pre-wrap break-words [overflow-wrap:anywhere] ${ className={`w-full min-h-[1.5rem] leading-relaxed whitespace-pre-wrap break-words [overflow-wrap:anywhere] ${
activeFocus ? 'absolute inset-0 pointer-events-none' : 'relative cursor-text' activeFocus ? 'absolute inset-0 pointer-events-none' : 'relative cursor-text'
} ${ } ${
block.type === 'h1' block.type === 'h1'
@@ -672,7 +680,7 @@ export const OutlinerBlock: React.FC<OutlinerBlockProps> = ({
> >
{/* When actively focused, ghost text is invisible so textarea renders text/caret directly */} {/* When actively focused, ghost text is invisible so textarea renders text/caret directly */}
<span className={activeFocus ? 'invisible' : ''}> <span className={activeFocus ? 'invisible' : ''}>
{localContent ? renderInlineMarkdown(localContent) : ''} {localContent ? renderInlineMarkdown(localContent) : '\u200b'}
</span> </span>
{/* Inline Badge and 3-Dots directly behind the text */} {/* Inline Badge and 3-Dots directly behind the text */}
@@ -785,7 +793,7 @@ export const OutlinerBlock: React.FC<OutlinerBlockProps> = ({
? 'Schreibe einen Punkt… (Enter = Neu, Tab = Einrücken, Shift+Tab = Ausrücken, / für Befehle)' ? 'Schreibe einen Punkt… (Enter = Neu, Tab = Einrücken, Shift+Tab = Ausrücken, / für Befehle)'
: '' : ''
} }
className={`w-full resize-none overflow-hidden bg-transparent border-0 focus:outline-none focus:ring-0 leading-relaxed whitespace-pre-wrap break-words [overflow-wrap:anywhere] ${ className={`w-full min-h-[1.5rem] resize-none overflow-hidden bg-transparent border-0 focus:outline-none focus:ring-0 leading-relaxed whitespace-pre-wrap break-words [overflow-wrap:anywhere] ${
activeFocus ? 'relative z-0 text-main' : 'absolute inset-0 text-transparent selection:text-transparent pointer-events-none' activeFocus ? 'relative z-0 text-main' : 'absolute inset-0 text-transparent selection:text-transparent pointer-events-none'
} ${ } ${
block.type === 'h1' block.type === 'h1'