Search: Added exact/filter/tag term negation support

[bookstack] / resources / js / wysiwyg / ui / defaults / forms / objects.ts

diff --git a/resources/js/wysiwyg/ui/defaults/forms/objects.ts b/resources/js/wysiwyg/ui/defaults/forms/objects.ts
index 6bd265e6c2a70b81bb2564d335e44f31ffc93df6..228566d442e5ce8c609dc4d363b3b29550f26bf3 100644 (file)
--- a/resources/js/wysiwyg/ui/defaults/forms/objects.ts
+++ b/resources/js/wysiwyg/ui/defaults/forms/objects.ts
@@ -5,12 +5,12 @@ import {
     EditorSelectFormFieldDefinition
 } from "../../framework/forms";
 import {EditorUiContext} from "../../framework/core";
-import {$createTextNode, $getSelection, $insertNodes} from "lexical";
+import {$createNodeSelection, $createTextNode, $getSelection, $insertNodes, $setSelection} from "lexical";
 import {$isImageNode, ImageNode} from "../../../nodes/image";
-import {$createLinkNode, $isLinkNode} from "@lexical/link";
+import {$createLinkNode, $isLinkNode, LinkNode} from "@lexical/link";
 import {$createMediaNodeFromHtml, $createMediaNodeFromSrc, $isMediaNode, MediaNode} from "../../../nodes/media";
 import {$insertNodeToNearestRoot} from "@lexical/utils";
-import {$getNodeFromSelection} from "../../../utils/selection";
+import {$getNodeFromSelection, getLastSelection} from "../../../utils/selection";
 import {EditorFormModal} from "../../framework/modals";
 import {EditorActionField} from "../../framework/blocks/action-field";
 import {EditorButton} from "../../framework/buttons";
@@ -18,6 +18,8 @@ import {showImageManager} from "../../../utils/images";
 import searchImageIcon from "@icons/editor/image-search.svg";
 import searchIcon from "@icons/search.svg";
 import {showLinkSelector} from "../../../utils/links";
+import {LinkField} from "../../framework/blocks/link-field";
+import {insertOrUpdateLink} from "../../../utils/formats";
 
 export function $showImageForm(image: ImageNode, context: EditorUiContext) {
     const imageModal: EditorFormModal = context.manager.createModal('image');
@@ -38,7 +40,8 @@ export const image: EditorFormDefinition = {
     submitText: 'Apply',
     async action(formData, context: EditorUiContext) {
         context.editor.update(() => {
-            const selectedImage = $getNodeFromSelection(context.lastSelection, $isImageNode);
+            const selection = getLastSelection(context.editor);
+            const selectedImage = $getNodeFromSelection(selection, $isImageNode);
             if ($isImageNode(selectedImage)) {
                 selectedImage.setSrc(formData.get('src')?.toString() || '');
                 selectedImage.setAltText(formData.get('alt')?.toString() || '');
@@ -94,37 +97,42 @@ export const image: EditorFormDefinition = {
     ],
 };
 
-export const link: EditorFormDefinition = {
-    submitText: 'Apply',
-    async action(formData, context: EditorUiContext) {
-        context.editor.update(() => {
+export function $showLinkForm(link: LinkNode|null, context: EditorUiContext) {
+    const linkModal = context.manager.createModal('link');
+
+    if (link) {
+        const formDefaults: Record<string, string> = {
+            url: link.getURL(),
+            text: link.getTextContent(),
+            title: link.getTitle() || '',
+            target: link.getTarget() || '',
+        }
 
-            const url = formData.get('url')?.toString() || '';
-            const title = formData.get('title')?.toString() || ''
-            const target = formData.get('target')?.toString() || '';
-            const text = formData.get('text')?.toString() || '';
+        context.editor.update(() => {
+            const selection = $createNodeSelection();
+            selection.add(link.getKey());
+            $setSelection(selection);
+        });
 
+        linkModal.show(formDefaults);
+    } else {
+        context.editor.getEditorState().read(() => {
             const selection = $getSelection();
-            let link = $getNodeFromSelection(selection, $isLinkNode);
-            if ($isLinkNode(link)) {
-                link.setURL(url);
-                link.setTarget(target);
-                link.setTitle(title);
-            } else {
-                link = $createLinkNode(url, {
-                    title: title,
-                    target: target,
-                });
-
-                $insertNodes([link]);
-            }
+            const text = selection?.getTextContent() || '';
+            const formDefaults = {text};
+            linkModal.show(formDefaults);
+        });
+    }
+}
 
-            if ($isLinkNode(link)) {
-                for (const child of link.getChildren()) {
-                    child.remove(true);
-                }
-                link.append($createTextNode(text));
-            }
+export const link: EditorFormDefinition = {
+    submitText: 'Apply',
+    async action(formData, context: EditorUiContext) {
+        insertOrUpdateLink(context.editor, {
+            url: formData.get('url')?.toString() || '',
+            title: formData.get('title')?.toString() || '',
+            target: formData.get('target')?.toString() || '',
+            text: formData.get('text')?.toString() || '',
         });
         return true;
     },
@@ -132,11 +140,11 @@ export const link: EditorFormDefinition = {
         {
             build() {
                 return new EditorActionField(
-                    new EditorFormField({
+                    new LinkField(new EditorFormField({
                         label: 'URL',
                         name: 'url',
                         type: 'text',
-                    }),
+                    })),
                     new EditorButton({
                         label: 'Browse links',
                         icon: searchIcon,
@@ -195,7 +203,7 @@ export const media: EditorFormDefinition = {
                 if (selectedNode && node) {
                     selectedNode.replace(node)
                 } else if (node) {
-                    $insertNodeToNearestRoot(node);
+                    $insertNodes([node]);
                 }
             });
 
@@ -211,7 +219,7 @@ export const media: EditorFormDefinition = {
             updateNode.setSrc(src);
             updateNode.setWidthAndHeight(width, height);
             if (!selectedNode) {
-                $insertNodeToNearestRoot(updateNode);
+                $insertNodes([updateNode]);
             }
         });