minor
This commit is contained in:
parent
a99164b504
commit
3851d17540
|
@ -41,7 +41,7 @@ export const BlockquoteBubbleMenu = (props: Props) => {
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
</Popover>
|
</Popover>
|
||||||
<Popover content={t('Alignment center')}>
|
<Popover content={t('Alignment right')}>
|
||||||
{(triggerRef: (el: HTMLElement) => void) => (
|
{(triggerRef: (el: HTMLElement) => void) => (
|
||||||
<button
|
<button
|
||||||
ref={triggerRef}
|
ref={triggerRef}
|
||||||
|
|
|
@ -125,7 +125,12 @@ export const EditorFloatingMenu = (props: FloatingMenuProps) => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div ref={props.ref} class={styles.editorFloatingMenu}>
|
<div ref={props.ref} class={styles.editorFloatingMenu}>
|
||||||
<button ref={setPlusButtonRef} type="button" onClick={() => setMenuOpen(!menuOpen())}>
|
<button
|
||||||
|
class={styles.actionButton}
|
||||||
|
ref={setPlusButtonRef}
|
||||||
|
type="button"
|
||||||
|
onClick={() => setMenuOpen(!menuOpen())}
|
||||||
|
>
|
||||||
<Icon name="editor-plus" />
|
<Icon name="editor-plus" />
|
||||||
</button>
|
</button>
|
||||||
<Show when={menuOpen()}>
|
<Show when={menuOpen()}>
|
||||||
|
|
|
@ -1,11 +1,12 @@
|
||||||
import type { Editor } from '@tiptap/core'
|
import type { Editor } from '@tiptap/core'
|
||||||
|
import { clsx } from 'clsx'
|
||||||
import { Accessor, Show, createSignal, onCleanup, onMount } from 'solid-js'
|
import { Accessor, Show, createSignal, onCleanup, onMount } from 'solid-js'
|
||||||
import { Icon } from '~/components/_shared/Icon'
|
import { Icon } from '~/components/_shared/Icon'
|
||||||
|
import { useEditorContext } from '~/context/editor'
|
||||||
import { InsertLinkForm } from './InsertLinkForm'
|
import { InsertLinkForm } from './InsertLinkForm'
|
||||||
|
import { ToolbarControl } from './ToolbarControl'
|
||||||
|
|
||||||
import clsx from 'clsx'
|
|
||||||
import styles from './MicroBubbleMenu.module.scss'
|
import styles from './MicroBubbleMenu.module.scss'
|
||||||
import ToolbarControl from './ToolbarControl'
|
|
||||||
|
|
||||||
type MicroBubbleMenuProps = {
|
type MicroBubbleMenuProps = {
|
||||||
editor: Accessor<Editor | undefined>
|
editor: Accessor<Editor | undefined>
|
||||||
|
@ -15,6 +16,7 @@ type MicroBubbleMenuProps = {
|
||||||
|
|
||||||
export const MicroBubbleMenu = (props: MicroBubbleMenuProps) => {
|
export const MicroBubbleMenu = (props: MicroBubbleMenuProps) => {
|
||||||
const [linkEditorOpen, setLinkEditorOpen] = createSignal(false)
|
const [linkEditorOpen, setLinkEditorOpen] = createSignal(false)
|
||||||
|
const { editing } = useEditorContext()
|
||||||
|
|
||||||
const handleOpenLinkForm = () => {
|
const handleOpenLinkForm = () => {
|
||||||
const { from, to } = props.editor()!.state.selection
|
const { from, to } = props.editor()!.state.selection
|
||||||
|
@ -29,8 +31,8 @@ export const MicroBubbleMenu = (props: MicroBubbleMenuProps) => {
|
||||||
props.editor()?.chain().focus().setTextSelection(to).run()
|
props.editor()?.chain().focus().setTextSelection(to).run()
|
||||||
}
|
}
|
||||||
|
|
||||||
// handle ctrl+k to insert link
|
|
||||||
const handleKeyDown = (event: KeyboardEvent) => {
|
const handleKeyDown = (event: KeyboardEvent) => {
|
||||||
|
// handle ctrl+k to insert link
|
||||||
if (
|
if (
|
||||||
event.code === 'KeyK' &&
|
event.code === 'KeyK' &&
|
||||||
(event.metaKey || event.ctrlKey) &&
|
(event.metaKey || event.ctrlKey) &&
|
||||||
|
@ -39,6 +41,12 @@ export const MicroBubbleMenu = (props: MicroBubbleMenuProps) => {
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
setLinkEditorOpen((prev) => !prev)
|
setLinkEditorOpen((prev) => !prev)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// handle shift+enter to change focus
|
||||||
|
if (event.code === 'Enter' && (event.metaKey || event.shiftKey)) {
|
||||||
|
event.preventDefault()
|
||||||
|
editing()?.commands.focus()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
onMount(() => {
|
onMount(() => {
|
||||||
|
|
Loading…
Reference in New Issue
Block a user