This commit is contained in:
Anton Tranelis 2025-06-13 09:22:39 +02:00
parent 8a39558e4a
commit 89db7e12d1
3 changed files with 10 additions and 21 deletions

View File

@ -60,15 +60,16 @@ export function RichTextEditor({
updateFormValue,
}: RichTextEditorProps) {
const handleChange = () => {
if (editor) {
let newValue: string | undefined = getStyledMarkdown(editor)
? getStyledMarkdown(editor)
: undefined
const regex = /!\[.*?\]\(.*?\)/g
newValue = newValue?.replace(regex, (match: string) => match + '\n\n')
if (updateFormValue && newValue) {
updateFormValue(newValue)
}
if (!editor) return
let newValue = getStyledMarkdown(editor)
// matcht entweder Markdown-Images *oder* HTML-<img>Tags
const regex = /(!\[.*?\]\(.*?\)|<img\b[^>]*?\/?>)/gi
newValue = newValue.replace(regex, (match) => match + '\n\n')
if (updateFormValue && newValue) {
updateFormValue(newValue)
}
}
@ -149,9 +150,7 @@ export function RichTextEditor({
const CustomImage = Image.extend({
addAttributes() {
return {
// alle Standard-Attribute (src, alt, title) behalten
...this.parent?.(),
// das style-Attribut zulassen und weiterreichen
style: {
default: null,
parseHTML: (element) => element.getAttribute('style'),
@ -162,7 +161,6 @@ const CustomImage = Image.extend({
return { style: attributes.style }
},
},
// optional: Breite und Höhe separat behandeln
width: {
default: null,
parseHTML: (element) => element.getAttribute('width'),
@ -178,18 +176,14 @@ const CustomImage = Image.extend({
})
export function getStyledMarkdown(editor: Editor): string {
// Den internen Serializer sauber casten
const { serializer } = editor.storage.markdown as { serializer: MarkdownSerializer }
// Die Basis-Nodes/Marks zum Überschreiben herausziehen
const baseNodes = serializer.nodes as Record<string, NodeSerializerFn>
const marks = serializer.marks
// Unsere Image-Funktion mit korrekter Signatur
const customImage: NodeSerializerFn = (state, node) => {
const { src, alt, title, style } = node.attrs as ImageAttrs
// Per String-Konkatenation, damit kein ESLint-Fehler mehr kommt
let tag = '<img src="' + src + '"'
if (alt) tag += ' alt="' + alt + '"'
if (title) tag += ' title="' + title + '"'
@ -199,9 +193,7 @@ export function getStyledMarkdown(editor: Editor): string {
state.write(tag)
}
// Den neuen Serializer bauen alle Nodes übernehmen, nur `image` ersetzen
const customSerializer = new MarkdownSerializer({ ...baseNodes, image: customImage }, marks)
// Fertig: das gesamte Dokument serialisieren
return customSerializer.serialize(editor.state.doc)
}

View File

@ -120,17 +120,14 @@ export const TextView = ({
// 4) Interne Links auf gleiche Base-URL
if (href.startsWith(origin)) {
// z.B. href="https://karte.menschlichwirtschaften.de/info" → to="/info"
const to = href.slice(origin.length) || '/'
return <RouterLink to={to}>{children}</RouterLink>
}
// 5) Relative Links ohne Origin (z.B. "/info" oder "info" → zu RouterLink machen)
if (href.startsWith('/')) {
return <RouterLink to={href}>{children}</RouterLink>
}
// Default: Link
return (
<a href={href} target='_blank' rel='noreferrer'>
{children}