@diplodoc/transform 4.20.0 → 4.21.0

package/lib/plugins/table/utils.js

@@ -1,15 +1,48 @@
 "use strict";
-/**
- * Parse the markdown-attrs format to retrieve a class name
- * Putting all the requirements in regex was more complicated than parsing a string char by char.
- *
- * @param {string} inputString - The string to parse.
- * @returns {string|null} - The extracted class or null if there is none
- */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseAttrsClass = void 0;
-function parseAttrsClass(inputString) {
-    const validChars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ .=-_';
+exports.parseAttrs = void 0;
+const wrapToData = (key) => {
+    if (key.startsWith('data-')) {
+        return key;
+    }
+    return `data-${key}`;
+};
+const selectors = {
+    class(value) {
+        if (value.startsWith('.')) {
+            return {
+                key: 'class',
+                value: value.slice(1),
+            };
+        }
+        return null;
+    },
+    id(value) {
+        if (value.startsWith('#')) {
+            return {
+                key: 'id',
+                value: value.slice(1),
+            };
+        }
+        return null;
+    },
+    attr(value) {
+        const parts = value.split('=');
+        if (parts.length === 2) {
+            return {
+                key: wrapToData(parts[0]),
+                value: parts[1],
+            };
+        }
+        return {
+            key: wrapToData(value),
+            value: 'true',
+        };
+    },
+};
+const handlers = Object.values(selectors);
+function parseAttrs(inputString) {
+    const validChars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ .=-_#';
     if (!inputString.startsWith('{')) {
         return null;
     }
@@ -20,15 +53,24 @@ function parseAttrsClass(inputString) {
             if (!contentInside) {
                 return null;
             }
-            const parts = contentInside.split('.');
-            if (parts.length !== 2 || !parts[1]) {
-                return null;
-            }
-            //There should be a preceding whitespace
-            if (!parts[0].endsWith(' ') && parts[0] !== '') {
-                return null;
-            }
-            return parts[1];
+            const parts = contentInside.split(' ');
+            const attrs = {
+                class: [],
+                id: [],
+            };
+            parts.forEach((part) => {
+                const matched = handlers.find((test) => test(part));
+                if (!matched) {
+                    return;
+                }
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                const { key, value } = matched(part);
+                if (!attrs[key]) {
+                    attrs[key] = [];
+                }
+                attrs[key].push(value);
+            });
+            return attrs;
         }
         if (!validChars.includes(char)) {
             return null;
@@ -36,5 +78,5 @@ function parseAttrsClass(inputString) {
     }
     return null;
 }
-exports.parseAttrsClass = parseAttrsClass;
+exports.parseAttrs = parseAttrs;
 //# sourceMappingURL=utils.js.map

package/lib/plugins/table/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/transform/plugins/table/utils.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG;;;AAEH,SAAgB,eAAe,CAAC,WAAmB;IAC/C,MAAM,UAAU,GAAG,2DAA2D,CAAC;IAE/E,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE;QAC9B,OAAO,IAAI,CAAC;KACf;IAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACzC,MAAM,IAAI,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC;QAE5B,IAAI,IAAI,KAAK,GAAG,EAAE;YACd,MAAM,aAAa,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,4BAA4B;YAElF,IAAI,CAAC,aAAa,EAAE;gBAChB,OAAO,IAAI,CAAC;aACf;YAED,MAAM,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YACvC,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;gBACjC,OAAO,IAAI,CAAC;aACf;YACD,wCAAwC;YACxC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE;gBAC5C,OAAO,IAAI,CAAC;aACf;YAED,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC;SACnB;QAED,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;YAC5B,OAAO,IAAI,CAAC;SACf;KACJ;IAED,OAAO,IAAI,CAAC;AAChB,CAAC;AAnCD,0CAmCC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/transform/plugins/table/utils.ts"],"names":[],"mappings":"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"}

package/package.json

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

package/src/scss/_term.scss

@@ -16,7 +16,7 @@
 
     &_dfn {
         position: absolute;
-        z-index: 1000;
+        z-index: 100;
 
         width: fit-content;
         max-width: 450px;

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

@@ -124,7 +124,7 @@ const index: MarkdownItPluginCb<Options> = (md, options) => {
                 } else {
                     id = slugify(title, {
                         lower: true,
-                        remove: /[*+~.()'"!:@`ь]/g,
+                        remove: /[*+~.()'"!:@`ь?]/g,
                     });
                     ghId = slugger.slug(title);
                 }

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

@@ -1,7 +1,7 @@
 import StateBlock from 'markdown-it/lib/rules_block/state_block';
 import {MarkdownItPluginCb} from '../typings';
 import Token from 'markdown-it/lib/token';
-import {parseAttrsClass} from './utils';
+import {parseAttrs} from './utils';
 
 const pluginName = 'yfm_table';
 const pipeChar = 0x7c; // |
@@ -96,6 +96,7 @@ class StateIterator {
 interface RowPositions {
     rows: [number, number, [Stats, Stats][]][];
     endOfTable: number | null;
+    pos: number;
 }
 
 function getTableRowPositions(
@@ -214,7 +215,17 @@ function getTableRowPositions(
 
         iter.next();
     }
-    return {rows, endOfTable};
+
+    const {pos} = iter;
+
+    return {rows, endOfTable, pos};
+}
+
+function extractAttributes(state: StateBlock, pos: number): Record<string, string[]> {
+    const attrsStringStart = state.skipSpaces(pos);
+    const attrsString = state.src.slice(attrsStringStart);
+
+    return parseAttrs(attrsString) ?? {};
 }
 
 /**
@@ -232,7 +243,7 @@ function extractAndApplyClassFromToken(contentToken: Token, tdOpenToken: Token):
     if (!allAttrs) {
         return;
     }
-    const attrsClass = parseAttrsClass(allAttrs[0].trim());
+    const attrsClass = parseAttrs(allAttrs[0].trim())?.class.join(' ');
     if (attrsClass) {
         tdOpenToken.attrSet('class', attrsClass);
         // remove the class from the token so that it's not propagated to tr or table level
@@ -363,13 +374,15 @@ const yfmTable: MarkdownItPluginCb = (md) => {
                 return true;
             }
 
-            const {rows, endOfTable} = getTableRowPositions(
+            const {rows, endOfTable, pos} = getTableRowPositions(
                 state,
                 startPosition,
                 endPosition,
                 startLine,
             );
 
+            const attrs = extractAttributes(state, pos);
+
             if (!endOfTable) {
                 token = state.push('__yfm_lint', '', 0);
                 token.hidden = true;
@@ -385,6 +398,11 @@ const yfmTable: MarkdownItPluginCb = (md) => {
 
             const tableStart = state.tokens.length;
             token = state.push('yfm_table_open', 'table', 1);
+
+            for (const [property, values] of Object.entries(attrs)) {
+                token.attrJoin(property, values.join(' '));
+            }
+
             token.map = [startLine, endOfTable];
 
             token = state.push('yfm_tbody_open', 'tbody', 1);

package/src/transform/plugins/table/utils.ts

@@ -1,13 +1,61 @@
-/**
- * Parse the markdown-attrs format to retrieve a class name
- * Putting all the requirements in regex was more complicated than parsing a string char by char.
- *
- * @param {string} inputString - The string to parse.
- * @returns {string|null} - The extracted class or null if there is none
- */
+type DatasetKey = `data-${string}`;
+type Attrs = 'class' | 'id' | DatasetKey;
 
-export function parseAttrsClass(inputString: string): string | null {
-    const validChars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ .=-_';
+type Selector = (value: string) => {
+    key: Attrs;
+    value: string;
+} | null;
+
+const wrapToData = (key: string): DatasetKey => {
+    if (key.startsWith('data-')) {
+        return key as DatasetKey;
+    }
+
+    return `data-${key}`;
+};
+
+const selectors = {
+    class(value: string) {
+        if (value.startsWith('.')) {
+            return {
+                key: 'class',
+                value: value.slice(1),
+            };
+        }
+
+        return null;
+    },
+    id(value: string) {
+        if (value.startsWith('#')) {
+            return {
+                key: 'id',
+                value: value.slice(1),
+            };
+        }
+
+        return null;
+    },
+    attr(value: string) {
+        const parts = value.split('=');
+
+        if (parts.length === 2) {
+            return {
+                key: wrapToData(parts[0]) as DatasetKey,
+                value: parts[1],
+            };
+        }
+
+        return {
+            key: wrapToData(value) as DatasetKey,
+            value: 'true',
+        };
+    },
+};
+
+const handlers = Object.values(selectors) as Selector[];
+
+export function parseAttrs(inputString: string) {
+    const validChars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ .=-_#';
 
     if (!inputString.startsWith('{')) {
         return null;
@@ -23,16 +71,31 @@ export function parseAttrsClass(inputString: string): string | null {
                 return null;
             }
 
-            const parts = contentInside.split('.');
-            if (parts.length !== 2 || !parts[1]) {
-                return null;
-            }
-            //There should be a preceding whitespace
-            if (!parts[0].endsWith(' ') && parts[0] !== '') {
-                return null;
-            }
+            const parts = contentInside.split(' ');
+
+            const attrs: Record<string, string[]> = {
+                class: [],
+                id: [],
+            };
+
+            parts.forEach((part) => {
+                const matched = handlers.find((test) => test(part));
+
+                if (!matched) {
+                    return;
+                }
+
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                const {key, value} = matched(part)!;
+
+                if (!attrs[key]) {
+                    attrs[key] = [];
+                }
+
+                attrs[key].push(value);
+            });
 
-            return parts[1];
+            return attrs;
         }
 
         if (!validChars.includes(char)) {