Merge pull request #176 from gaelj/release

Release 0.8.6

CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## 0.8.6 - 2024-04-09
+
+### 🐛 Fix a bug
+
+- Don't apply base link url to full links
+- Fix full link detection
+- Fix initial setting of base link URLs again
+
+## 0.8.6 - 2024-04-09
+
+### 🐛 Fix a bug
+
+- Don't apply base link url to full links
+- Fix full link detection
+- Fix initial setting of base link URLs again
+
 ## 0.8.5 - 2024-04-09
 
 ### ✨ Introduce new features

CodeMirror6/CodeMirror6.csproj

@@ -9,7 +9,7 @@
     <AssemblyName>GaelJ.BlazorCodeMirror6</AssemblyName>
     <IsPackable>true</IsPackable>
     <PackageId>GaelJ.BlazorCodeMirror6</PackageId>
-    <Version>0.8.5</Version>
+    <Version>0.8.6</Version>
     <IncludeSymbols>true</IncludeSymbols>
     <SymbolPackageFormat>snupkg</SymbolPackageFormat>
     <GenerateDocumentationFile>true</GenerateDocumentationFile>

CodeMirror6/NodeLib/src/CmHyperlink.ts

@@ -8,7 +8,6 @@ import {
     ViewUpdate,
 } from '@codemirror/view';
 import { Extension, Range } from '@codemirror/state';
-import { CMInstances } from './CmInstance';
 
 const linkSvgImage = `<svg viewBox="0 0 1024 1024" width="16" height="16" fill="currentColor"><path d="M607.934444 417.856853c-6.179746-6.1777-12.766768-11.746532-19.554358-16.910135l-0.01228 0.011256c-6.986111-6.719028-16.47216-10.857279-26.930349-10.857279-21.464871 0-38.864146 17.400299-38.864146 38.864146 0 9.497305 3.411703 18.196431 9.071609 24.947182l-0.001023 0c0.001023 0.001023 0.00307 0.00307 0.005117 0.004093 2.718925 3.242857 5.953595 6.03853 9.585309 8.251941 3.664459 3.021823 7.261381 5.997598 10.624988 9.361205l3.203972 3.204995c40.279379 40.229237 28.254507 109.539812-12.024871 149.820214L371.157763 796.383956c-40.278355 40.229237-105.761766 40.229237-146.042167 0l-3.229554-3.231601c-40.281425-40.278355-40.281425-105.809861 0-145.991002l75.93546-75.909877c9.742898-7.733125 15.997346-19.668968 15.997346-33.072233 0-23.312962-18.898419-42.211381-42.211381-42.211381-8.797363 0-16.963347 2.693342-23.725354 7.297197-0.021489-0.045025-0.044002-0.088004-0.066515-0.134053l-0.809435 0.757247c-2.989077 2.148943-5.691629 4.669346-8.025791 7.510044l-78.913281 73.841775c-74.178443 74.229608-74.178443 195.632609 0 269.758863l3.203972 3.202948c74.178443 74.127278 195.529255 74.127278 269.707698 0l171.829484-171.880649c74.076112-74.17435 80.357166-191.184297 6.282077-265.311575L607.934444 417.856853z"></path><path d="M855.61957 165.804257l-3.203972-3.203972c-74.17742-74.178443-195.528232-74.178443-269.706675 0L410.87944 334.479911c-74.178443 74.178443-78.263481 181.296089-4.085038 255.522628l3.152806 3.104711c3.368724 3.367701 6.865361 6.54302 10.434653 9.588379 2.583848 2.885723 5.618974 5.355985 8.992815 7.309476 0.025583 0.020466 0.052189 0.041956 0.077771 0.062422l0.011256-0.010233c5.377474 3.092431 11.608386 4.870938 18.257829 4.870938 20.263509 0 36.68962-16.428158 36.68962-36.68962 0-5.719258-1.309832-11.132548-3.645017-15.95846l0 0c-4.850471-10.891048-13.930267-17.521049-20.210297-23.802102l-3.15383-3.102664c-40.278355-40.278355-24.982998-98.79612 15.295358-139.074476l171.930791-171.830507c40.179095-40.280402 105.685018-40.280402 145.965419 0l3.206018 3.152806c40.279379 40.281425 40.279379 105.838513 0 146.06775l-75.686796 75.737962c-10.296507 7.628748-16.97358 19.865443-16.97358 33.662681 0 23.12365 18.745946 41.87062 41.87062 41.87062 8.048303 0 15.563464-2.275833 21.944801-6.211469 0.048095 0.081864 0.093121 0.157589 0.141216 0.240477l1.173732-1.083681c3.616364-2.421142 6.828522-5.393847 9.529027-8.792247l79.766718-73.603345C929.798013 361.334535 929.798013 239.981676 855.61957 165.804257z"></path></svg>`;
 const anyLinkRegexp = /(!?\[(?:[^\]]+)\]\([^\)]+\))|\b((?:https?:\/\/|ftp:\/\/|data:)[^\s]*)\b/gi;
@@ -34,16 +33,26 @@ class HyperLinkIcon extends WidgetType
     }
     toDOM() {
         const link = document.createElement('a');
-        const matchAll = this.state.url.matchAll(linkRegexp);
-        const match = [...matchAll][0]
-        if (match && match.length > 1) {
-            const url = match[1];
-            link.href = `${this.state.baseUrl}${url}`;
+        const matchUrlPart = this.state.url.matchAll(linkRegexp);
+        const matchUrl = [...matchUrlPart][0]
+        if (matchUrl && matchUrl.length > 1) {
+            const url = matchUrl[1];
+            if (url.includes('://') || url.startsWith('data:'))
+                link.href = url;
+            else
+                link.href = `${this.state.baseUrl}${url}`;
         }
-        else
-            link.href = `${this.state.baseUrl}${this.state.url}`;
-        if (link.href.endsWith('.md') && this.state.viewer)
+        else {
+            if (this.state.url.includes('://') || this.state.url.startsWith('data:'))
+                link.href = this.state.url;
+            else
+                link.href = `${this.state.baseUrl}${this.state.url}`;
+        }
+
+        // Open .md links in the optional markdown viewer
+        if (link.href.endsWith('.md') || link.href.includes('.md#') || link.href.includes('.md?'))
             link.href = `${this.state.viewer}${encodeURIComponent(link.href)}`;
+
         link.target = '_blank';
         link.innerHTML = linkSvgImage;
         link.className = 'cm-hyper-link-icon';
@@ -52,17 +61,15 @@ class HyperLinkIcon extends WidgetType
     }
 }
 
-function hyperLinkDecorations(view: EditorView, id: string)
+function hyperLinkDecorations(view: EditorView, basePathForLinks: string, markdownViewerPath: string)
 {
     const widgets: Array<Range<Decoration>> = [];
     const doc = view.state.doc.toString();
     let match;
-    const basePathForLinks = (CMInstances[id] !== undefined && CMInstances[id].config.basePathForLinks)
-        ? CMInstances[id].config.basePathForLinks.replace(/\/+$/, '') + "/"
-        : '';
-    const markdownViewPath = (CMInstances[id] !== undefined && CMInstances[id].config.markdownViewPath)
-        ? CMInstances[id].config.markdownViewPath
+    basePathForLinks = basePathForLinks
+        ? basePathForLinks.replace(/\/+$/, '') + "/"
         : '';
+    markdownViewerPath = markdownViewerPath ?? ''
 
     while ((match = anyLinkRegexp.exec(doc)) !== null) {
         const from = match.index;
@@ -72,7 +79,7 @@ function hyperLinkDecorations(view: EditorView, id: string)
                 at: to,
                 url: match[0],
                 baseUrl: basePathForLinks,
-                viewer: markdownViewPath,
+                viewer: markdownViewerPath,
             }),
             side: 1,
         });
@@ -82,18 +89,18 @@ function hyperLinkDecorations(view: EditorView, id: string)
     return Decoration.set(widgets);
 }
 
-export function hyperLinkExtension(id: string)
+export function hyperLinkExtension(basePathForLinks: string, markdownViewerPath: string)
 {
     return ViewPlugin.fromClass(
         class HyperLinkView {
             decorator?: MatchDecorator;
             decorations: DecorationSet;
             constructor(view: EditorView) {
-                this.decorations = hyperLinkDecorations(view, id);
+                this.decorations = hyperLinkDecorations(view, basePathForLinks, markdownViewerPath);
             }
             update(update: ViewUpdate) {
                 if (update.docChanged || update.viewportChanged) {
-                    this.decorations = hyperLinkDecorations(update.view, id);
+                    this.decorations = hyperLinkDecorations(update.view, basePathForLinks, markdownViewerPath);
                 }
             }
         },
@@ -117,4 +124,5 @@ export const hyperLinkStyle = EditorView.baseTheme({
     },
 });
 
-export const hyperLink = (id: string) => [hyperLinkExtension(id), hyperLinkStyle];
+export const hyperLink = (basePathForLinks: string, markdownViewerPath: string) =>
+    [hyperLinkExtension(basePathForLinks, markdownViewerPath), hyperLinkStyle];

CodeMirror6/NodeLib/src/CmImages.ts

@@ -4,25 +4,27 @@ import { RangeSet, StateField } from '@codemirror/state'
 import type { DecorationSet } from '@codemirror/view'
 import { Decoration, EditorView, WidgetType, ViewUpdate } from '@codemirror/view'
 import { buildWidget } from './lib/codemirror-kit'
-import { CMInstances } from './CmInstance'
 
 
-const imageWidget = (id: string, src: string, from: number) => buildWidget({
+const imageWidget = (basePathForLinks: string, src: string, from: number) => buildWidget({
     src: src,
     eq(other) {
         return other.src === src
     },
 
     toDOM(view: EditorView) {
-    const basePathForLinks = (CMInstances[id] !== undefined && CMInstances[id].config.basePathForLinks)
-        ? CMInstances[id].config.basePathForLinks.replace(/\/+$/, '') + "/"
-        : '';
+        basePathForLinks = basePathForLinks
+            ? basePathForLinks.replace(/\/+$/, '') + "/"
+            : '';
         const container = document.createElement('div')
         container.setAttribute('aria-hidden', 'true')
         const image = container.appendChild(document.createElement('img'))
 
         image.setAttribute('aria-hidden', 'true')
-        image.src = `${basePathForLinks}${src}`
+        if (src.includes('://') || src.startsWith('data:'))
+            image.src = src;
+        else
+            image.src = `${basePathForLinks}${src}`
         image.style.maxHeight = '320px'
         image.style.maxWidth = 'calc(100% - 2em)'
         image.style.objectFit = 'scale-down'
@@ -54,15 +56,15 @@ const imageWidget = (id: string, src: string, from: number) => buildWidget({
     },
 })
 
-export const dynamicImagesExtension = (id: string, enabled: boolean = true): Extension => {
+export const dynamicImagesExtension = (basePathForLinks: string, enabled: boolean = true): Extension => {
     if (!enabled) {
         return []
     }
 
     const imageRegex = /!\[.*?\]\((?<src>.*?)\)/
 
     const imageDecoration = (src: string, from: number) => Decoration.widget({
-        widget: imageWidget(id, src, from),
+        widget: imageWidget(basePathForLinks, src, from),
         side: -1,
         block: true,
     })

CodeMirror6/NodeLib/src/index.ts

@@ -109,7 +109,7 @@ export async function initCodeMirror(
             createEditorWithId(id),
             CMInstances[id].keymapCompartment.of(keymap.of(customLanguageKeyMap)),
             CMInstances[id].languageCompartment.of(await getLanguage(id, initialConfig.languageName, initialConfig.fileNameOrExtension) ?? []),
-            CMInstances[id].markdownStylingCompartment.of(initialConfig.languageName !== "Markdown" ? [] : autoFormatMarkdownExtensions(id, initialConfig.autoFormatMarkdown)),
+            CMInstances[id].markdownStylingCompartment.of(initialConfig.languageName !== "Markdown" ? [] : autoFormatMarkdownExtensions(id, initialConfig.previewImages, initialConfig.basePathForLinks, initialConfig.autoFormatMarkdown)),
             CMInstances[id].tabSizeCompartment.of(EditorState.tabSize.of(initialConfig.tabSize)),
             CMInstances[id].indentUnitCompartment.of(indentUnit.of(" ".repeat(initialConfig.indentationUnit))),
             CMInstances[id].placeholderCompartment.of(placeholder(initialConfig.placeholder)),
@@ -138,7 +138,7 @@ export async function initCodeMirror(
             CMInstances[id].dropCursorCompartment.of(initialConfig.dropCursor ? dropCursor() : []),
             CMInstances[id].scrollPastEndCompartment.of(initialConfig.scrollPastEnd ? scrollPastEnd() : []),
             CMInstances[id].highlightActiveLineCompartment.of(initialConfig.highlightActiveLine ? highlightActiveLine() : []),
-            CMInstances[id].hyperLinksCompartment.of(hyperLink(id)),
+            CMInstances[id].hyperLinksCompartment.of(hyperLink(initialConfig.basePathForLinks, initialConfig.markdownViewPath)),
 
             EditorView.updateListener.of(async (update) => { await updateListenerExtension(id, update) }),
             linter(async view => maxDocLengthLintSource(id, view)),
@@ -361,7 +361,7 @@ export async function setConfiguration(id: string, newConfig: CmConfiguration) {
             CMInstances[id].languageCompartment.reconfigure(language ?? []),
             CMInstances[id].keymapCompartment.reconfigure(keymap.of(customLanguageKeyMap)),
             languageChangeEffect.of(language?.language),
-            CMInstances[id].markdownStylingCompartment.reconfigure(autoFormatMarkdownExtensions(id, newConfig.languageName === 'Markdown')),
+            CMInstances[id].markdownStylingCompartment.reconfigure(autoFormatMarkdownExtensions(id, newConfig.previewImages, newConfig.basePathForLinks, newConfig.languageName === 'Markdown')),
             CMInstances[id].columnsStylingCompartment.reconfigure(
                 newConfig.languageName === "CSV" || newConfig.languageName === "TSV"
                     ? [
@@ -378,7 +378,7 @@ export async function setConfiguration(id: string, newConfig: CmConfiguration) {
             unfoldAll(CMInstances[id].view)
     }
     if (oldConfig.autoFormatMarkdown !== newConfig.autoFormatMarkdown || oldConfig.previewImages !== newConfig.previewImages || oldConfig.basePathForLinks !== newConfig.basePathForLinks) {
-        effects.push(CMInstances[id].markdownStylingCompartment.reconfigure(autoFormatMarkdownExtensions(id, newConfig.autoFormatMarkdown)))
+        effects.push(CMInstances[id].markdownStylingCompartment.reconfigure(autoFormatMarkdownExtensions(id, newConfig.previewImages, newConfig.basePathForLinks, newConfig.autoFormatMarkdown)))
         if (newConfig.languageName === "Markdown" && newConfig.autoFormatMarkdown)
             foldMarkdownDiagramCodeBlocks(CMInstances[id].view)
         else
@@ -399,7 +399,8 @@ export async function setConfiguration(id: string, newConfig: CmConfiguration) {
     if (oldConfig.dropCursor !== newConfig.dropCursor) effects.push(CMInstances[id].dropCursorCompartment.reconfigure(newConfig.dropCursor ? dropCursor() : []))
     if (oldConfig.scrollPastEnd !== newConfig.scrollPastEnd) effects.push(CMInstances[id].scrollPastEndCompartment.reconfigure(newConfig.scrollPastEnd ? scrollPastEnd() : []))
     if (oldConfig.highlightActiveLine !== newConfig.highlightActiveLine) effects.push(CMInstances[id].highlightActiveLineCompartment.reconfigure(newConfig.highlightActiveLine ? highlightActiveLine() : []))
-    if (oldConfig.basePathForLinks !== newConfig.basePathForLinks || oldConfig.markdownViewPath != newConfig.markdownViewPath) effects.push(CMInstances[id].hyperLinksCompartment.reconfigure(hyperLink(id)))
+    if (oldConfig.basePathForLinks !== newConfig.basePathForLinks || oldConfig.markdownViewPath != newConfig.markdownViewPath)
+        effects.push(CMInstances[id].hyperLinksCompartment.reconfigure(hyperLink(newConfig.basePathForLinks, newConfig.markdownViewPath)))
 
     CMInstances[id].config = newConfig
     if (effects.length > 0 || changes.length > 0)
@@ -476,10 +477,10 @@ function saveToLocalStorage(id: string) {
     }
 }
 
-const autoFormatMarkdownExtensions = (id: string, autoFormatMarkdown: boolean = true) => [
+const autoFormatMarkdownExtensions = (id: string, previewImages: boolean, basePathForLinks: string, autoFormatMarkdown: boolean = true) => [
     getDynamicHeaderStyling(autoFormatMarkdown),
     dynamicHrExtension(autoFormatMarkdown),
-    dynamicImagesExtension(id, autoFormatMarkdown && CMInstances[id].config.previewImages === true),
+    dynamicImagesExtension(basePathForLinks, autoFormatMarkdown && previewImages === true),
     dynamicDiagramsExtension(autoFormatMarkdown, CMInstances[id].setup.krokiUrl.replace(/\/$/, '')),
     autocompletion({
         override: [

Examples.BlazorServer/Examples.BlazorServer.csproj

@@ -4,7 +4,7 @@
     <Nullable>enable</Nullable>
     <IsPackable>false</IsPackable>
     <ImplicitUsings>enable</ImplicitUsings>
-    <Version>0.8.5</Version>
+    <Version>0.8.6</Version>
   </PropertyGroup>
   <ItemGroup>
     <SupportedPlatform Include="browser" />

Examples.BlazorServerInteractive/Examples.BlazorServerInteractive.csproj

@@ -4,7 +4,7 @@
     <Nullable>enable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
     <IsPackable>false</IsPackable>
-    <Version>0.8.5</Version>
+    <Version>0.8.6</Version>
   </PropertyGroup>
   <ItemGroup>
     <PackageReference Include="Sentry.AspNetCore" Version="4.1.0" />

Examples.BlazorWasm/Examples.BlazorWasm.csproj

@@ -4,7 +4,7 @@
     <Nullable>enable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
     <IsPackable>false</IsPackable>
-    <Version>0.8.5</Version>
+    <Version>0.8.6</Version>
   </PropertyGroup>
   <ItemGroup>
     <SupportedPlatform Include="browser-wasm" />

Examples.Common/Examples.Common.csproj

@@ -5,7 +5,7 @@
     <ImplicitUsings>enable</ImplicitUsings>
     <Nullable>enable</Nullable>
     <IsPackable>false</IsPackable>
-    <Version>0.8.5</Version>
+    <Version>0.8.6</Version>
   </PropertyGroup>
   <ItemGroup>
     <SupportedPlatform Include="browser" />

NEW_CHANGELOG.md

@@ -1,8 +1,5 @@
-### ✨ Introduce new features
-
-- Allow opening markdown links by passing them as query parameter value to a viewer URL + query parameter name + '='
-
 ### 🐛 Fix a bug
 
-- Update images when bath path for links is initially set
-- Update links when bath path for links is initially set
+- Don't apply base link url to full links
+- Fix full link detection
+- Fix initial setting of base link URLs again