@type32/codemirror-rich-obsidian-editor 0.0.21 → 0.0.23

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@type32/codemirror-rich-obsidian-editor",
   "configKey": "cmOfmEditor",
-  "version": "0.0.21",
+  "version": "0.0.23",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/Editor.client.vue

@@ -20,6 +20,7 @@ import wysiwyg from "../editor/wysiwyg";
 import { internalLinkMapFacet } from "../editor/plugins/linkMappingConfig";
 import { specialCodeBlockMapFacet } from "../editor/plugins/specialCodeBlockMappingConfig";
 import { customBracketClosingConfig } from "../editor/plugins/customBracketClosingConfig";
+import { editorKeywordSearchPlugin, searchOptionsFacet } from "../editor/plugins/codemirror-editor-plugins/editorKeywordSearchPlugin";
 import { ref, shallowRef, computed, onMounted, onBeforeUnmount, unref, watch } from "vue";
 const doc = defineModel({ type: String });
 const props = defineProps({
@@ -29,7 +30,8 @@ const props = defineProps({
   bracketClosing: { type: Boolean, required: false },
   foldGutter: { type: Boolean, required: false },
   disabled: { type: Boolean, required: false },
-  debug: { type: Boolean, required: false }
+  debug: { type: Boolean, required: false },
+  searchOptions: { type: Object, required: false }
 });
 const emit = defineEmits(["internal-link-click", "external-link-click"]);
 const extensions = shallowRef([]);
@@ -40,6 +42,7 @@ const specialCodeBlockCompartment = new Compartment();
 const bracketClosingCompartment = new Compartment();
 const foldGutterCompartment = new Compartment();
 const showFrontmatterCompartment = new Compartment();
+const searchCompartment = new Compartment();
 const editorElement = ref();
 const keymaps = computed(() => {
   return props.disabled ? keymap.of([]) : keymap.of([...standardKeymap, ...historyKeymap, indentWithTab]);
@@ -71,6 +74,8 @@ onMounted(() => {
     specialCodeBlockCompartment.of(specialCodeBlockMapFacet.of(props.specialCodeBlockMap || [])),
     bracketClosingCompartment.of(customBracketClosingConfig.of(props.bracketClosing ?? true)),
     foldGutterCompartment.of(props.foldGutter ?? true ? foldGutter() : []),
+    searchCompartment.of(editorKeywordSearchPlugin),
+    searchCompartment.of(searchOptionsFacet.of(props.searchOptions || { query: "" })),
     wysiwygPlugin,
     EditorView.editable.of(unref(!props.disabled))
   ];
@@ -133,6 +138,17 @@ watch(
     }
   }
 );
+watch(
+  () => props.searchOptions,
+  (newOptions) => {
+    if (view.value) {
+      view.value.dispatch({
+        effects: searchCompartment.reconfigure(searchOptionsFacet.of(newOptions || { query: "" }))
+      });
+    }
+  },
+  { deep: true }
+);
 function handleReady(payload) {
   view.value = payload.view;
 }

package/dist/runtime/components/Editor.client.vue.d.ts

@@ -1,5 +1,5 @@
 import { EditorView } from '@codemirror/view';
-import type { InternalLink, SpecialCodeBlockMapping, InternalLinkClickDetail, ExternalLinkClickDetail } from '#codemirror-rich-obsidian-editor/editor-types';
+import type { InternalLink, SpecialCodeBlockMapping, InternalLinkClickDetail, ExternalLinkClickDetail, SearchOptions } from '#codemirror-rich-obsidian-editor/editor-types';
 type __VLS_Props = {
     class?: string;
     internalLinkMap?: InternalLink[];
@@ -8,6 +8,7 @@ type __VLS_Props = {
     foldGutter?: boolean;
     disabled?: boolean;
     debug?: boolean;
+    searchOptions?: SearchOptions;
 };
 type __VLS_PublicProps = __VLS_Props & {
     modelValue?: string;

package/dist/runtime/composables/useDocumentUtils.d.ts

@@ -8,4 +8,5 @@ export declare function useDocumentUtils(): {
     getAvgWordLength: (text: string) => number;
     isEmpty: (text: string) => boolean;
     getTableOfContents: (text: string) => TocEntry[];
+    getAllTags: (text: string) => string[];
 };

package/dist/runtime/composables/useDocumentUtils.js

@@ -48,7 +48,8 @@ export function useDocumentUtils() {
               const textContent = text.slice(from, to).trim();
               toc.push({
                 level,
-                text: textContent
+                text: textContent,
+                node: headerMark
               });
             }
           }
@@ -57,6 +58,30 @@ export function useDocumentUtils() {
     });
     return toc;
   }
+  function getAllTags(text) {
+    const tags = [];
+    if (!text) return tags;
+    const tree = markdown({
+      extensions: [GFM, CustomOFM, { remove: ["SetextHeading"] }]
+    }).language.parser.parse(text);
+    let frontmatterEnd = 0;
+    const frontmatterNode = tree.topNode.firstChild;
+    if (frontmatterNode && frontmatterNode.name === "Frontmatter") {
+      frontmatterEnd = frontmatterNode.to;
+    }
+    tree.iterate({
+      from: frontmatterEnd,
+      enter: (node) => {
+        if (node.name === "Hashtag") {
+          const tagText = text.slice(node.from + 1, node.to);
+          if (tagText) {
+            tags.push(tagText);
+          }
+        }
+      }
+    });
+    return [...new Set(tags)];
+  }
   return {
     getWordCount,
     getLineCount,
@@ -65,6 +90,7 @@ export function useDocumentUtils() {
     getParagraphs,
     getAvgWordLength,
     isEmpty,
-    getTableOfContents
+    getTableOfContents,
+    getAllTags
   };
 }

package/dist/runtime/composables/useEditorUtils.d.ts

@@ -1,6 +1,7 @@
 import type { SyntaxNode, Tree } from '@lezer/common';
 import type { Ref } from 'vue';
 import type { TransactionSpec } from '@codemirror/state';
+import type { SearchMatch, SearchOptions } from '../editor/types/editor-types.js';
 export declare function useEditorUtils(editor: Ref<any>): {
     getDoc: () => string | undefined;
     setDoc: (content: string) => void;
@@ -12,4 +13,18 @@ export declare function useEditorUtils(editor: Ref<any>): {
     findNodesByType: (tree: Tree, nodeTypeName: string) => SyntaxNode[];
     getDocNodesByType: (nodeTypeName: string) => SyntaxNode[];
     hasFrontmatter: () => boolean;
+    search: (options: SearchOptions) => void;
+    replaceAll: (replacement: string) => void;
+    searchResults: Ref<{
+        from: number;
+        to: number;
+    }[], SearchMatch[] | {
+        from: number;
+        to: number;
+    }[]>;
+    currentMatchIndex: Ref<number, number>;
+    findNext: () => void;
+    findPrevious: () => void;
+    replaceCurrent: (replacement: string) => void;
+    scrollToNode: (node: SyntaxNode) => void;
 };

package/dist/runtime/composables/useEditorUtils.js

@@ -1,4 +1,5 @@
-import { computed, unref } from "vue";
+import { computed, ref, unref } from "vue";
+import { EditorView } from "@codemirror/view";
 import { markdown } from "@codemirror/lang-markdown";
 import { CustomOFM } from "../../runtime/editor/lezer-parsers/customOFMParsers";
 import { GFM } from "@lezer/markdown";
@@ -8,6 +9,9 @@ export function useEditorUtils(editor) {
     if (!instance) return;
     return instance.view ?? instance;
   });
+  const searchResults = ref([]);
+  const currentMatchIndex = ref(-1);
+  const searchQuery = ref(null);
   function getDoc() {
     return unref(view)?.state.doc.toString();
   }
@@ -54,7 +58,95 @@ export function useEditorUtils(editor) {
   function hasFrontmatter() {
     const ast = getDocAst();
     if (!ast) return false;
-    return ast.topNode.firstChild?.name === "YAMLFrontMatter";
+    const firstChild = ast.topNode.firstChild;
+    return firstChild?.name === "Frontmatter" || firstChild?.name === "YAMLFrontMatter";
+  }
+  function search(options) {
+    searchQuery.value = options;
+    const doc = getDoc();
+    if (!doc || !options.query) {
+      searchResults.value = [];
+      currentMatchIndex.value = -1;
+      return;
+    }
+    const matches = [];
+    const regex = new RegExp(options.query, options.caseSensitive ? "g" : "gi");
+    let match;
+    while ((match = regex.exec(doc)) !== null) {
+      matches.push({ from: match.index, to: match.index + match[0].length });
+    }
+    searchResults.value = matches;
+    currentMatchIndex.value = -1;
+  }
+  function selectAndScrollToMatch(match) {
+    const editorView = unref(view);
+    if (!editorView || !match) return;
+    editorView.dispatch({
+      selection: { anchor: match.from, head: match.to },
+      effects: EditorView.scrollIntoView(match.from, { y: "center" })
+    });
+  }
+  function findNext() {
+    if (searchResults.value.length === 0) return;
+    const nextIndex = (currentMatchIndex.value + 1) % searchResults.value.length;
+    currentMatchIndex.value = nextIndex;
+    if (!searchResults.value[nextIndex]) {
+      return;
+    }
+    selectAndScrollToMatch(searchResults.value[nextIndex]);
+  }
+  function findPrevious() {
+    if (searchResults.value.length === 0) return;
+    const prevIndex = (currentMatchIndex.value - 1 + searchResults.value.length) % searchResults.value.length;
+    currentMatchIndex.value = prevIndex;
+    if (!searchResults.value[prevIndex]) {
+      return;
+    }
+    selectAndScrollToMatch(searchResults.value[prevIndex]);
+  }
+  function replaceCurrent(replacement) {
+    if (currentMatchIndex.value < 0 || currentMatchIndex.value >= searchResults.value.length) {
+      findNext();
+      return;
+    }
+    const match = searchResults.value[currentMatchIndex.value];
+    if (!match) {
+      findNext();
+      return;
+    }
+    dispatch({
+      changes: { from: match.from, to: match.to, insert: replacement }
+    });
+    if (searchQuery.value) {
+      search(searchQuery.value);
+    }
+  }
+  function replaceAll(replacement) {
+    if (!searchQuery.value || !searchQuery.value.query) return;
+    const doc = getDoc();
+    if (!doc) return;
+    const matches = [];
+    const regex = new RegExp(searchQuery.value.query, searchQuery.value.caseSensitive ? "g" : "gi");
+    let match;
+    while ((match = regex.exec(doc)) !== null) {
+      matches.push({ from: match.index, to: match.index + match[0].length });
+    }
+    if (matches.length === 0) return;
+    const changes = matches.map((m) => ({
+      from: m.from,
+      to: m.to,
+      insert: replacement
+    }));
+    dispatch({ changes });
+    searchResults.value = [];
+    currentMatchIndex.value = -1;
+  }
+  function scrollToNode(node) {
+    const editorView = unref(view);
+    if (!editorView || !node) return;
+    editorView.dispatch({
+      effects: EditorView.scrollIntoView(node.from, { y: "center" })
+    });
   }
   return {
     getDoc,
@@ -66,6 +158,14 @@ export function useEditorUtils(editor) {
     getDocAst,
     findNodesByType,
     getDocNodesByType,
-    hasFrontmatter
+    hasFrontmatter,
+    search,
+    replaceAll,
+    searchResults,
+    currentMatchIndex,
+    findNext,
+    findPrevious,
+    replaceCurrent,
+    scrollToNode
   };
 }

package/dist/runtime/editor/plugins/codemirror-editor-plugins/editorInternalLinkAutocompletePlugin.js

@@ -25,16 +25,33 @@ function internalLinkSource(context) {
     }
   }
   const linkMap = context.state.facet(internalLinkMapFacet);
-  const options = linkMap.filter((link) => link.internalLinkName.toLowerCase().includes(textBefore.toLowerCase())).map((link) => ({
-    label: link.internalLinkName,
-    detail: link.filePath,
-    apply: `${link.internalLinkName}`
-  }));
+  const nameCounts = /* @__PURE__ */ new Map();
+  linkMap.forEach((link) => {
+    nameCounts.set(link.internalLinkName, (nameCounts.get(link.internalLinkName) || 0) + 1);
+  });
+  const searchString = textBefore.toLowerCase();
+  const options = linkMap.filter(
+    (link) => link.internalLinkName.toLowerCase().includes(searchString) || link.filePath && link.filePath.toLowerCase().includes(searchString)
+  ).map((link) => {
+    const isDuplicate = (nameCounts.get(link.internalLinkName) || 0) > 1;
+    if (isDuplicate) {
+      return {
+        label: link.filePath || link.internalLinkName,
+        detail: link.internalLinkName,
+        apply: link.filePath || link.internalLinkName
+      };
+    }
+    return {
+      label: link.internalLinkName,
+      detail: link.filePath,
+      apply: `${link.internalLinkName}`
+    };
+  });
   if (options.length === 0) return null;
   return {
     from,
     options,
-    validFor: /^[\w\s]*$/
+    validFor: /^[^\]|]*/
   };
 }
 export const editorInternalLinkAutocompletePlugin = autocompletion({

package/dist/runtime/editor/plugins/codemirror-editor-plugins/editorKeywordSearchPlugin.d.ts

@@ -0,0 +1,5 @@
+import { StateField, Facet } from '@codemirror/state';
+import type { DecorationSet } from '@codemirror/view';
+import type { SearchOptions } from '../../types/editor-types.js';
+export declare const searchOptionsFacet: Facet<SearchOptions, SearchOptions>;
+export declare const editorKeywordSearchPlugin: StateField<DecorationSet>;

package/dist/runtime/editor/plugins/codemirror-editor-plugins/editorKeywordSearchPlugin.js

@@ -0,0 +1,38 @@
+import { Decoration, EditorView } from "@codemirror/view";
+import { StateField, RangeSet, Facet } from "@codemirror/state";
+export const searchOptionsFacet = Facet.define({
+  combine: (values) => values[0] || { query: "", caseSensitive: false }
+});
+const highlightMark = Decoration.mark({ class: "cm-highlight-keyword" });
+function findKeywords(doc, { query, caseSensitive }) {
+  const decorations = [];
+  if (!query) return decorations;
+  const flags = caseSensitive ? "g" : "gi";
+  const regex = new RegExp(query, flags);
+  for (let i = 1; i <= doc.lines; i++) {
+    const line = doc.line(i);
+    for (const match of line.text.matchAll(regex)) {
+      if (match.index !== void 0) {
+        const from = line.from + match.index;
+        const to = from + match[0].length;
+        decorations.push(highlightMark.range(from, to));
+      }
+    }
+  }
+  return decorations;
+}
+export const editorKeywordSearchPlugin = StateField.define({
+  create(state) {
+    const options = state.facet(searchOptionsFacet);
+    return RangeSet.of(findKeywords(state.doc, options));
+  },
+  update(value, tr) {
+    const options = tr.state.facet(searchOptionsFacet);
+    const oldOptions = tr.startState.facet(searchOptionsFacet);
+    if (tr.docChanged || options.query !== oldOptions.query || options.caseSensitive !== oldOptions.caseSensitive) {
+      return RangeSet.of(findKeywords(tr.state.doc, options));
+    }
+    return value.map(tr.changes);
+  },
+  provide: (f) => EditorView.decorations.from(f)
+});

package/dist/runtime/editor/plugins/codemirror-plugin-proses/proseInternalLinkCodemirrorViewPlugin.js

@@ -22,7 +22,7 @@ function buildInternalLinkDecorations(state) {
         const pathNode = node.node.getChild("InternalLink")?.getChild("InternalPath");
         if (pathNode) {
           const path = state.doc.sliceString(pathNode.from, pathNode.to);
-          const linkInfo = linkMap.find((l) => l.internalLinkName === path);
+          const linkInfo = linkMap.find((l) => l.internalLinkName === path || l.filePath === path);
           if (linkInfo?.embedComponent) {
             const line = state.doc.lineAt(node.from);
             const props = { linkData: linkInfo };
@@ -58,7 +58,7 @@ function buildInternalLinkDecorations(state) {
         const aliasNode = contentContainerNode.getChild("InternalDisplay");
         const subpath = subpathNode ? state.doc.sliceString(subpathNode.from, subpathNode.to) : void 0;
         const alias = aliasNode ? state.doc.sliceString(aliasNode.from, aliasNode.to) : void 0;
-        const linkInfo = linkMap.find((l) => l.internalLinkName === path);
+        const linkInfo = linkMap.find((l) => l.internalLinkName === path || l.filePath === path);
         if (node.name === "Embed" && linkInfo?.embedComponent) {
           return false;
         }

package/dist/runtime/editor/types/editor-types.d.ts

@@ -1,5 +1,6 @@
 import type { Component } from 'vue'
 import type { LanguageSupport } from '@codemirror/language'
+import type { SyntaxNode } from '@lezer/common'
 
 export interface InternalLink {
     internalLinkName: string;
@@ -55,5 +56,16 @@ export type UnicodeRange = number[][]
 
 export interface TocEntry {
 	level: number
-	text: string
+	text: string,
+    node: SyntaxNode
+}
+
+export interface SearchMatch {
+	from: number;
+	to: number;
+}
+
+export interface SearchOptions {
+	query: string;
+	caseSensitive?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@type32/codemirror-rich-obsidian-editor",
-	"version": "0.0.21",
+	"version": "0.0.23",
 	"description": "OFM Editor Component for Nuxt.",
 	"repository": "Type-32/codemirror-rich-obsidian",
 	"license": "MIT",
@@ -45,7 +45,7 @@
 		"@lezer/markdown": "^1.4.3",
 		"@nuxt/image": "1.10.0",
 		"@nuxt/kit": "^4.1.2",
-		"@nuxt/ui": "^4.0.0-alpha.2",
+		"@nuxt/ui": "^4.0.0",
 		"alfaaz": "^1.1.0",
 		"codemirror": "^6.0.2",
 		"js-yaml": "^4.1.0",
@@ -57,8 +57,8 @@
 	},
 	"devDependencies": {
 		"@iconify-json/lucide": "^1.2.68",
-		"@iconify-json/simple-icons": "^1.2.52",
-		"@nuxt/devtools": "^2.6.3",
+		"@iconify-json/simple-icons": "^1.2.53",
+		"@nuxt/devtools": "^2.6.5",
 		"@nuxt/eslint-config": "^1.9.0",
 		"@nuxt/fonts": "0.11.4",
 		"@nuxt/icon": "1.15.0",
@@ -68,11 +68,11 @@
 		"@types/js-yaml": "^4.0.9",
 		"@types/node": "latest",
 		"changelogen": "^0.6.2",
-		"eslint": "^9.35.0",
+		"eslint": "^9.36.0",
 		"nuxt": "^4.1.2",
 		"typescript": "~5.9.2",
 		"vitest": "^3.2.4",
-		"vue-tsc": "^3.0.7",
+		"vue-tsc": "^3.0.8",
 		"alfaaz": "^1.1.0"
 	},
 	"trustedDependencies": [