mirror of
https://github.com/docmost/docmost.git
synced 2025-11-10 06:42:06 +10:00
fix menus
This commit is contained in:
@ -50,6 +50,7 @@ export function CalloutMenu({ editor }: EditorMenuProps) {
|
||||
);
|
||||
|
||||
const getReferencedVirtualElement = useCallback(() => {
|
||||
if (!editor) return;
|
||||
const { selection } = editor.state;
|
||||
const predicate = (node: PMNode) => node.type.name === "callout";
|
||||
const parent = findParentNode(predicate)(selection);
|
||||
@ -63,9 +64,6 @@ export function CalloutMenu({ editor }: EditorMenuProps) {
|
||||
};
|
||||
}
|
||||
|
||||
console.log('callout')
|
||||
|
||||
|
||||
const domRect = posToDOMRect(editor.view, selection.from, selection.to);
|
||||
return {
|
||||
getBoundingClientRect: () => domRect,
|
||||
@ -117,7 +115,7 @@ export function CalloutMenu({ editor }: EditorMenuProps) {
|
||||
return (
|
||||
<BaseBubbleMenu
|
||||
editor={editor}
|
||||
pluginKey={`callout-menu}`}
|
||||
pluginKey={`callout-menu`}
|
||||
updateDelay={0}
|
||||
getReferencedVirtualElement={getReferencedVirtualElement}
|
||||
options={{
|
||||
|
||||
@ -36,6 +36,7 @@ export function DrawioMenu({ editor }: EditorMenuProps) {
|
||||
});
|
||||
|
||||
const getReferencedVirtualElement = useCallback(() => {
|
||||
if (!editor) return;
|
||||
const { selection } = editor.state;
|
||||
const predicate = (node: PMNode) => node.type.name === "drawio";
|
||||
const parent = findParentNode(predicate)(selection);
|
||||
|
||||
@ -38,6 +38,7 @@ export function ExcalidrawMenu({ editor }: EditorMenuProps) {
|
||||
});
|
||||
|
||||
const getReferencedVirtualElement = useCallback(() => {
|
||||
if (!editor) return;
|
||||
const { selection } = editor.state;
|
||||
const predicate = (node: PMNode) => node.type.name === "excalidraw";
|
||||
const parent = findParentNode(predicate)(selection);
|
||||
|
||||
@ -49,6 +49,7 @@ export function ImageMenu({ editor }: EditorMenuProps) {
|
||||
);
|
||||
|
||||
const getReferencedVirtualElement = useCallback(() => {
|
||||
if (!editor) return;
|
||||
const { selection } = editor.state;
|
||||
const predicate = (node: PMNode) => node.type.name === "image";
|
||||
const parent = findParentNode(predicate)(selection);
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
|
||||
import { offset } from "@floating-ui/dom";
|
||||
import React, { useCallback, useState } from "react";
|
||||
import { EditorMenuProps } from "@/features/editor/components/table/types/types.ts";
|
||||
import { LinkEditorPanel } from "@/features/editor/components/link/link-editor-panel.tsx";
|
||||
import { LinkPreviewPanel } from "@/features/editor/components/link/link-preview.tsx";
|
||||
import { Card } from "@mantine/core";
|
||||
import { useEditorState } from "@tiptap/react";
|
||||
|
||||
export function LinkMenu({ editor, appendTo }: EditorMenuProps) {
|
||||
const [showEdit, setShowEdit] = useState(false);
|
||||
@ -13,7 +13,19 @@ export function LinkMenu({ editor, appendTo }: EditorMenuProps) {
|
||||
return editor.isActive("link");
|
||||
}, [editor]);
|
||||
|
||||
const { href: link } = editor.getAttributes("link");
|
||||
const editorState = useEditorState({
|
||||
editor,
|
||||
selector: (ctx) => {
|
||||
if (!ctx.editor) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const link = ctx.editor.getAttributes("link");
|
||||
return {
|
||||
href: link.href,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
const handleEdit = useCallback(() => {
|
||||
setShowEdit(true);
|
||||
@ -49,7 +61,7 @@ export function LinkMenu({ editor, appendTo }: EditorMenuProps) {
|
||||
return (
|
||||
<BaseBubbleMenu
|
||||
editor={editor}
|
||||
pluginKey={`link-menu}`}
|
||||
pluginKey={`link-menu`}
|
||||
updateDelay={0}
|
||||
options={{
|
||||
onHide: () => {
|
||||
@ -57,7 +69,7 @@ export function LinkMenu({ editor, appendTo }: EditorMenuProps) {
|
||||
},
|
||||
placement: "bottom",
|
||||
offset: 5,
|
||||
// zIndex: 101,
|
||||
// zIndex: 101,
|
||||
}}
|
||||
shouldShow={shouldShow}
|
||||
>
|
||||
@ -68,11 +80,14 @@ export function LinkMenu({ editor, appendTo }: EditorMenuProps) {
|
||||
padding="xs"
|
||||
bg="var(--mantine-color-body)"
|
||||
>
|
||||
<LinkEditorPanel initialUrl={link} onSetLink={onSetLink} />
|
||||
<LinkEditorPanel
|
||||
initialUrl={editorState.href}
|
||||
onSetLink={onSetLink}
|
||||
/>
|
||||
</Card>
|
||||
) : (
|
||||
<LinkPreviewPanel
|
||||
url={link}
|
||||
url={editorState.href}
|
||||
onClear={onUnsetLink}
|
||||
onEdit={handleEdit}
|
||||
/>
|
||||
|
||||
@ -34,6 +34,7 @@ export const LinkPreviewPanel = ({
|
||||
rel="noopener noreferrer"
|
||||
className={classes.link}
|
||||
>
|
||||
ss
|
||||
{url}
|
||||
</Anchor>
|
||||
</Tooltip>
|
||||
|
||||
@ -58,7 +58,7 @@ export const SubpagesMenu = React.memo(
|
||||
return (
|
||||
<BaseBubbleMenu
|
||||
editor={editor}
|
||||
pluginKey={`subpages-menu}`}
|
||||
pluginKey={`subpages-menu`}
|
||||
updateDelay={0}
|
||||
/* tippyOptions={{
|
||||
getReferenceClientRect,
|
||||
|
||||
@ -49,6 +49,7 @@ export function VideoMenu({ editor }: EditorMenuProps) {
|
||||
);
|
||||
|
||||
const getReferencedVirtualElement = useCallback(() => {
|
||||
if (!editor) return;
|
||||
const { selection } = editor.state;
|
||||
const predicate = (node: PMNode) => node.type.name === "video";
|
||||
const parent = findParentNode(predicate)(selection);
|
||||
|
||||
Submodule apps/server/src/ee updated: 3af21def15...d2ead43181
Reference in New Issue
Block a user