@readme/markdown 8.3.0 → 8.4.1

package/components/TailwindRoot/index.tsx

@@ -1,11 +1,13 @@
 import React from 'react';
 
+import { tailwindPrefix } from '../../utils/consts';
+
 interface Props extends React.PropsWithChildren<{ flow: boolean }> {}
 
 const TailwindRoot = ({ children, flow }: Props) => {
   const Tag = flow ? 'div' : 'span';
 
-  return <Tag className="readme-tailwind">{children}</Tag>;
+  return <Tag className={tailwindPrefix}>{children}</Tag>;
 };
 
 export default TailwindRoot;

package/dist/example/components.d.ts

@@ -3,5 +3,6 @@ declare const components: {
     Test: string;
     MultipleExports: string;
     TailwindRootTest: string;
+    Steps: string;
 };
 export default components;

package/dist/lib/compile.d.ts

@@ -3,6 +3,7 @@ export type CompileOpts = CompileOptions & {
     components?: Record<string, string>;
     copyButtons?: boolean;
     useTailwind?: boolean;
+    useTailwindRoot?: boolean;
 };
-declare const compile: (text: string, { components, copyButtons, useTailwind, ...opts }?: CompileOpts) => Promise<string>;
+declare const compile: (text: string, { components, copyButtons, useTailwind, useTailwindRoot, ...opts }?: CompileOpts) => Promise<string>;
 export default compile;

package/dist/main.js

@@ -18590,11 +18590,15 @@ function TableOfContents({ children }) {
 }
 /* harmony default export */ const components_TableOfContents = (TableOfContents);
 
+;// ./utils/consts.ts
+const tailwindPrefix = 'readme-tailwind';
+
 ;// ./components/TailwindRoot/index.tsx
 
+
 const TailwindRoot = ({ children, flow }) => {
     const Tag = flow ? 'div' : 'span';
-    return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement(Tag, { className: "readme-tailwind" }, children);
+    return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement(Tag, { className: tailwindPrefix }, children);
 };
 /* harmony default export */ const components_TailwindRoot = (TailwindRoot);
 
@@ -71623,10 +71627,12 @@ async function tailwindBundle(string, { prefix }) {
 
 
 
-const exportTailwindStylesheet = async (tree, components) => {
+
+const exportTailwindStylesheet = async (tree, vfile, { components, parseRoot }) => {
     if (hasNamedExport(tree, 'stylesheet'))
         return;
-    const stylesheet = (await tailwind_bundle(Object.values(components).join('\n\n'), { prefix: '.readme-tailwind' })).css;
+    const stringToParse = [...Object.values(components), parseRoot ? String(vfile) : ''].join('\n\n');
+    const stylesheet = (await tailwind_bundle(stringToParse, { prefix: `.${tailwindPrefix}` })).css;
     const exportNode = {
         type: 'mdxjsEsm',
         value: '',
@@ -71677,13 +71683,13 @@ const injectTailwindRoot = ({ components = {} }) => (node, index, parent) => {
     // eslint-disable-next-line consistent-return
     return SKIP;
 };
-const tailwind = ({ components }) => async (tree, vfile) => {
+const tailwind = ({ components, parseRoot }) => async (tree, vfile) => {
     const localComponents = getExports(tree).reduce((acc, name) => {
         acc[name] = String(vfile);
         return acc;
     }, {});
     visit(tree, isMDXElement, injectTailwindRoot({ components: { ...components, ...localComponents } }));
-    await exportTailwindStylesheet(tree, { ...components, ...localComponents });
+    await exportTailwindStylesheet(tree, vfile, { components: { ...components, ...localComponents }, parseRoot });
     return tree;
 };
 /* harmony default export */ const transform_tailwind = (tailwind);
@@ -83687,10 +83693,10 @@ const tocToHast = (headings = []) => {
     });
     return ast;
 };
-const tocToMdx = (toc, components) => {
+const tocHastToMdx = (toc, components) => {
     const tree = { type: 'root', children: toc };
     visit(tree, 'mdxJsxFlowElement', (node, index, parent) => {
-        const subToc = components[node.name].toc || [];
+        const subToc = components[node.name] || [];
         parent.children.splice(index, 1, ...subToc);
     });
     const tocHast = tocToHast(tree.children);
@@ -83709,7 +83715,7 @@ const tocToMdx = (toc, components) => {
 
 
 const { codeTabsTransformer: compile_codeTabsTransformer, ...transforms } = defaultTransforms;
-const compile_compile = async (text, { components = {}, copyButtons, useTailwind, ...opts } = {}) => {
+const compile_compile = async (text, { components = {}, copyButtons, useTailwind, useTailwindRoot, ...opts } = {}) => {
     const remarkPlugins = [
         remarkFrontmatter,
         remarkGfm,
@@ -83717,7 +83723,7 @@ const compile_compile = async (text, { components = {}, copyButtons, useTailwind
         [compile_codeTabsTransformer, { copyButtons }],
     ];
     if (useTailwind) {
-        remarkPlugins.push([transform_tailwind, { components }]);
+        remarkPlugins.push([transform_tailwind, { components, parseRoot: useTailwindRoot }]);
     }
     try {
         const vfile = await compile(text, {
@@ -88856,10 +88862,12 @@ const makeUseMDXComponents = (more = {}) => {
 const run_run = async (string, _opts = {}) => {
     const { Fragment } = jsx_runtime_namespaceObject;
     const { components = {}, terms, variables, baseUrl, imports = {}, ...opts } = _opts;
+    const tocsByTag = {};
     const exportedComponents = Object.entries(components).reduce((memo, [tag, mod]) => {
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
         const { default: Content, toc, Toc, stylesheets, ...rest } = mod;
         memo[tag] = Content;
+        tocsByTag[tag] = toc;
         if (rest) {
             Object.entries(rest).forEach(([subTag, component]) => {
                 memo[subTag] = component;
@@ -88880,7 +88888,7 @@ const run_run = async (string, _opts = {}) => {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const { Toc: _Toc, toc, default: Content, stylesheet, ...exports } = await exec(string);
     let Toc;
-    const tocMdx = tocToMdx(toc, components);
+    const tocMdx = tocHastToMdx(toc, tocsByTag);
     if (tocMdx) {
         const compiledToc = await lib_compile(tocMdx);
         const tocModule = await exec(compiledToc, { useMDXComponents: () => ({ p: Fragment }) });

package/dist/main.node.js

@@ -21609,11 +21609,15 @@ function TableOfContents({ children }) {
 }
 /* harmony default export */ const components_TableOfContents = (TableOfContents);
 
+;// ./utils/consts.ts
+const tailwindPrefix = 'readme-tailwind';
+
 ;// ./components/TailwindRoot/index.tsx
 
+
 const TailwindRoot = ({ children, flow }) => {
     const Tag = flow ? 'div' : 'span';
-    return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement(Tag, { className: "readme-tailwind" }, children);
+    return external_amd_react_commonjs_react_commonjs2_react_root_React_umd_react_default().createElement(Tag, { className: tailwindPrefix }, children);
 };
 /* harmony default export */ const components_TailwindRoot = (TailwindRoot);
 
@@ -76205,10 +76209,12 @@ async function tailwindBundle(string, { prefix }) {
 
 
 
-const exportTailwindStylesheet = async (tree, components) => {
+
+const exportTailwindStylesheet = async (tree, vfile, { components, parseRoot }) => {
     if (hasNamedExport(tree, 'stylesheet'))
         return;
-    const stylesheet = (await tailwind_bundle(Object.values(components).join('\n\n'), { prefix: '.readme-tailwind' })).css;
+    const stringToParse = [...Object.values(components), parseRoot ? String(vfile) : ''].join('\n\n');
+    const stylesheet = (await tailwind_bundle(stringToParse, { prefix: `.${tailwindPrefix}` })).css;
     const exportNode = {
         type: 'mdxjsEsm',
         value: '',
@@ -76259,13 +76265,13 @@ const injectTailwindRoot = ({ components = {} }) => (node, index, parent) => {
     // eslint-disable-next-line consistent-return
     return SKIP;
 };
-const tailwind = ({ components }) => async (tree, vfile) => {
+const tailwind = ({ components, parseRoot }) => async (tree, vfile) => {
     const localComponents = getExports(tree).reduce((acc, name) => {
         acc[name] = String(vfile);
         return acc;
     }, {});
     visit(tree, isMDXElement, injectTailwindRoot({ components: { ...components, ...localComponents } }));
-    await exportTailwindStylesheet(tree, { ...components, ...localComponents });
+    await exportTailwindStylesheet(tree, vfile, { components: { ...components, ...localComponents }, parseRoot });
     return tree;
 };
 /* harmony default export */ const transform_tailwind = (tailwind);
@@ -88269,10 +88275,10 @@ const tocToHast = (headings = []) => {
     });
     return ast;
 };
-const tocToMdx = (toc, components) => {
+const tocHastToMdx = (toc, components) => {
     const tree = { type: 'root', children: toc };
     visit(tree, 'mdxJsxFlowElement', (node, index, parent) => {
-        const subToc = components[node.name].toc || [];
+        const subToc = components[node.name] || [];
         parent.children.splice(index, 1, ...subToc);
     });
     const tocHast = tocToHast(tree.children);
@@ -88291,7 +88297,7 @@ const tocToMdx = (toc, components) => {
 
 
 const { codeTabsTransformer: compile_codeTabsTransformer, ...transforms } = defaultTransforms;
-const compile_compile = async (text, { components = {}, copyButtons, useTailwind, ...opts } = {}) => {
+const compile_compile = async (text, { components = {}, copyButtons, useTailwind, useTailwindRoot, ...opts } = {}) => {
     const remarkPlugins = [
         remarkFrontmatter,
         remarkGfm,
@@ -88299,7 +88305,7 @@ const compile_compile = async (text, { components = {}, copyButtons, useTailwind
         [compile_codeTabsTransformer, { copyButtons }],
     ];
     if (useTailwind) {
-        remarkPlugins.push([transform_tailwind, { components }]);
+        remarkPlugins.push([transform_tailwind, { components, parseRoot: useTailwindRoot }]);
     }
     try {
         const vfile = await compile(text, {
@@ -93438,10 +93444,12 @@ const makeUseMDXComponents = (more = {}) => {
 const run_run = async (string, _opts = {}) => {
     const { Fragment } = jsx_runtime_namespaceObject;
     const { components = {}, terms, variables, baseUrl, imports = {}, ...opts } = _opts;
+    const tocsByTag = {};
     const exportedComponents = Object.entries(components).reduce((memo, [tag, mod]) => {
         // eslint-disable-next-line @typescript-eslint/no-unused-vars
         const { default: Content, toc, Toc, stylesheets, ...rest } = mod;
         memo[tag] = Content;
+        tocsByTag[tag] = toc;
         if (rest) {
             Object.entries(rest).forEach(([subTag, component]) => {
                 memo[subTag] = component;
@@ -93462,7 +93470,7 @@ const run_run = async (string, _opts = {}) => {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const { Toc: _Toc, toc, default: Content, stylesheet, ...exports } = await exec(string);
     let Toc;
-    const tocMdx = tocToMdx(toc, components);
+    const tocMdx = tocHastToMdx(toc, tocsByTag);
     if (tocMdx) {
         const compiledToc = await lib_compile(tocMdx);
         const tocModule = await exec(compiledToc, { useMDXComponents: () => ({ p: Fragment }) });