editor?.chain().focus().undo().run()} disabled={!canUndo()} class={btnClass(false, !canUndo())} title="Undo (Ctrl+Z)" data-testid="format-undo" >
editor?.chain().focus().redo().run()} disabled={!canRedo()} class={btnClass(false, !canRedo())} title="Redo (Ctrl+Shift+Z)" data-testid="format-redo" >
toggleDropdown('heading')} class={dropdownBtnClass(editor?.isActive('heading') ?? false)} title="Heading" data-testid="format-heading" >
{#if openDropdown === 'heading'}
{ editor?.chain().focus().toggleHeading({ level: 1 }).run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive('heading', { level: 1 }) ?? false)} data-testid="format-h1" >
H1
Heading 1
{ editor?.chain().focus().toggleHeading({ level: 2 }).run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive('heading', { level: 2 }) ?? false)} data-testid="format-h2" >
H2
Heading 2
{ editor?.chain().focus().toggleHeading({ level: 3 }).run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive('heading', { level: 3 }) ?? false)} data-testid="format-h3" >
H3
Heading 3
{/if}
toggleDropdown('list')} class={dropdownBtnClass((editor?.isActive('bulletList') || editor?.isActive('orderedList')) ?? false)} title="Lists" data-testid="format-list" >
{#if openDropdown === 'list'}
{ editor?.chain().focus().toggleBulletList().run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive('bulletList') ?? false)} data-testid="format-bullet-list" >
Bullet list
{ editor?.chain().focus().toggleOrderedList().run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive('orderedList') ?? false)} data-testid="format-ordered-list" >
Ordered list
{/if}
editor?.chain().focus().toggleBlockquote().run()} class={btnClass(editor?.isActive('blockquote') ?? false)} title="Blockquote" data-testid="format-blockquote" >
editor?.chain().focus().toggleCodeBlock().run()} class={btnClass(editor?.isActive('codeBlock') ?? false)} title="Code block" data-testid="format-code-block" >
editor?.chain().focus().toggleBold().run()} class={btnClass(editor?.isActive('bold') ?? false)} title="Bold (Ctrl+B)" data-testid="format-bold" >
editor?.chain().focus().toggleItalic().run()} class={btnClass(editor?.isActive('italic') ?? false)} title="Italic (Ctrl+I)" data-testid="format-italic" >
editor?.chain().focus().toggleStrike().run()} class={btnClass(editor?.isActive('strike') ?? false)} title="Strikethrough (Ctrl+Shift+X)" data-testid="format-strikethrough" >
editor?.chain().focus().toggleCode().run()} class={btnClass(editor?.isActive('code') ?? false)} title="Inline code (Ctrl+E)" data-testid="format-code" >
editor?.chain().focus().toggleUnderline().run()} class={btnClass(editor?.isActive('underline') ?? false)} title="Underline (Ctrl+U)" data-testid="format-underline" >
toggleDropdown('link')} class={btnClass(editor?.isActive('link') ?? false)} title="Insert link (Ctrl+K)" data-testid="format-link" >
{#if openDropdown === 'link'}
{ e.preventDefault(); applyLink(); }} >
{/if}
toggleDropdown('align')} class={dropdownBtnClass(editor?.isActive({ textAlign: 'center' }) || editor?.isActive({ textAlign: 'right' }) || editor?.isActive({ textAlign: 'justify' }) ? true : false)} title="Text alignment" data-testid="format-align" >
{#if openDropdown === 'align'}
{ editor?.chain().focus().setTextAlign('left').run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive({ textAlign: 'left' }) ?? false)} data-testid="format-align-left" >
Left
{ editor?.chain().focus().setTextAlign('center').run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive({ textAlign: 'center' }) ?? false)} data-testid="format-align-center" >
Center
{ editor?.chain().focus().setTextAlign('right').run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive({ textAlign: 'right' }) ?? false)} data-testid="format-align-right" >
Right
{ editor?.chain().focus().setTextAlign('justify').run(); closeDropdowns(); }} class={dropdownItemClass(editor?.isActive({ textAlign: 'justify' }) ?? false)} data-testid="format-align-justify" >
Justify
{/if}
editor?.chain().focus().setHorizontalRule().run()} class={btnClass()} title="Horizontal rule" data-testid="format-hr" >