Tabe controls stable

This commit is contained in:
2026-03-13 16:11:57 -05:00
parent cb8c81c299
commit abbdb993d5
4 changed files with 39 additions and 37 deletions
+29 -27
View File
@@ -322,36 +322,38 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
// Handle full screen images as before
return (
<div class="relative w-full flex flex-col flex-1">
<div
class="absolute -top-6 -left-4 -right-4 h-8 cursor-pointer group flex items-center justify-center z-10"
onClick={() => {
const e = editor();
if (!e) return;
e.chain().insertContentAt(0, '<p></p>').focus('start').run();
}}
title="Add empty line at the top"
>
<span class="opacity-0 group-hover:opacity-100 text-[10px] uppercase font-bold text-muted-foreground tracking-widest transition-opacity mt-1">
Click to insert newline above
</span>
</div>
<div class="w-full h-full flex flex-col">
<Show when={editor()}>
{(e) => <TableBubbleMenu editor={e()} />}
</Show>
<div
ref={editorRef}
class="w-full flex-1 cursor-text"
onClick={(e) => {
const target = e.target as HTMLElement;
if (target.tagName.toLowerCase() === 'img') {
setFullscreenImage((target as HTMLImageElement).src);
} else if (e.target === editorRef) {
// Focus end if clicking on padding below content
editor()?.chain().focus().run();
}
}}
/>
<div class="w-full flex-1 flex flex-col">
<div
class="w-full h-8 cursor-pointer group flex items-center justify-center shrink-0 transition-all"
onClick={() => {
const e = editor();
if (!e) return;
e.chain().insertContentAt(0, '<p></p>').focus('start').run();
}}
title="Add empty line at the top"
>
<span class="opacity-0 group-hover:opacity-100 text-[10px] uppercase font-bold text-muted-foreground tracking-widest transition-opacity">
Click to insert newline above
</span>
</div>
<div
ref={editorRef}
class="w-full flex-1 cursor-text"
onClick={(e) => {
const target = e.target as HTMLElement;
if (target.tagName.toLowerCase() === 'img') {
setFullscreenImage((target as HTMLImageElement).src);
} else if (e.target === editorRef) {
// Focus end if clicking on padding below content
editor()?.chain().focus().run();
}
}}
/>
</div>
{/* Note Preview Popover */}
<Show when={previewNote() && store.notes.find(n => n.id === previewNote()!.noteId)}>