diff --git a/package-lock.json b/package-lock.json index 32927a4b61..892d3cdda9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,9 +11,10 @@ "dependencies": { "@braintree/sanitize-url": "^6.0.0", "@datalens-tech/xlsx": "^0.20.1", + "@diplodoc/cut-extension": "^0.5.0", "@diplodoc/latex-extension": "^1.1.0", "@diplodoc/mermaid-extension": "^1.2.3", - "@diplodoc/transform": "^4.20.0", + "@diplodoc/transform": "^4.42.3", "@gravity-ui/app-layout": "^2.1.0", "@gravity-ui/browserslist-config": "^4.3.0", "@gravity-ui/chartkit": "^5.19.1", @@ -134,7 +135,7 @@ "eslint": "^8.56.0", "highcharts": "^8.2.2", "history": "^4.10.1", - "htmlparser2": "^8.0.2", + "htmlparser2": "^9.1.0", "http-proxy": "^1.18.1", "husky": "^8.0.3", "immutability-helper": "^3.1.1", @@ -4220,6 +4221,37 @@ "node": ">=0.8" } }, + "node_modules/@diplodoc/cut-extension": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/@diplodoc/cut-extension/-/cut-extension-0.5.0.tgz", + "integrity": "sha512-UvSZmjTVL9DSvKLYzde3Y9RJGjM44s1iTP1iSytuInXDqLIeyd4wenNsr9LHqmAl6EB3V5/OMR+B3X8FgXNypg==", + "dependencies": { + "@diplodoc/directive": "^0.3.0" + }, + "peerDependencies": { + "@diplodoc/utils": "1.0.0", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, + "node_modules/@diplodoc/directive": { + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@diplodoc/directive/-/directive-0.3.0.tgz", + "integrity": "sha512-1UD7UHthRqO0rju/XNAaKQIxSy/pa1giEMlARBZ7U4ZPi1QeTw+QNyXy1TwvnBb5hc6jAChTjfOxDwpct1AEdg==", + "dependencies": { + "markdown-it-directive": "2.0.4" + } + }, + "node_modules/@diplodoc/file-extension": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/@diplodoc/file-extension/-/file-extension-0.2.1.tgz", + "integrity": "sha512-4m9ZcQwmeHw0t2t5vv5GGxKfUifOdpf4Idb9a/Rfkxl6pqGnk0rnZ0xwXrruQEwinkQIBL4TCl2YN3SKGaBrjQ==", + "dependencies": { + "@diplodoc/directive": "^0.3.0" + }, + "peerDependencies": { + "markdown-it": "^13.0.0" + } + }, "node_modules/@diplodoc/latex-extension": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/@diplodoc/latex-extension/-/latex-extension-1.1.0.tgz", @@ -4254,9 +4286,9 @@ } }, "node_modules/@diplodoc/tabs-extension": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/@diplodoc/tabs-extension/-/tabs-extension-3.1.0.tgz", - "integrity": "sha512-IiDg91ThoskSScENJ10ZXNEYOOpSQFOW4dmwzIL1dd5NdLKVJYajWkH9N9QAM7jG5oTWcWeKDTD5wgXbRJHbVA==", + "version": "3.5.1", + "resolved": "https://registry.npmjs.org/@diplodoc/tabs-extension/-/tabs-extension-3.5.1.tgz", + "integrity": "sha512-YfxEiSq6S0E4XBmdgcTrV9Zh6LWjYKi5CixWzfe2NZt7OqT6WqcEXt4q9wSmtDMzlZf5pVYbl+y9+swVWqf9yQ==", "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0" }, @@ -4267,13 +4299,15 @@ } }, "node_modules/@diplodoc/transform": { - "version": "4.20.0", - "resolved": "https://registry.npmjs.org/@diplodoc/transform/-/transform-4.20.0.tgz", - "integrity": "sha512-9VVTLE17DgoTyWHzPXlMD1kKHBpxXXMfO/Ey1qSTqEg48SWPF38/lOozyV5w79H2KkzEy788WZuUSFxdk4bCnw==", + "version": "4.42.3", + "resolved": "https://registry.npmjs.org/@diplodoc/transform/-/transform-4.42.3.tgz", + "integrity": "sha512-2PO5TDszOO4N6IMN7vzcak99NfCl1r5O3WGhpbeQiCMqBlEJSMLuGP7SJpxxdpj10AdzqpqEj3B3zgKuyqh0cw==", "dependencies": { - "@diplodoc/tabs-extension": "^3.0.0", + "@diplodoc/cut-extension": "^0.6.0", + "@diplodoc/file-extension": "^0.2.0", + "@diplodoc/tabs-extension": "^3.5.0", "chalk": "^4.1.2", - "cheerio": "^1.0.0-rc.12", + "cheerio": "^1.0.0", "css": "^3.0.0", "cssfilter": "0.0.10", "get-root-node-polyfill": "1.0.0", @@ -4281,15 +4315,16 @@ "js-yaml": "^4.1.0", "lodash": "4.17.21", "markdown-it": "^13.0.2", - "markdown-it-attrs": "4.1.4", + "markdown-it-attrs": "^4.2.0", "markdown-it-deflist": "2.1.0", "markdown-it-meta": "0.0.1", "markdown-it-sup": "1.0.0", "markdownlint": "^0.32.1", "markdownlint-rule-helpers": "0.17.2", "sanitize-html": "^2.11.0", - "slugify": "1.6.5", - "svgo": "^3.2.0" + "slugify": "1.6.6", + "svgo": "^3.2.0", + "ts-dedent": "^2.2.0" }, "peerDependencies": { "highlight.js": "^10.0.3 || ^11" @@ -4300,6 +4335,23 @@ } } }, + "node_modules/@diplodoc/transform/node_modules/@diplodoc/cut-extension": { + "version": "0.6.0", + "resolved": "https://registry.npmjs.org/@diplodoc/cut-extension/-/cut-extension-0.6.0.tgz", + "integrity": "sha512-Qux2+CDpud06JjUxciTAz8PDN36Yebjz6vPOVlvPE3O3RyC0nGyiC/0/tZXmWAEyrT1JTmY8Pm6YPy9Pknq2GQ==", + "dependencies": { + "@diplodoc/directive": "^0.3.0", + "@diplodoc/utils": "^1.0.0" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, + "node_modules/@diplodoc/utils": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@diplodoc/utils/-/utils-1.0.0.tgz", + "integrity": "sha512-rGDVyqZyJ4GUjuUIYeMG7w6w5mb1dLF/nkloWEyxqZWy/POO4GiHAG83d4wK6U3gTFGTe+BXabQzdIKZwNVCTw==" + }, "node_modules/@discoveryjs/json-ext": { "version": "0.5.7", "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.5.7.tgz", @@ -10183,7 +10235,6 @@ }, "node_modules/@types/linkify-it": { "version": "3.0.2", - "dev": true, "license": "MIT" }, "node_modules/@types/lodash": { @@ -10200,7 +10251,6 @@ "version": "13.0.7", "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-13.0.7.tgz", "integrity": "sha512-U/CBi2YUUcTHBt5tjO2r5QV/x0Po6nsYwQU4Y04fBS6vfoImaiZ6f8bi3CjTCxBPQSO1LMyUqkByzi8AidyxfA==", - "dev": true, "dependencies": { "@types/linkify-it": "*", "@types/mdurl": "*" @@ -10223,7 +10273,6 @@ }, "node_modules/@types/mdurl": { "version": "1.0.2", - "dev": true, "license": "MIT" }, "node_modules/@types/mime": { @@ -12789,20 +12838,24 @@ } }, "node_modules/cheerio": { - "version": "1.0.0-rc.12", - "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0-rc.12.tgz", - "integrity": "sha512-VqR8m68vM46BNnuZ5NtnGBKIE/DfN0cRIzg9n40EIq9NOv90ayxLBXA8fXC5gquFRGJSTRqBq25Jt2ECLR431Q==", + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/cheerio/-/cheerio-1.0.0.tgz", + "integrity": "sha512-quS9HgjQpdaXOvsZz82Oz7uxtXiy6UIsIQcpBj7HRw2M63Skasm9qlDocAM7jNuaxdhpPU7c4kJN+gA5MCu4ww==", "dependencies": { "cheerio-select": "^2.1.0", "dom-serializer": "^2.0.0", "domhandler": "^5.0.3", - "domutils": "^3.0.1", - "htmlparser2": "^8.0.1", - "parse5": "^7.0.0", - "parse5-htmlparser2-tree-adapter": "^7.0.0" + "domutils": "^3.1.0", + "encoding-sniffer": "^0.2.0", + "htmlparser2": "^9.1.0", + "parse5": "^7.1.2", + "parse5-htmlparser2-tree-adapter": "^7.0.0", + "parse5-parser-stream": "^7.1.2", + "undici": "^6.19.5", + "whatwg-mimetype": "^4.0.0" }, "engines": { - "node": ">= 6" + "node": ">=18.17" }, "funding": { "url": "https://github.com/cheeriojs/cheerio?sponsor=1" @@ -12824,6 +12877,14 @@ "url": "https://github.com/sponsors/fb55" } }, + "node_modules/cheerio/node_modules/whatwg-mimetype": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz", + "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==", + "engines": { + "node": ">=18" + } + }, "node_modules/chokidar": { "version": "3.6.0", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", @@ -14996,6 +15057,40 @@ "iconv-lite": "^0.6.2" } }, + "node_modules/encoding-sniffer": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/encoding-sniffer/-/encoding-sniffer-0.2.0.tgz", + "integrity": "sha512-ju7Wq1kg04I3HtiYIOrUrdfdDvkyO9s5XM8QAj/bN61Yo/Vb4vgJxy5vi4Yxk01gWHbrofpPtpxM8bKger9jhg==", + "dependencies": { + "iconv-lite": "^0.6.3", + "whatwg-encoding": "^3.1.1" + }, + "funding": { + "url": "https://github.com/fb55/encoding-sniffer?sponsor=1" + } + }, + "node_modules/encoding-sniffer/node_modules/iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/encoding-sniffer/node_modules/whatwg-encoding": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz", + "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==", + "dependencies": { + "iconv-lite": "0.6.3" + }, + "engines": { + "node": ">=18" + } + }, "node_modules/encoding/node_modules/iconv-lite": { "version": "0.6.3", "dev": true, @@ -17329,9 +17424,9 @@ } }, "node_modules/htmlparser2": { - "version": "8.0.2", - "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-8.0.2.tgz", - "integrity": "sha512-GYdjWKDkbRLkZ5geuHs5NY1puJ+PXwP7+fHPRz06Eirsb9ugf6d8kkXav6ADhcODhFFPMIXyxkxSuMf3D6NCFA==", + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-9.1.0.tgz", + "integrity": "sha512-5zfg6mHUoaer/97TxnGpxmbR7zJtPwIYFMZ/H5ucTlPZhKvtum05yiPK3Mgai3a0DyVxv7qYqoweaEd2nrYQzQ==", "funding": [ "https://github.com/fb55/htmlparser2?sponsor=1", { @@ -17339,12 +17434,11 @@ "url": "https://github.com/sponsors/fb55" } ], - "license": "MIT", "dependencies": { "domelementtype": "^2.3.0", "domhandler": "^5.0.3", - "domutils": "^3.0.1", - "entities": "^4.4.0" + "domutils": "^3.1.0", + "entities": "^4.5.0" } }, "node_modules/http-deceiver": { @@ -22423,8 +22517,9 @@ } }, "node_modules/markdown-it-attrs": { - "version": "4.1.4", - "license": "MIT", + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/markdown-it-attrs/-/markdown-it-attrs-4.3.1.tgz", + "integrity": "sha512-/ko6cba+H6gdZ0DOw7BbNMZtfuJTRp9g/IrGIuz8lYc/EfnmWRpaR3CFPnNbVz0LDvF8Gf1hFGPqrQqq7De0rg==", "engines": { "node": ">=6" }, @@ -22441,6 +22536,15 @@ "version": "2.1.0", "license": "MIT" }, + "node_modules/markdown-it-directive": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/markdown-it-directive/-/markdown-it-directive-2.0.4.tgz", + "integrity": "sha512-XtGbBcP0aoRgKiDIIsxvgSXZz3ptI5AOydLAfF+n/LRmdy4ROdHntboJMEg8Fd0B+SMtOynCpiDFDKboatPbMw==", + "peerDependencies": { + "@types/markdown-it": "^12.0.0 || ^13.0.0", + "markdown-it": "^12.0.0 || ^13.0.0" + } + }, "node_modules/markdown-it-link-attributes": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/markdown-it-link-attributes/-/markdown-it-link-attributes-4.0.1.tgz", @@ -23607,11 +23711,22 @@ } }, "node_modules/parse5-htmlparser2-tree-adapter": { - "version": "7.0.0", - "resolved": "https://registry.npmjs.org/parse5-htmlparser2-tree-adapter/-/parse5-htmlparser2-tree-adapter-7.0.0.tgz", - "integrity": "sha512-B77tOZrqqfUfnVcOrUvfdLbz4pu4RopLD/4vmu3HUPswwTA8OH0EMW9BlWR2B0RCoiZRAHEUu7IxeP1Pd1UU+g==", + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/parse5-htmlparser2-tree-adapter/-/parse5-htmlparser2-tree-adapter-7.1.0.tgz", + "integrity": "sha512-ruw5xyKs6lrpo9x9rCZqZZnIUntICjQAd0Wsmp396Ul9lN/h+ifgVV1x1gZHi8euej6wTfpqX8j+BFQxF0NS/g==", + "dependencies": { + "domhandler": "^5.0.3", + "parse5": "^7.0.0" + }, + "funding": { + "url": "https://github.com/inikulin/parse5?sponsor=1" + } + }, + "node_modules/parse5-parser-stream": { + "version": "7.1.2", + "resolved": "https://registry.npmjs.org/parse5-parser-stream/-/parse5-parser-stream-7.1.2.tgz", + "integrity": "sha512-JyeQc9iwFLn5TbvvqACIF/VXG6abODeB3Fwmv/TGdLk2LfbWkaySGY72at4+Ty7EkPZj854u4CrICqNk2qIbow==", "dependencies": { - "domhandler": "^5.0.2", "parse5": "^7.0.0" }, "funding": { @@ -26835,6 +26950,24 @@ "postcss": "^8.3.11" } }, + "node_modules/sanitize-html/node_modules/htmlparser2": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-8.0.2.tgz", + "integrity": "sha512-GYdjWKDkbRLkZ5geuHs5NY1puJ+PXwP7+fHPRz06Eirsb9ugf6d8kkXav6ADhcODhFFPMIXyxkxSuMf3D6NCFA==", + "funding": [ + "https://github.com/fb55/htmlparser2?sponsor=1", + { + "type": "github", + "url": "https://github.com/sponsors/fb55" + } + ], + "dependencies": { + "domelementtype": "^2.3.0", + "domhandler": "^5.0.3", + "domutils": "^3.0.1", + "entities": "^4.4.0" + } + }, "node_modules/sass": { "version": "1.80.2", "resolved": "https://registry.npmjs.org/sass/-/sass-1.80.2.tgz", @@ -27298,8 +27431,9 @@ } }, "node_modules/slugify": { - "version": "1.6.5", - "license": "MIT", + "version": "1.6.6", + "resolved": "https://registry.npmjs.org/slugify/-/slugify-1.6.6.tgz", + "integrity": "sha512-h+z7HKHYXj6wJU+AnS/+IH8Uh9fdcX1Lrhg1/VMdf9PwoBQXFcXiAdsy2tSK0P6gKwJLXp02r90ahUCqHk9rrw==", "engines": { "node": ">=8.0.0" } @@ -28514,6 +28648,14 @@ "typescript": ">=4.2.0" } }, + "node_modules/ts-dedent": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/ts-dedent/-/ts-dedent-2.2.0.tgz", + "integrity": "sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==", + "engines": { + "node": ">=6.10" + } + }, "node_modules/ts-jest": { "version": "29.0.5", "dev": true, @@ -28860,6 +29002,14 @@ "dev": true, "license": "MIT" }, + "node_modules/undici": { + "version": "6.21.0", + "resolved": "https://registry.npmjs.org/undici/-/undici-6.21.0.tgz", + "integrity": "sha512-BUgJXc752Kou3oOIuU1i+yZZypyZRqNPW0vqoMPl8VaoalSfeR0D8/t4iAS3yirs79SSMTxTag+ZC86uswv+Cw==", + "engines": { + "node": ">=18.17" + } + }, "node_modules/undici-types": { "version": "5.26.5", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", diff --git a/package.json b/package.json index 43f379accb..a9df15f87d 100644 --- a/package.json +++ b/package.json @@ -55,9 +55,10 @@ "dependencies": { "@braintree/sanitize-url": "^6.0.0", "@datalens-tech/xlsx": "^0.20.1", + "@diplodoc/cut-extension": "^0.5.0", "@diplodoc/latex-extension": "^1.1.0", "@diplodoc/mermaid-extension": "^1.2.3", - "@diplodoc/transform": "^4.20.0", + "@diplodoc/transform": "^4.42.3", "@gravity-ui/app-layout": "^2.1.0", "@gravity-ui/browserslist-config": "^4.3.0", "@gravity-ui/chartkit": "^5.19.1", @@ -178,7 +179,7 @@ "eslint": "^8.56.0", "highcharts": "^8.2.2", "history": "^4.10.1", - "htmlparser2": "^8.0.2", + "htmlparser2": "^9.1.0", "http-proxy": "^1.18.1", "husky": "^8.0.3", "immutability-helper": "^3.1.1", diff --git a/src/shared/modules/markdown/markdown.ts b/src/shared/modules/markdown/markdown.ts index 6c2bae4eb0..93ffda15af 100644 --- a/src/shared/modules/markdown/markdown.ts +++ b/src/shared/modules/markdown/markdown.ts @@ -1,7 +1,7 @@ +import {transform as yfmCut} from '@diplodoc/cut-extension'; import {transform as latex} from '@diplodoc/latex-extension/plugin'; import {transform as mermaid} from '@diplodoc/mermaid-extension/plugin'; import yfmTransform from '@diplodoc/transform'; -import cut from '@diplodoc/transform/lib/plugins/cut'; import deflist from '@diplodoc/transform/lib/plugins/deflist'; import imsize from '@diplodoc/transform/lib/plugins/imsize'; import notes from '@diplodoc/transform/lib/plugins/notes'; @@ -11,6 +11,7 @@ import type {MarkdownItPluginCb} from '@diplodoc/transform/lib/plugins/typings'; import {defaultOptions} from '@diplodoc/transform/lib/sanitize'; // eslint-disable-next-line import/no-extraneous-dependencies import type MarkdownIt from 'markdown-it'; +import type {PluginWithParams} from 'markdown-it'; import MarkdownItColor from 'markdown-it-color'; import Mila from 'markdown-it-link-attributes'; import {v4 as uuidv4} from 'uuid'; @@ -38,7 +39,7 @@ export function renderHTML(args: RenderHtmlArgs): RenderHtmlOutput { const plugins = [ deflist, notes, - cut, + yfmCut({bundle: false}) as PluginWithParams, term, (md: MarkdownIt) => md diff --git a/src/ui/components/YfmWrapper/YfmWrapperContent.scss b/src/ui/components/YfmWrapper/YfmWrapperContent.scss index e15f884097..1394e7ed1e 100644 --- a/src/ui/components/YfmWrapper/YfmWrapperContent.scss +++ b/src/ui/components/YfmWrapper/YfmWrapperContent.scss @@ -1,4 +1,7 @@ @import '~@gravity-ui/uikit/styles/mixins'; +@import '~@diplodoc/transform/dist/css/base.css'; +@import '~@diplodoc/transform/dist/css/_yfm-only.css'; +@import '~@diplodoc/cut-extension/runtime/styles.css'; @import '../../styles/mixins'; // support yfm dark theme diff --git a/src/ui/components/YfmWrapper/YfmWrapperContent.tsx b/src/ui/components/YfmWrapper/YfmWrapperContent.tsx index 3e0b74b89d..c5f7685e1b 100644 --- a/src/ui/components/YfmWrapper/YfmWrapperContent.tsx +++ b/src/ui/components/YfmWrapper/YfmWrapperContent.tsx @@ -1,11 +1,11 @@ import React from 'react'; -import '@diplodoc/transform/dist/js/yfm'; +import '@diplodoc/cut-extension/runtime'; +import '@diplodoc/transform/dist/js/_yfm-only'; +import '@diplodoc/transform/dist/js/base'; import {YFM_MARKDOWN_CLASSNAME} from '../../constants/yfm'; -import '@diplodoc/transform/dist/css/yfm.css'; -// eslint-disable-next-line import/order import './YfmWrapperContent.scss'; type YfmWrapperProps = {