@diplodoc/transform 4.77.14 → 4.77.15

package/lib/plugins/inline-svg-marker.d.ts

@@ -0,0 +1,3 @@
+import type { MarkdownItPluginCb } from './typings';
+declare const inlineSvgMarker: MarkdownItPluginCb;
+export = inlineSvgMarker;

package/lib/plugins/inline-svg-marker.js

@@ -0,0 +1,51 @@
+"use strict";
+const MARKER = /^<!--[ \t]*diplodoc:svg[ \t][^\r\n]*?-->(?=<svg\b)/;
+const TOKEN_NAME = 'inline_svg_marker';
+const inlineSvgMarker = (md) => {
+    md.block.ruler.before('html_block', TOKEN_NAME, (state, startLine) => {
+        var _a;
+        const start = state.bMarks[startLine] + state.tShift[startLine];
+        const content = state.src.slice(start, state.eMarks[startLine]);
+        const marker = (_a = MARKER.exec(content)) === null || _a === void 0 ? void 0 : _a[0];
+        if (marker) {
+            const src = state.src.slice(0, start) +
+                ' '.repeat(marker.length) +
+                state.src.slice(start + marker.length);
+            state.src = src;
+        }
+        return false;
+    }, { alt: ['paragraph', 'reference', 'blockquote'] });
+    md.inline.ruler.before('html_inline', TOKEN_NAME, (state) => {
+        var _a;
+        const content = state.src.slice(state.pos);
+        const marker = (_a = MARKER.exec(content)) === null || _a === void 0 ? void 0 : _a[0];
+        if (!marker) {
+            return false;
+        }
+        const token = state.push(TOKEN_NAME, '', 0);
+        token.meta = {
+            start: state.pos,
+            end: state.pos + marker.length,
+        };
+        state.pos += marker.length;
+        return true;
+    });
+    md.core.ruler.after('inline', `${TOKEN_NAME}_cleanup`, (state) => {
+        state.tokens.forEach((token) => {
+            if (token.type !== 'inline' || !token.children) {
+                return;
+            }
+            for (let index = token.children.length - 1; index >= 0; index--) {
+                const marker = token.children[index];
+                if (marker.type !== TOKEN_NAME) {
+                    continue;
+                }
+                const { start, end } = marker.meta;
+                token.content = token.content.slice(0, start) + token.content.slice(end);
+                token.children.splice(index, 1);
+            }
+        });
+    });
+};
+module.exports = inlineSvgMarker;
+//# sourceMappingURL=inline-svg-marker.js.map

package/lib/plugins/inline-svg-marker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inline-svg-marker.js","sourceRoot":"","sources":["../../src/transform/plugins/inline-svg-marker.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@diplodoc/transform",
-  "version": "4.77.14",
+  "version": "4.77.15",
   "description": "A simple transformer of text in YFM (Yandex Flavored Markdown) to HTML",
   "keywords": [
     "markdown",

package/src/transform/md.ts

@@ -13,6 +13,7 @@ import getHeadings from './headings';
 import sanitizeHtml, {defaultOptions, sanitizeStyles} from './sanitize';
 import {olAttrConversion} from './plugins/ol-attr-conversion';
 import linkifyStrikethrough from './plugins/linkify-strikethrough';
+import inlineSvgMarker from './plugins/inline-svg-marker';
 import {DEFAULT_LANG} from './constants';
 import {createIDGeneratorByStrategy} from './plugins/utils';
 
@@ -117,6 +118,7 @@ function initPlugins(md: MarkdownIt, options: OptionsType, pluginOptions: Markdo
     }
 
     md.use(olAttrConversion);
+    md.use(inlineSvgMarker);
 
     md.use(linkifyStrikethrough);
     plugins.forEach((plugin) => md.use(plugin, pluginOptions));

package/src/transform/plugins/images/index.ts

@@ -5,7 +5,7 @@ import type {IDGenerator} from '../utils';
 
 import {join, sep} from 'path';
 import {bold} from 'chalk';
-import {optimize} from 'svgo';
+import {type PluginConfig, optimize} from 'svgo';
 import {readFileSync} from 'fs';
 
 import {isFileExists, resolveRelativePath} from '../../utilsFS';
@@ -147,7 +147,9 @@ function collectDataAttrs(
     opts: ImageOpts,
 ): Record<string, string> {
     const result: Record<string, string> = {};
-    if (!image.attrs) return result;
+    if (!image.attrs) {
+        return result;
+    }
 
     for (const [key, value] of image.attrs) {
         if (key === 'gallery' && isGalleryValid(value)) {
@@ -227,10 +229,14 @@ const index: MarkdownItPluginCb<Opts> = (md, opts) => {
         childrenTokens: Token[],
         state: StateCore,
     ): void {
-        if (image.attrGet('yfm_patched')) return;
+        if (image.attrGet('yfm_patched')) {
+            return;
+        }
 
         const imgSrc = getSrcTokenAttr(image);
-        if (isExternalHref(imgSrc)) return;
+        if (isExternalHref(imgSrc)) {
+            return;
+        }
 
         const from = state.env.path || opts.path;
         const dataAttrs = collectDataAttrs(image, state, from, calcPath, replaceImage, opts);
@@ -274,10 +280,14 @@ const index: MarkdownItPluginCb<Opts> = (md, opts) => {
 
     const plugin = (state: StateCore) => {
         filterTokens(state.tokens, 'inline', (inline, {commented}) => {
-            if (commented || !inline.children) return;
+            if (commented || !inline.children) {
+                return;
+            }
             const childrenTokens = inline.children;
             filterTokens(childrenTokens, 'image', (image, {commented, index}) => {
-                if (!commented) processImageToken(image, index, childrenTokens, state);
+                if (!commented) {
+                    processImageToken(image, index, childrenTokens, state);
+                }
             });
         });
     };
@@ -307,6 +317,21 @@ function applyDataAttrs(svgRoot: string, dataAttrs: Record<string, string>): str
     return result;
 }
 
+const removeProcessingInstructions: PluginConfig = {
+    name: 'removeProcessingInstructions',
+    fn: () => {
+        return {
+            instruction: {
+                enter: (node, parent) => {
+                    const start = parent.children.indexOf(node);
+
+                    parent.children.splice(start, 1);
+                },
+            },
+        };
+    },
+};
+
 function replaceSvgContent(
     content: string | null,
     options: ImageOptions,
@@ -318,8 +343,22 @@ function replaceSvgContent(
     // monoline
     content = content.replace(/>\r?\n</g, '><').replace(/\r?\n/g, ' ');
 
-    // remove XML processing instructions (<?xml?>, <?plantuml?>, etc.) — invalid in HTML
-    content = content.replace(/<\?[^?]*\?>/g, '');
+    const optimized = optimize(content, {
+        plugins: [
+            'removeDoctype',
+            {name: 'removeComments', params: {preservePatterns: []}},
+            removeProcessingInstructions,
+            {
+                name: 'prefixIds',
+                params: {
+                    prefix: generateID('svg'),
+                    prefixClassNames: false,
+                },
+            },
+        ],
+    });
+
+    content = optimized.data;
 
     // width, height
     let svgRoot = content.replace(/.*?<svg([^>]*)>.*/g, '$1');
@@ -356,19 +395,6 @@ function replaceSvgContent(
         content = content.replace(/(<svg[^>]*>)/, `$1<title>${options.title}</title>`);
     }
 
-    // randomize ids
-    content = optimize(content, {
-        plugins: [
-            {
-                name: 'prefixIds',
-                params: {
-                    prefix: generateID('svg'),
-                    prefixClassNames: false,
-                },
-            },
-        ],
-    }).data;
-
     return escapeMarkdownCharsInSvgTextNodes(content);
 }
 

package/src/transform/plugins/inline-svg-marker.ts

@@ -0,0 +1,75 @@
+import type StateBlock from 'markdown-it/lib/rules_block/state_block';
+import type StateCore from 'markdown-it/lib/rules_core/state_core';
+import type StateInline from 'markdown-it/lib/rules_inline/state_inline';
+import type {MarkdownItPluginCb} from './typings';
+
+const MARKER = /^<!--[ \t]*diplodoc:svg[ \t][^\r\n]*?-->(?=<svg\b)/;
+const TOKEN_NAME = 'inline_svg_marker';
+
+type MarkerRange = {start: number; end: number};
+
+const inlineSvgMarker: MarkdownItPluginCb = (md) => {
+    md.block.ruler.before(
+        'html_block',
+        TOKEN_NAME,
+        (state: StateBlock, startLine: number) => {
+            const start = state.bMarks[startLine] + state.tShift[startLine];
+            const content = state.src.slice(start, state.eMarks[startLine]);
+            const marker = MARKER.exec(content)?.[0];
+
+            if (marker) {
+                const src =
+                    state.src.slice(0, start) +
+                    ' '.repeat(marker.length) +
+                    state.src.slice(start + marker.length);
+
+                state.src = src;
+            }
+
+            return false;
+        },
+        {alt: ['paragraph', 'reference', 'blockquote']},
+    );
+
+    md.inline.ruler.before('html_inline', TOKEN_NAME, (state: StateInline) => {
+        const content = state.src.slice(state.pos);
+        const marker = MARKER.exec(content)?.[0];
+
+        if (!marker) {
+            return false;
+        }
+
+        const token = state.push(TOKEN_NAME, '', 0);
+
+        token.meta = {
+            start: state.pos,
+            end: state.pos + marker.length,
+        } satisfies MarkerRange;
+        state.pos += marker.length;
+
+        return true;
+    });
+
+    md.core.ruler.after('inline', `${TOKEN_NAME}_cleanup`, (state: StateCore) => {
+        state.tokens.forEach((token) => {
+            if (token.type !== 'inline' || !token.children) {
+                return;
+            }
+
+            for (let index = token.children.length - 1; index >= 0; index--) {
+                const marker = token.children[index];
+
+                if (marker.type !== TOKEN_NAME) {
+                    continue;
+                }
+
+                const {start, end} = marker.meta as MarkerRange;
+
+                token.content = token.content.slice(0, start) + token.content.slice(end);
+                token.children.splice(index, 1);
+            }
+        });
+    });
+};
+
+export = inlineSvgMarker;