wip

Author: 3y3

src/transform/plugins/images/index.ts

@@ -19,77 +19,55 @@ interface ImageOpts extends MarkdownItPluginOpts {
 
 function replaceImageSrc(
     state: StateCore,
-    currentPath: string,
+    from: string,
     path: string,
     imgSrc: string,
-    {assetsPublicPath = sep, root = '', log}: ImageOpts,
+    {assetsPublicPath = '/', root = '', log}: ImageOpts,
 ) {
     if (isFileExists(path)) {
         state.md.assets?.push(imgSrc);
     } else {
-        log.error(`Asset not found: ${bold(imgSrc)} in ${bold(currentPath)}`);
+        log.error(`Asset not found: ${bold(imgSrc)} in ${bold(from)}`);
     }
 
     const relativeToRoot = path.replace(root + sep, '');
-    const publicSrc = join(assetsPublicPath, relativeToRoot);
 
-    return publicSrc;
+    return join(assetsPublicPath, relativeToRoot);
+}
+
+interface InlineOptions {
+    enabled: boolean;
+    maxFileSize: number;
 }
 
 interface SVGOpts extends MarkdownItPluginOpts {
     notFoundCb: (s: string) => void;
     imageOpts: ImageOptions;
+    svgInline: InlineOptions;
 }
 
 function getSvgContent(
-    state: StateCore,
-    path: string,
-    {rawContent, path: optsPath, notFoundCb, log, root}: Opts,
+    file: string,
+    from: string,
+    {getContent, notFoundCb, log, root = ''}: Opts,
 ) {
-    const rootFile = state.env.path || optsPath;
     try {
-        const raw = rawContent(path);
-        return typeof raw === 'string' ? raw : null;
+        return getContent(file);
     } catch (e: unknown) {
-        log.error(`SVG ${path} from ${rootFile} not found`);
+        const path = file.replace(root, '');
+        log.error(`SVG ${path} from ${from} not found`);
 
         if (notFoundCb) {
-            notFoundCb(path.replace(root, ''));
+            notFoundCb(path);
         }
 
         return null;
     }
 }
-function convertSvg(
-    raw: string | null,
-    state: StateCore,
-    {
-        file: path,
-        log,
-        forceInlineSvg,
-        imageOpts,
-        svgInline: {maxFileSize},
-    }: Opts & {forceInlineSvg: boolean},
-) {
-    if (raw === null) {
-        return null;
-    }
-    if (raw.length > maxFileSize) {
-        log.info(`Svg size more than ${maxFileSize}: ${bold(path)}`);
-        if (!forceInlineSvg) {
-            return null;
-        }
-    }
-    const content = raw === '' ? '' : replaceSvgContent(raw, imageOpts);
-    const svgToken = new state.Token('image_svg', '', 0);
-    svgToken.attrSet('content', content);
-
-    return svgToken;
-}
 
 type Opts = SVGOpts &
     ImageOpts & {
-        rawContent: (path: string) => string | boolean;
+        getContent: (path: string) => string;
         calcPath: (root: string, path: string) => string;
         replaceImageSrc: (
             state: StateCore,
@@ -99,22 +77,18 @@ type Opts = SVGOpts &
             opts: ImageOpts,
         ) => string;
         file: string;
-        svgInline: {
-            enabled: boolean;
-            maxFileSize: number;
-        };
     };
 
-function shouldBeInlined(token: Token, opts: Opts) {
+function shouldBeInlined(token: Token, opts: InlineOptions) {
     if (!token.attrGet('src')?.endsWith('.svg')) {
         return false;
     }
 
     const forceInlineSvg = token.attrGet('inline') === 'true';
-    const shouldInlineSvg =
-        forceInlineSvg || (token.attrGet('inline') !== 'false' && opts.svgInline.enabled !== false);
+    const forceSplitSvg = token.attrGet('inline') === 'false';
+    const inliningIsEnabled = opts.enabled !== false;
 
-    return shouldInlineSvg;
+    return forceInlineSvg || (!forceSplitSvg && inliningIsEnabled);
 }
 
 const getRawFile = (path: string) => {
@@ -123,7 +97,7 @@ const getRawFile = (path: string) => {
 
 const index: MarkdownItPluginCb<Opts> = (md, opts) => {
     const {
-        rawContent = getRawFile,
+        getContent = getRawFile,
         calcPath = resolveRelativePath,
         replaceImageSrc: replaceImage = replaceImageSrc,
     } = opts;
@@ -158,34 +132,32 @@ const index: MarkdownItPluginCb<Opts> = (md, opts) => {
                     return;
                 }
 
-                const forceInlineSvg = image.attrGet('inline') === 'true';
-                const shouldInlineSvg = shouldBeInlined(image, opts);
+                const shouldInlineSvg = shouldBeInlined(image, opts.svgInline);
                 const imageOpts = {
                     width: image.attrGet('width'),
                     height: image.attrGet('height'),
                 };
 
-                const root = state.env.path || opts.path;
-                const file = calcPath(root, imgSrc);
+                const from = state.env.path || opts.path;
+                const file = calcPath(from, imgSrc);
 
                 if (shouldInlineSvg) {
-                    const svgContent = getSvgContent(state, file, {
-                        ...opts,
-                        rawContent,
-                    });
-                    const svgToken = convertSvg(svgContent, state, {
+                    const rawContent = getSvgContent(file, from, {
                         ...opts,
-                        forceInlineSvg,
-                        imageOpts,
-                        file,
+                        getContent,
                     });
-                    if (svgToken) {
+
+                    if (rawContent !== null) {
+                        const content = replaceSvgContent(rawContent, imageOpts);
+                        const svgToken = new state.Token('image_svg', '', 0);
+                        svgToken.attrSet('content', content);
+
                         childrenTokens[index] = svgToken;
                     }
                 }
 
                 if (childrenTokens[index].type === 'image') {
-                    image.attrSet('src', replaceImage(state, root, file, imgSrc, opts));
+                    image.attrSet('src', replaceImage(state, from, file, imgSrc, opts));
                     image.attrSet('yfm_patched', '1');
                 }
             });
@@ -206,6 +178,10 @@ const index: MarkdownItPluginCb<Opts> = (md, opts) => {
 };
 
 function replaceSvgContent(content: string, options: ImageOptions) {
+    if (!content) {
+        return content;
+    }
+
     // monoline
     content = content.replace(/>\r?\n</g, '><').replace(/\r?\n/g, ' ');