@type32/codemirror-rich-obsidian-editor 0.0.9 → 0.0.10

package/dist/module.json

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

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

@@ -14,6 +14,7 @@ import {
 import { standardKeymap, history, historyKeymap, indentWithTab } from "@codemirror/commands";
 import { defaultHighlightStyle, syntaxHighlighting, indentOnInput, foldGutter, syntaxTree } from "@codemirror/language";
 import { Compartment, RangeSetBuilder } from "@codemirror/state";
+import { LanguageSupport, LRLanguage } from "@codemirror/language";
 import { languages } from "@codemirror/language-data";
 import wysiwyg from "../editor/wysiwyg";
 import { internalLinkMapFacet } from "../editor/plugins/linkMappingConfig";
@@ -43,10 +44,17 @@ const editorElement = ref();
 const keymaps = computed(() => {
   return props.disabled ? keymap.of([]) : keymap.of([...standardKeymap, ...historyKeymap, indentWithTab]);
 });
+async function loadLanguage(info) {
+  const lang = languages.find((l) => l.name.toLowerCase() === info.toLowerCase() || l.alias.map((a) => a.toLowerCase()).includes(info.toLowerCase()));
+  if (lang) {
+    return await lang.load();
+  }
+  throw new Error(`Language ${info} not found`);
+}
 onMounted(() => {
   const wysiwygPlugin = wysiwyg({
     lezer: {
-      codeLanguages: languages
+      codeLanguages: loadLanguage
     }
   });
   extensions.value = [

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

@@ -1,5 +1,5 @@
 import { EditorView } from '@codemirror/view';
-import type { InternalLink, SpecialCodeBlockMapping } from '#codemirror-rich-obsidian-editor/editor-types';
+import type { InternalLink, SpecialCodeBlockMapping, InternalLinkClickDetail, ExternalLinkClickDetail } from '#codemirror-rich-obsidian-editor/editor-types';
 type __VLS_Props = {
     class?: string;
     internalLinkMap?: InternalLink[];
@@ -15,12 +15,12 @@ type __VLS_PublicProps = __VLS_Props & {
 declare const _default: import("vue").DefineComponent<__VLS_PublicProps, {
     view: import("vue").ShallowRef<EditorView | undefined, EditorView | undefined>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "internal-link-click": (...args: any[]) => void;
-    "external-link-click": (...args: any[]) => void;
-    "update:modelValue": (value: string | undefined) => void;
+    "internal-link-click": (detail: InternalLinkClickDetail) => any;
+    "external-link-click": (detail: ExternalLinkClickDetail) => any;
+    "update:modelValue": (value: string | undefined) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onInternal-link-click"?: ((...args: any[]) => any) | undefined;
-    "onExternal-link-click"?: ((...args: any[]) => any) | undefined;
+    "onInternal-link-click"?: ((detail: InternalLinkClickDetail) => any) | undefined;
+    "onExternal-link-click"?: ((detail: ExternalLinkClickDetail) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

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

@@ -1,5 +1,6 @@
 import { EditorView } from "@codemirror/view";
 import { syntaxTree } from "@codemirror/language";
+import { internalLinkMapFacet } from "../linkMappingConfig.js";
 export const editorLinkClickPlugin = EditorView.domEventHandlers({
   mousedown(event, view) {
     let target = event.target;
@@ -21,21 +22,36 @@ export const editorLinkClickPlugin = EditorView.domEventHandlers({
     }
     if (anchor.dataset.internalLink === "true") {
       event.preventDefault();
+      const path = anchor.dataset.path;
+      if (!path) return true;
+      const linkMap = view.state.facet(internalLinkMapFacet);
+      const linkInfo = linkMap.find((l) => l.internalLinkName === path);
+      const type = anchor.dataset.type;
+      const detail = {
+        path,
+        subpath: anchor.dataset.subpath,
+        display: anchor.dataset.display,
+        type: type || "internal-link",
+        redirectToPath: linkInfo?.redirectToPath
+      };
       view.dom.dispatchEvent(new CustomEvent("internal-link-click", {
         bubbles: true,
         composed: true,
-        detail: {
-          path: anchor.dataset.path,
-          subpath: anchor.dataset.subpath,
-          display: anchor.dataset.display,
-          type: anchor.dataset.type
-        }
+        detail
       }));
     } else if (anchor.dataset.externalLink === "true") {
       event.preventDefault();
       const url = anchor.dataset.url;
       if (url) {
-        window.open(url, "_blank");
+        const detail = {
+          url,
+          text: anchor.textContent
+        };
+        view.dom.dispatchEvent(new CustomEvent("external-link-click", {
+          bubbles: true,
+          composed: true,
+          detail
+        }));
       }
     }
     return true;

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

@@ -1,4 +1,5 @@
 import type { Component } from 'vue'
+import type { LanguageSupport } from '@codemirror/language'
 
 export interface InternalLink {
     internalLinkName: string;
@@ -7,11 +8,27 @@ export interface InternalLink {
     embedComponent?: Component;
 }
 
+export interface InternalLinkClickDetail {
+    path: string;
+    subpath?: string;
+    display?: string;
+    type: 'embed' | 'internal-link';
+    redirectToPath?: string;
+}
+
+export interface ExternalLinkClickDetail {
+    url: string;
+    text: string | null;
+}
+
 export interface SpecialCodeBlockMapping {
     codeInfo: string
     component: Component
 }
 
 export type WysiwygPlugin = {
-  lezer?: any
+  lezer?: {
+      codeLanguages?: (info: string) => LanguageSupport | Promise<LanguageSupport> | null
+      [key: string]: any
+  }
 }

package/dist/runtime/editor/wysiwyg.js

@@ -33,9 +33,10 @@ import { editorLivePreviewField, proseTaskListPlugin } from "./plugins/codemirro
 import { proseCalloutPlugin } from "./plugins/codemirror-plugin-proses/proseCalloutPlugin.js";
 import { indentationListPlugin } from "./plugins/codemirror-editor-plugins/indentationListPlugin.js";
 export default function(config) {
+  const { codeLanguages, ...lezerRest } = config?.lezer ?? {};
   const mergedConfig = {
-    ...config?.lezer ?? [],
-    // Spreads user-passed lezer config (like codeLanguages)
+    ...lezerRest ?? [],
+    codeLanguages,
     extensions: [
       GFM,
       CustomOFM,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@type32/codemirror-rich-obsidian-editor",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "description": "OFM Editor Component for Nuxt.",
   "repository": "Type-32/codemirror-rich-obsidian",
   "license": "MIT",