This commit is contained in:
Untone 2024-09-27 17:27:01 +03:00
parent 7aa01d6152
commit 90057a2d0e

View File

@ -3,10 +3,7 @@ import CharacterCount from '@tiptap/extension-character-count'
import Placeholder from '@tiptap/extension-placeholder' import Placeholder from '@tiptap/extension-placeholder'
import clsx from 'clsx' import clsx from 'clsx'
import { type JSX, Show, createEffect, createSignal, on, onCleanup } from 'solid-js' import { type JSX, Show, createEffect, createSignal, on, onCleanup } from 'solid-js'
import { import { createTiptapEditor, useEditorHTML } from 'solid-tiptap'
createTiptapEditor,
useEditorHTML,
} from 'solid-tiptap'
import { Toolbar } from 'terracotta' import { Toolbar } from 'terracotta'
import { Icon } from '~/components/_shared/Icon/Icon' import { Icon } from '~/components/_shared/Icon/Icon'
import { Popover } from '~/components/_shared/Popover/Popover' import { Popover } from '~/components/_shared/Popover/Popover'
@ -104,13 +101,15 @@ export default function MiniEditor(props: MiniEditorProps): JSX.Element {
toolbarElement()?.removeEventListener('mousedown', handleMouseDownOnToolbar) toolbarElement()?.removeEventListener('mousedown', handleMouseDownOnToolbar)
}) })
return ( return (
<div <div class={clsx(styles.SimplifiedEditor, styles.bordered, styles.isFocused)}>
class={clsx(styles.SimplifiedEditor, styles.bordered, styles.isFocused)}
>
<div> <div>
<div id="mini-editor" ref={setEditorElement} /> <div id="mini-editor" ref={setEditorElement} />
<Toolbar style={{ 'background-color': 'white', display: 'inline-flex' }} ref={setToolbarElement} horizontal> <Toolbar
style={{ 'background-color': 'white', display: 'inline-flex' }}
ref={setToolbarElement}
horizontal
>
<Show when={editor()} keyed> <Show when={editor()} keyed>
{(instance) => ( {(instance) => (
<div class={styles.controls}> <div class={styles.controls}>
@ -172,7 +171,6 @@ export default function MiniEditor(props: MiniEditorProps): JSX.Element {
{counter()} / {props.limit || '∞'} {counter()} / {props.limit || '∞'}
</small> </small>
</Show> </Show>
</div> </div>
</div> </div>
) )