From f886b1f5a5d9cf68269ddd56c56758f4c79079c4 Mon Sep 17 00:00:00 2001 From: Valentin Palkovic Date: Tue, 16 Jan 2024 15:14:23 +0100 Subject: [PATCH] Replace remark by rehype plugins --- code/addons/docs/package.json | 4 +- code/addons/docs/src/plugins/mdx-plugin.ts | 25 ++-- code/addons/docs/src/preset.ts | 12 +- code/addons/docs/src/typings.d.ts | 2 - code/yarn.lock | 142 ++++++++++----------- 5 files changed, 85 insertions(+), 100 deletions(-) diff --git a/code/addons/docs/package.json b/code/addons/docs/package.json index f0431c3b1500..002f247ed7f3 100644 --- a/code/addons/docs/package.json +++ b/code/addons/docs/package.json @@ -114,8 +114,8 @@ "fs-extra": "^11.1.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "remark-external-links": "^8.0.0", - "remark-slug": "^6.0.0", + "rehype-external-links": "^3.0.0", + "rehype-slug": "^6.0.0", "ts-dedent": "^2.0.0" }, "devDependencies": { diff --git a/code/addons/docs/src/plugins/mdx-plugin.ts b/code/addons/docs/src/plugins/mdx-plugin.ts index c011a9202fb7..a75194fa7309 100644 --- a/code/addons/docs/src/plugins/mdx-plugin.ts +++ b/code/addons/docs/src/plugins/mdx-plugin.ts @@ -1,10 +1,10 @@ import type { Options } from '@storybook/types'; import type { Plugin } from 'vite'; -import remarkSlug from 'remark-slug'; -import remarkExternalLinks from 'remark-external-links'; +import rehypeSlug from 'rehype-slug'; +import rehypeExternalLinks from 'rehype-external-links'; import { createFilter } from '@rollup/pluginutils'; import { dirname, join } from 'path'; - +import type { CompileOptions } from '../compiler'; import { compile } from '../compiler'; /** @@ -18,7 +18,8 @@ export async function mdxPlugin(options: Options): Promise { const include = /\.mdx$/; const filter = createFilter(include); const { presets } = options; - const { mdxPluginOptions } = await presets.apply>('options', {}); + const presetOptions = await presets.apply>('options', {}); + const mdxPluginOptions = presetOptions?.mdxPluginOptions as CompileOptions; return { name: 'storybook:mdx-plugin', @@ -26,7 +27,7 @@ export async function mdxPlugin(options: Options): Promise { async transform(src, id) { if (!filter(id)) return undefined; - const mdxLoaderOptions = await options.presets.apply('mdxLoaderOptions', { + const mdxLoaderOptions: CompileOptions = await presets.apply('mdxLoaderOptions', { ...mdxPluginOptions, mdxCompileOptions: { providerImportSource: join( @@ -34,17 +35,15 @@ export async function mdxPlugin(options: Options): Promise { '/dist/shims/mdx-react-shim' ), ...mdxPluginOptions?.mdxCompileOptions, - remarkPlugins: [remarkSlug, remarkExternalLinks].concat( - mdxPluginOptions?.mdxCompileOptions?.remarkPlugins ?? [] - ), + rehypePlugins: [ + ...(mdxPluginOptions?.mdxCompileOptions?.rehypePlugins ?? []), + rehypeSlug, + rehypeExternalLinks, + ], }, }); - const code = String( - await compile(src, { - ...mdxLoaderOptions, - }) - ); + const code = String(await compile(src, mdxLoaderOptions)); return { code, diff --git a/code/addons/docs/src/preset.ts b/code/addons/docs/src/preset.ts index 8d623fe5b97f..ae79832240d1 100644 --- a/code/addons/docs/src/preset.ts +++ b/code/addons/docs/src/preset.ts @@ -1,6 +1,6 @@ import { dirname, join } from 'path'; -import remarkSlug from 'remark-slug'; -import remarkExternalLinks from 'remark-external-links'; +import rehypeSlug from 'rehype-slug'; +import rehypeExternalLinks from 'rehype-external-links'; import type { DocsOptions, Options, PresetProperty } from '@storybook/types'; import type { CsfPluginOptions } from '@storybook/csf-plugin'; @@ -48,9 +48,11 @@ async function webpack( '/dist/shims/mdx-react-shim' ), ...mdxPluginOptions.mdxCompileOptions, - remarkPlugins: [remarkSlug, remarkExternalLinks].concat( - mdxPluginOptions?.mdxCompileOptions?.remarkPlugins ?? [] - ), + rehypePlugins: [ + ...(mdxPluginOptions?.mdxCompileOptions?.rehypePlugins ?? []), + rehypeSlug, + rehypeExternalLinks, + ], }, }); diff --git a/code/addons/docs/src/typings.d.ts b/code/addons/docs/src/typings.d.ts index a3efeb653c83..7349466f2a65 100644 --- a/code/addons/docs/src/typings.d.ts +++ b/code/addons/docs/src/typings.d.ts @@ -1,6 +1,4 @@ declare module '@egoist/vue-to-react'; -declare module 'remark-slug'; -declare module 'remark-external-links'; declare module 'acorn-jsx'; declare module 'vue/dist/vue'; diff --git a/code/yarn.lock b/code/yarn.lock index 54e625cf8ce0..0a64a5d18046 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -4915,8 +4915,8 @@ __metadata: fs-extra: "npm:^11.1.0" react: "npm:^18.2.0" react-dom: "npm:^18.2.0" - remark-external-links: "npm:^8.0.0" - remark-slug: "npm:^6.0.0" + rehype-external-links: "npm:^3.0.0" + rehype-slug: "npm:^6.0.0" ts-dedent: "npm:^2.0.0" typescript: "npm:^5.3.2" vite: "npm:^4.0.4" @@ -15940,10 +15940,10 @@ __metadata: languageName: node linkType: hard -"github-slugger@npm:^1.0.0": - version: 1.5.0 - resolution: "github-slugger@npm:1.5.0" - checksum: 116f99732925f939cbfd6f2e57db1aa7e111a460db0d103e3b3f2fce6909d44311663d4542350706cad806345b9892358cc3b153674f88eeae77f43380b3bfca +"github-slugger@npm:^2.0.0": + version: 2.0.0 + resolution: "github-slugger@npm:2.0.0" + checksum: 21b912b6b1e48f1e5a50b2292b48df0ff6abeeb0691b161b3d93d84f4ae6b1acd6ae23702e914af7ea5d441c096453cf0f621b72d57893946618d21dd1a1c486 languageName: node linkType: hard @@ -16452,6 +16452,24 @@ __metadata: languageName: node linkType: hard +"hast-util-heading-rank@npm:^3.0.0": + version: 3.0.0 + resolution: "hast-util-heading-rank@npm:3.0.0" + dependencies: + "@types/hast": "npm:^3.0.0" + checksum: 1879c84f629e73f1f13247ab349324355cd801363b44e3d46f763aa5c0ea3b42dcd47b46e5643a0502cf01a6b1fdb9208fd12852e44ca6c671b3e4bccf9369a1 + languageName: node + linkType: hard + +"hast-util-is-element@npm:^3.0.0": + version: 3.0.0 + resolution: "hast-util-is-element@npm:3.0.0" + dependencies: + "@types/hast": "npm:^3.0.0" + checksum: f5361e4c9859c587ca8eb0d8343492f3077ccaa0f58a44cd09f35d5038f94d65152288dcd0c19336ef2c9491ec4d4e45fde2176b05293437021570aa0bc3613b + languageName: node + linkType: hard + "hast-util-parse-selector@npm:^2.0.0": version: 2.2.5 resolution: "hast-util-parse-selector@npm:2.2.5" @@ -16506,6 +16524,15 @@ __metadata: languageName: node linkType: hard +"hast-util-to-string@npm:^3.0.0": + version: 3.0.0 + resolution: "hast-util-to-string@npm:3.0.0" + dependencies: + "@types/hast": "npm:^3.0.0" + checksum: 649edd993cf244563ad86d861aa0863759a4fbec49c43b3d92240e42aa4b69f0c3332ddff9e80954bbd8756c86b0fddc20e97d281c6da59d00427f45da8dab68 + languageName: node + linkType: hard + "hast-util-whitespace@npm:^3.0.0": version: 3.0.0 resolution: "hast-util-whitespace@npm:3.0.0" @@ -17281,10 +17308,10 @@ __metadata: languageName: node linkType: hard -"is-absolute-url@npm:^3.0.0": - version: 3.0.3 - resolution: "is-absolute-url@npm:3.0.3" - checksum: 04c415974c32e73a83d3a21a9bea18fc4e2c14fbe6bbd64832cf1e67a75ade2af0e900f552f0b8a447f1305f5ffc9d143ccd8d005dbe715d198c359d342b86f0 +"is-absolute-url@npm:^4.0.0": + version: 4.0.1 + resolution: "is-absolute-url@npm:4.0.1" + checksum: 6f8f603945bd9f2c6031758bbc12352fc647bd5d807cad10d96cc6300fd0e15240cc091521a61db767e4ec0bacff257b4f1015fd5249c147bbb4a4497356c72e languageName: node linkType: hard @@ -19640,15 +19667,6 @@ __metadata: languageName: node linkType: hard -"mdast-util-definitions@npm:^4.0.0": - version: 4.0.0 - resolution: "mdast-util-definitions@npm:4.0.0" - dependencies: - unist-util-visit: "npm:^2.0.0" - checksum: d81bb0b702f99878c8e8e4f66dd7f6f673ab341f061b3d9487ba47dad28b584e02f16b4c42df23714eaac8a7dd8544ba7d77308fad8d4a9fd0ac92e2a7f56be9 - languageName: node - linkType: hard - "mdast-util-find-and-replace@npm:^3.0.0": version: 3.0.1 resolution: "mdast-util-find-and-replace@npm:3.0.1" @@ -19930,13 +19948,6 @@ __metadata: languageName: node linkType: hard -"mdast-util-to-string@npm:^1.0.0": - version: 1.1.0 - resolution: "mdast-util-to-string@npm:1.1.0" - checksum: 5dad9746ec0839792a8a35f504564e8d2b8c30013652410306c111963d33f1ee7b5477aa64ed77b64e13216363a29395809875ffd80e2031a08614657628a121 - languageName: node - linkType: hard - "mdast-util-to-string@npm:^3.0.0, mdast-util-to-string@npm:^3.1.0": version: 3.2.0 resolution: "mdast-util-to-string@npm:3.2.0" @@ -24539,6 +24550,33 @@ __metadata: languageName: node linkType: hard +"rehype-external-links@npm:^3.0.0": + version: 3.0.0 + resolution: "rehype-external-links@npm:3.0.0" + dependencies: + "@types/hast": "npm:^3.0.0" + "@ungap/structured-clone": "npm:^1.0.0" + hast-util-is-element: "npm:^3.0.0" + is-absolute-url: "npm:^4.0.0" + space-separated-tokens: "npm:^2.0.0" + unist-util-visit: "npm:^5.0.0" + checksum: 486b5db73d8fe72611d62b4eb0b56ec71025ea32bba764ad54473f714ca627be75e057ac29243763f85a77c3810f31727ce3e03c975b3803c1c98643d038e9ae + languageName: node + linkType: hard + +"rehype-slug@npm:^6.0.0": + version: 6.0.0 + resolution: "rehype-slug@npm:6.0.0" + dependencies: + "@types/hast": "npm:^3.0.0" + github-slugger: "npm:^2.0.0" + hast-util-heading-rank: "npm:^3.0.0" + hast-util-to-string: "npm:^3.0.0" + unist-util-visit: "npm:^5.0.0" + checksum: 51303c33d039c271cabe62161b49fa737be488f70ced62f00c165e47a089a99de2060050385e5c00d0df83ed30c7fa1c79a51b78508702836aefa51f7e7a6760 + languageName: node + linkType: hard + "relateurl@npm:^0.2.7": version: 0.2.7 resolution: "relateurl@npm:0.2.7" @@ -24560,19 +24598,6 @@ __metadata: languageName: node linkType: hard -"remark-external-links@npm:^8.0.0": - version: 8.0.0 - resolution: "remark-external-links@npm:8.0.0" - dependencies: - extend: "npm:^3.0.0" - is-absolute-url: "npm:^3.0.0" - mdast-util-definitions: "npm:^4.0.0" - space-separated-tokens: "npm:^1.0.0" - unist-util-visit: "npm:^2.0.0" - checksum: 5f0affc97e18ad3247e3b29449f4df98be5a75950cf0f0f13dd1755c4ef1065f9ab44626bba34d913d32bb92afd6f06a8e2f8068e83b48337f0b7a5d1f0cecfe - languageName: node - linkType: hard - "remark-gfm@npm:^4.0.0": version: 4.0.0 resolution: "remark-gfm@npm:4.0.0" @@ -24868,17 +24893,6 @@ __metadata: languageName: node linkType: hard -"remark-slug@npm:^6.0.0": - version: 6.1.0 - resolution: "remark-slug@npm:6.1.0" - dependencies: - github-slugger: "npm:^1.0.0" - mdast-util-to-string: "npm:^1.0.0" - unist-util-visit: "npm:^2.0.0" - checksum: 7cc2857936fce9c9c00b9c7d70de46d594cedf93bd8560fd006164dee7aacccdf472654ee35b33f4fb4bd0af882d89998c6d0c9088c2e95702a9fc15ebae002a - languageName: node - linkType: hard - "remark-stringify@npm:^11.0.0": version: 11.0.0 resolution: "remark-stringify@npm:11.0.0" @@ -28228,13 +28242,6 @@ __metadata: languageName: node linkType: hard -"unist-util-is@npm:^4.0.0": - version: 4.1.0 - resolution: "unist-util-is@npm:4.1.0" - checksum: 21ca3d7bacc88853b880b19cb1b133a056c501617d7f9b8cce969cd8b430ed7e1bc416a3a11b02540d5de6fb86807e169d00596108a459d034cf5faec97c055e - languageName: node - linkType: hard - "unist-util-is@npm:^5.0.0": version: 5.2.1 resolution: "unist-util-is@npm:5.2.1" @@ -28321,16 +28328,6 @@ __metadata: languageName: node linkType: hard -"unist-util-visit-parents@npm:^3.0.0": - version: 3.1.1 - resolution: "unist-util-visit-parents@npm:3.1.1" - dependencies: - "@types/unist": "npm:^2.0.0" - unist-util-is: "npm:^4.0.0" - checksum: 231c80c5ba8e79263956fcaa25ed2a11ad7fe77ac5ba0d322e9d51bbc4238501e3bb52f405e518bcdc5471e27b33eff520db0aa4a3b1feb9fb6e2de6ae385d49 - languageName: node - linkType: hard - "unist-util-visit-parents@npm:^4.0.0": version: 4.1.1 resolution: "unist-util-visit-parents@npm:4.1.1" @@ -28361,17 +28358,6 @@ __metadata: languageName: node linkType: hard -"unist-util-visit@npm:^2.0.0": - version: 2.0.3 - resolution: "unist-util-visit@npm:2.0.3" - dependencies: - "@types/unist": "npm:^2.0.0" - unist-util-is: "npm:^4.0.0" - unist-util-visit-parents: "npm:^3.0.0" - checksum: 7b11303d82271ca53a2ced2d56c87a689dd518596c99ff4a11cdff750f5cc5c0e4b64b146bd2363557cb29443c98713bfd1e8dc6d1c3f9d474b9eb1f23a60888 - languageName: node - linkType: hard - "unist-util-visit@npm:^3.0.0": version: 3.1.0 resolution: "unist-util-visit@npm:3.1.0"