@diplodoc/transform 4.58.0 → 4.59.0

package/src/scss/private.scss

@@ -6,11 +6,13 @@
     --yfm-color-table-private: #333;
     --yfm-color-border-private: rgba(0, 0, 0, 0.07);
     --yfm-color-table-row-background-private: rgba(0, 0, 0, 0.02);
+    --yfm-color-table-row-header-background-primary: rgba(247, 247, 247, 1);
     --yfm-color-accent-private: #027bf3;
 
     --yfm-color-inline-code-private: rgba(59, 96, 128, 1);
     --yfm-color-inline-code-background-private: rgba(107, 132, 153, 0.12);
     --yfm-color-code-background-private: rgba(107, 132, 153, 0.12);
+    --yfm-color-code-background-hovered-private: rgba(107, 132, 153, 0.2);
 
     --yfm-color-hljs-background-private: rgba(107, 132, 153, 0.12);
     --yfm-color-hljs-subst-private: #444;

package/src/transform/frontmatter.ts

@@ -23,7 +23,7 @@ const escapeLiquid = (content: string): string =>
 
 /**
  * Inverse of a workaround defined above.
- * @see `escapeLiquidSubstitutionSyntax`
+ * @see `escapeLiquid`
  * @param escapedContent Input string with `{}` escaped with backslashes
  * @returns Unescaped string
  */

package/src/transform/index.ts

@@ -47,7 +47,6 @@ function transform(originInput: string, options: OptionsType = {}): OutputType |
         if (options.tokens === true) {
             return tokens;
         }
-
         return emitResult(compile(tokens), env);
     } catch (error) {
         handleError(error, options.path);

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

@@ -6,6 +6,8 @@ import type {MarkdownItPluginCb} from '../typings';
 import {bold} from 'chalk';
 import yaml from 'js-yaml';
 
+import {getSrcTokenAttr} from '../../utils';
+
 interface Options {
     extractChangelogs?: boolean;
 }
@@ -85,7 +87,7 @@ function parseBody(tokens: Token[], state: StateCore) {
                 alt = md.renderer.renderInlineAsText(imageToken.children, md.options, env);
             }
             image = {
-                src: imageToken.attrGet('src'),
+                src: getSrcTokenAttr(imageToken),
                 alt,
                 ratio,
             };

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

@@ -3,7 +3,7 @@ import type {MarkdownItPluginOpts} from '../typings';
 import MarkdownIt from 'markdown-it';
 import {relative} from 'path';
 
-import {isLocalUrl} from '../../utils';
+import {getSrcTokenAttr, isLocalUrl} from '../../utils';
 import {resolveRelativePath} from '../../utilsFS';
 import deflist from '../deflist';
 import imsize from '../imsize';
@@ -33,7 +33,7 @@ const collect = (input: string, options: Options) => {
                 return;
             }
 
-            const src = childToken.attrGet('src') || '';
+            const src = getSrcTokenAttr(childToken);
 
             if (!isLocalUrl(src)) {
                 return;

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

@@ -8,7 +8,7 @@ import {optimize} from 'svgo';
 import {readFileSync} from 'fs';
 
 import {isFileExists, resolveRelativePath} from '../../utilsFS';
-import {isExternalHref, isLocalUrl} from '../../utils';
+import {getSrcTokenAttr, isExternalHref, isLocalUrl} from '../../utils';
 
 interface ImageOpts extends MarkdownItPluginOpts {
     assetsPublicPath: string;
@@ -20,7 +20,7 @@ function replaceImageSrc(
     state: StateCore,
     {assetsPublicPath = sep, root = '', path: optsPath, log}: ImageOpts,
 ) {
-    const src = token.attrGet('src') || '';
+    const src = getSrcTokenAttr(token);
     const currentPath = state.env.path || optsPath;
 
     if (!isLocalUrl(src)) {
@@ -57,7 +57,7 @@ function convertSvg(
     {path: optsPath, log, notFoundCb, root}: SVGOpts,
 ) {
     const currentPath = state.env.path || optsPath;
-    const path = resolveRelativePath(currentPath, token.attrGet('src') || '');
+    const path = resolveRelativePath(currentPath, getSrcTokenAttr(token));
 
     try {
         const raw = readFileSync(path).toString();
@@ -114,7 +114,7 @@ const index: MarkdownItPluginCb<Opts> = (md, opts) => {
                         return;
                     }
 
-                    const imgSrc = childrenTokens[j].attrGet('src') || '';
+                    const imgSrc = getSrcTokenAttr(childrenTokens[j]);
                     const shouldInlineSvg = opts.inlineSvg !== false && !isExternalHref(imgSrc);
 
                     if (imgSrc.endsWith('.svg') && shouldInlineSvg) {

package/src/transform/plugins/inline-code/constant.ts

@@ -0,0 +1,58 @@
+import {Lang} from '../typings';
+
+export const LANG_TOKEN: Record<Lang, string> = {
+    ru: 'Скопировано',
+    en: 'Copied',
+    ar: 'تم النسخ',
+    cs: 'Zkopírováno',
+    fr: 'Copié',
+    es: 'Copiado',
+    he: 'הועתק',
+    bg: 'Копирано',
+    et: 'Kopeeritud',
+    el: 'Αντιγράφηκε',
+    pt: 'Copiado',
+    zh: '已复制',
+    'zh-tw': '已複製',
+    kk: 'Көшірілді',
+    tr: 'Kopyalandı',
+    uz: 'Nusxalandi',
+};
+
+export const LANG_TOKEN_DESCRIPTION: Record<Lang, string> = {
+    ru: 'Чтобы скопировать текст внутри блока нажмите на блок',
+    en: 'To copy the text inside the block, click on the block',
+    ar: 'لنسخ النص داخل المربع، انقر على المربع',
+    cs: 'Chcete-li zkopírovat text uvnitř bloku, klikněte na blok',
+    fr: "Pour copier le texte à l'intérieur du bloc, cliquez sur le bloc",
+    es: 'Para copiar el texto dentro del bloque, haga clic en el bloque',
+    he: 'כדי להעתיק את הטקסט בתוך הבלוק, לחץ על הבלוק',
+    bg: 'За да копирате текста във блока, кликнете върху блока',
+    et: 'Teksti kopeerimiseks plokis klõpsake plokil',
+    el: 'Για να αντιγράψετε το κείμενο μέσα στο μπλοκ, κάντε κλικ στο μπλοκ',
+    pt: 'Para copiar o texto dentro do bloco, clique no bloco',
+    zh: '要复制块内的文本，请点击该块',
+    'zh-tw': '要複製區塊內的文字，請點擊該區塊',
+    kk: 'Блок ішіндегі мәтінді көшіру үшін блокты басыңыз',
+    tr: 'Blok içindeki metni kopyalamak için bloğa tıklayın',
+    uz: 'Blok ichidagi matnni nusxalash uchun blokni bosing',
+};
+
+export const LANG_TOKEN_LABEL: Record<Lang, string> = {
+    ru: 'Блок кода',
+    en: 'Code block',
+    ar: 'كتلة التعليمات البرمجية',
+    cs: 'Blok kódu',
+    fr: 'Bloc de code',
+    es: 'Bloque de código',
+    he: 'בלוק קוד',
+    bg: 'Блок с код',
+    et: 'Koodiplokk',
+    el: 'Μπλοκ κώδικα',
+    pt: 'Bloco de código',
+    zh: '代码块',
+    'zh-tw': '代碼區塊',
+    kk: 'Код блогы',
+    tr: 'Kod bloğu',
+    uz: 'Kod bloki',
+};

package/src/transform/plugins/inline-code/index.ts

@@ -0,0 +1,58 @@
+import {MarkdownItPluginCb, StateCore} from '../../typings';
+import {generateID} from '../utils';
+
+import {LANG_TOKEN, LANG_TOKEN_DESCRIPTION, LANG_TOKEN_LABEL} from './constant';
+
+const inlineCode: MarkdownItPluginCb = (md, options) => {
+    const lang = options.lang;
+
+    md.renderer.rules.code_inline = function (tokens, idx) {
+        const id = generateID();
+
+        const description = LANG_TOKEN_DESCRIPTION[lang] ?? LANG_TOKEN_DESCRIPTION.en;
+        const label = LANG_TOKEN_LABEL[lang] ?? LANG_TOKEN_LABEL.en;
+
+        return `<code class="yfm-clipboard-inline-code" role="button" aria-label="${label}" aria-description="${description}" tabindex='0' id="${id}">${tokens[idx].content}</code>`;
+    };
+
+    md.core.ruler.after('inline', 'tooltip_code_inline', (state: StateCore) => {
+        const tokens = state.tokens;
+
+        for (let i = 0; i !== tokens.length; i++) {
+            const token = tokens[i];
+
+            if (token.type !== 'inline') {
+                continue;
+            }
+
+            if (!token.children || token.children.every((e) => e.type !== 'code_inline')) {
+                continue;
+            }
+
+            const child = token.children.find((e) => e.type === 'code_inline');
+
+            if (!child) {
+                return;
+            }
+
+            const dialog = new state.Token('tooltip_open', 'div', 1);
+            dialog.attrSet('class', 'yfm inline_code_tooltip');
+            dialog.attrSet('id', `tooltip_inline_clipboard_dialog`);
+            dialog.attrSet('role', 'dialog');
+            dialog.attrSet('aria-live', 'polite');
+            dialog.attrSet('aria-modal', 'true');
+
+            tokens.push(dialog);
+
+            const text = new state.Token('text', '', 0);
+            text.content = LANG_TOKEN[lang] ?? LANG_TOKEN.en;
+            tokens.push(text);
+
+            const closeDialog = new state.Token('tooltip_close', 'div', -1);
+            tokens.push(closeDialog);
+            break;
+        }
+    });
+};
+
+export = inlineCode;

package/src/transform/plugins.ts

@@ -15,6 +15,7 @@ import file from './plugins/file';
 import imsize from './plugins/imsize';
 import term from './plugins/term';
 import blockAnchor from './plugins/block-anchor';
+import inlineCode from './plugins/inline-code';
 
 const defaultPlugins = [
     meta,
@@ -32,6 +33,7 @@ const defaultPlugins = [
     imsize,
     term,
     blockAnchor,
+    inlineCode,
 ] as MarkdownItPluginCb[];
 
 export = defaultPlugins;

package/src/transform/utils.ts

@@ -92,6 +92,16 @@ export function getHrefTokenAttr(token: Token) {
     return href;
 }
 
+export function getSrcTokenAttr(token: Token) {
+    let src = token.attrGet('src') || '';
+    try {
+        // decodeURI can throw an error https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/URIError
+        src = decodeURI(src);
+    } catch (e) {}
+
+    return src;
+}
+
 export const PAGE_LINK_REGEXP = /\.(md|ya?ml)$/i;
 
 export function defaultTransformLink(href: string) {