@readme/markdown 15.5.2 → 15.7.0

package/dist/main.js

@@ -11423,7 +11423,7 @@ module.exports = function () {
 
 /***/ },
 
-/***/ 1595
+/***/ 7070
 (module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -81088,6 +81088,8 @@ const processTableNode = (node, index, parent, documentPosition) => {
         type: 'table',
         position,
         children,
+        // Remember the author's spelling so the serializer can write `<table>` back instead of `<Table>`
+        ...(node.name === 'table' && { data: { lowercaseTable: true } }),
     };
     parent.children[index] = mdNode;
 };
@@ -96690,7 +96692,7 @@ const rehypeToc = ({ components = {} }) => {
         });
     };
 };
-const MAX_DEPTH = 2;
+const MAX_DEPTH = 3;
 /**
  * Get the depth of a heading element based on its tag name.
  *
@@ -105688,6 +105690,106 @@ const generateSlugForHeadings = () => (tree) => {
 };
 /* harmony default export */ const heading_slugs = (generateSlugForHeadings);
 
+;// ./processor/transform/mdxish/images-to-jsx.ts
+
+
+
+
+
+const IMAGE_ATTRS = ['align', 'alt', 'border', 'caption', 'className', 'height', 'lazy', 'src', 'title', 'width'];
+/** The three attributes markdown's `![alt](src "title")` can carry. Anything else forces JSX. */
+const PLAIN_IMAGE_ATTRS = ['alt', 'src', 'title'];
+const EMOJI_COLONS = /^:(.*):$/;
+const hasExtra = (attributes) => attributes.some(attr => !PLAIN_IMAGE_ATTRS.includes(attr.name));
+const toImageJsx = (attributes, children = []) => ({
+    type: 'mdxJsxFlowElement',
+    name: 'Image',
+    attributes,
+    children,
+});
+/**
+ * An `image` is phrasing content, but the nodes it replaces here (`image-block`, and a plain
+ * `[block:image]`) sit where flow content belongs. `mdast-util-to-markdown` picks a block separator
+ * from the two node types around it and has no rule for phrasing-next-to-flow, so it emits none and
+ * glues the image to whatever follows (`![a](src)# Heading`), which then cascades through the rest
+ * of the document. Wrapping restores a block for it to join against.
+ */
+const placeImage = (parent, index, image) => {
+    const wrapped = { type: 'paragraph', children: [image] };
+    parent.children[index] = INLINE_ONLY_PARENT_TYPES.has(parent.type) ? image : wrapped;
+};
+/**
+ * Serializes the three image shapes a parsed document carries. An image that picked up readme
+ * attributes has no markdown spelling left and goes out as `<Image>`, a plain one stays
+ * `![alt](src)`.
+ *
+ * Order matters: `figure` unwraps into the `image` its caption belongs to, so it runs first.
+ */
+const imagesToJsx = () => tree => {
+    visit(tree, NodeTypes.figure, (node, index, parent) => {
+        if (!parent || index === undefined)
+            return;
+        const [image, caption] = node.children;
+        const { align, className, width } = image.data.hProperties;
+        parent.children[index] = toImageJsx(toAttributes({ ...image, align, width, ...(className === 'border' && { border: true }), src: image.src || image.url }, IMAGE_ATTRS), 
+        // The caption stays a child rather than a pre-serialized `caption` attribute, so readme nodes
+        // inside it (emoji, variables, glossary) reach their own handlers instead of the bare
+        // `toMarkdown` in `compatibility.figureToImageBlock`, which throws on them.
+        caption.children);
+    });
+    visit(tree, 'image', (n, index, parent) => {
+        const node = n;
+        if (!parent || index === undefined)
+            return undefined;
+        const hProperties = node.data?.hProperties;
+        // A `:joy:`-style shortcode round-trips as a gemoji rather than the image it parsed into.
+        if (hProperties?.className === 'emoji' && node.title) {
+            const emoji = {
+                type: NodeTypes.emoji,
+                name: node.title.replace(EMOJI_COLONS, '$1'),
+                value: node.title,
+            };
+            parent.children[index] = emoji;
+            return undefined;
+        }
+        if (hProperties) {
+            const attributes = toAttributes({ ...node, ...hProperties, src: node.url }, IMAGE_ATTRS);
+            if (hasExtra(attributes)) {
+                parent.children[index] = toImageJsx(attributes);
+                return undefined;
+            }
+        }
+        // An attribute-less `[block:image]` parses straight to an `image` in a flow slot, so it needs
+        // the same wrap. Editor images always arrive inside a paragraph and are left alone.
+        if (INLINE_ONLY_PARENT_TYPES.has(parent.type))
+            return undefined;
+        placeImage(parent, index, node);
+        // Step over the paragraph just created, or the visitor walks back into the same image.
+        return [(/* inlined export .SKIP */"skip"), index + 1];
+    });
+    visit(tree, NodeTypes.imageBlock, (node, index, parent) => {
+        if (!parent || index === undefined)
+            return;
+        // An image-block keeps its caption as children, so it has to be re-serialized back into the
+        // `caption` attribute before the node is replaced.
+        const captionChildren = node.children ?? [];
+        const caption = captionChildren.length ? toMarkdown({ type: 'root', children: captionChildren }).trim() : '';
+        const attributes = toAttributes({ ...node, ...node.data.hProperties, ...(caption && { caption }) }, IMAGE_ATTRS);
+        if (hasExtra(attributes)) {
+            parent.children[index] = toImageJsx(attributes);
+            return;
+        }
+        placeImage(parent, index, {
+            type: 'image',
+            url: node.src,
+            ...(node.title && { title: node.title }),
+            ...(node.alt && { alt: node.alt }),
+        });
+    });
+    return tree;
+};
+/* harmony default export */ const images_to_jsx = (imagesToJsx);
+
 // EXTERNAL MODULE: external "@readme/variable"
 var variable_ = __webpack_require__(8167);
 var variable_default = /*#__PURE__*/__webpack_require__.n(variable_);
@@ -107566,13 +107668,22 @@ const mdxishTablesToJsx = () => tree => {
             gfmCells.push([cell, normalized]);
             return undefined;
         });
-        if (!requiresJsxTable) {
+        const stayLowercase = table.data?.lowercaseTable === true;
+        // We transform to GFM tables if:
+        // 1. If it doesn't contain complex elements that the syntax can't represent
+        // 2. The original table is not lowercase HTML <table>, because we want to 
+        // preserve original tables as much as possible
+        if (!requiresJsxTable && !stayLowercase) {
             gfmCells.forEach(([cell, children]) => {
                 cell.children = children;
             });
             table.type = 'table';
             return;
         }
+        // Nothing to build a JSX table from; leave the empty node to the GFM stringifier.
+        const [headerRow, ...bodyRows] = table.children;
+        if (!headerRow)
+            return;
         visit(table, mdxish_tables_to_jsx_isTableCell, flattenBreaksToNewlines);
         const styles = table.align.map(mdxish_tables_to_jsx_alignToStyle);
         const head = {
@@ -107584,7 +107695,7 @@ const mdxishTablesToJsx = () => tree => {
                     attributes: [],
                     type: 'mdxJsxFlowElement',
                     name: 'tr',
-                    children: table.children[0].children.map((cell, cellIndex) => {
+                    children: headerRow.children.map((cell, cellIndex) => {
                         return {
                             attributes: [],
                             type: 'mdxJsxFlowElement',
@@ -107600,7 +107711,7 @@ const mdxishTablesToJsx = () => tree => {
             attributes: [],
             type: 'mdxJsxFlowElement',
             name: 'tbody',
-            children: table.children.splice(1).map(row => {
+            children: bodyRows.map(row => {
                 return {
                     attributes: [],
                     type: 'mdxJsxFlowElement',
@@ -107628,8 +107739,8 @@ const mdxishTablesToJsx = () => tree => {
         ];
         const jsx = {
             type: 'mdxJsxFlowElement',
-            name: 'Table',
-            attributes: table.align.find(a => a) ? attributes : [],
+            name: stayLowercase ? 'table' : 'Table',
+            attributes: !stayLowercase && table.align.find(a => a) ? attributes : [],
             children: [head, body],
         };
         parent.children[index] = jsx;
@@ -107724,6 +107835,24 @@ function normalizeTableSeparator(content) {
 }
 /* harmony default export */ const normalize_table_separator = ((/* unused pure expression or super */ null && (normalizeTableSeparator)));
 
+;// ./processor/transform/mdxish/unwrap-pins.ts
+
+/**
+ * A `sidebar: true` magic block (e.g. `[block:code]`) parses into an `rdme-pin` wrapper via
+ * `wrapPinnedBlocks`, and remark-stringify throws on any node type without a handler. The mdxish
+ * dialect has no spelling for a pin, so the wrapper serializes as its content instead — the same
+ * (lossy) unwrap `readmeToMdx` has always done, trading the `sidebar` flag for not crashing.
+ */
+const unwrapPins = () => tree => {
+    visit(tree, 'rdme-pin', (node, index, parent) => {
+        if (!parent || index === undefined)
+            return;
+        parent.children.splice(index, 1, ...node.children);
+    });
+    return tree;
+};
+/* harmony default export */ const unwrap_pins = (unwrapPins);
+
 ;// ./processor/transform/mdxish/variables-code.ts
 
 
@@ -107870,6 +107999,10 @@ function loadComponents() {
 
 
 
+
+
+
+
 
 
 
@@ -107953,35 +108086,43 @@ function mdxishAstProcessor(mdContent, opts = {}) {
     };
 }
 /**
- * Registers the mdx-jsx serialization extension so remark-stringify
- * can convert JSX nodes (e.g. `<Table>`) to markdown.
+ * Registers serialization for the node types remark-stringify can't write on its own:
+ * JSX elements (e.g. `<Table>`), MDX expressions, and ESM exports.
  */
-function mdxJsxStringify() {
+function mdxStringifyExtensions() {
     const data = this.data();
     const extensions = data.toMarkdownExtensions || (data.toMarkdownExtensions = []);
-    extensions.push({ extensions: [mdxJsxToMarkdown()] });
+    extensions.push({ extensions: [mdxJsxToMarkdown(), mdxExpressionToMarkdown(), mdxjsEsmToMarkdown()] });
 }
+const stringifyOptions = {
+    bullet: (/* inlined export .DEFAULT_BULLET */"-"),
+    emphasis: '_',
+    // Escape literal braces in text so they don't parse as (often
+    // unterminated) MDX expressions on the next round trip.
+    unsafe: [
+        { character: '{', inConstruct: 'phrasing' },
+        { character: '}', inConstruct: 'phrasing' },
+    ],
+};
 /**
  * Serializes an Mdast back into a markdown string.
  */
 function mdxishMdastToMd(mdast) {
     const processor = unified()
         .use(remarkGfm)
+        // Readme nodes with no markdown spelling go out as JSX, the same tags mdxish re-parses.
         .use(callout_to_jsx)
         .use(mdxish_tables_to_jsx)
         .use(anchor_to_jsx)
+        // The rest only a PARSER tree carries.
+        // A `sidebar: true` block parses into an `rdme-pin` wrapper the dialect can't spell.
+        .use(unwrap_pins)
+        // Figures, image blocks, and images that picked up readme attributes while parsing.
+        .use(images_to_jsx)
+        // Handlers for the readme nodes that stay themselves (variables, emoji, html-blocks, lists).
         .use(mdxishCompilers)
-        .use(mdxJsxStringify)
-        .use(remarkStringify, {
-        bullet: (/* inlined export .DEFAULT_BULLET */"-"),
-        emphasis: '_',
-        // Escape literal braces in text so they don't parse as (often
-        // unterminated) MDX expressions on the next round trip.
-        unsafe: [
-            { character: '{', inConstruct: 'phrasing' },
-            { character: '}', inConstruct: 'phrasing' },
-        ],
-    });
+        .use(mdxStringifyExtensions)
+        .use(remarkStringify, stringifyOptions);
     return processor.stringify(processor.runSync(mdast));
 }
 /**
@@ -108991,7 +109132,7 @@ module.exports = /*#__PURE__*/JSON.parse('{"*":["about","acceptCharset","accessK
 /******/ 	// startup
 /******/ 	// Load entry module and return exports
 /******/ 	// This entry module used 'module' so it can't be inlined
-/******/ 	let __webpack_exports__ = __webpack_require__(1595);
+/******/ 	let __webpack_exports__ = __webpack_require__(7070);
 /******/ 	
 /******/ 	return __webpack_exports__;
 /******/ })()

package/dist/main.node.js

@@ -19045,7 +19045,7 @@ module.exports = function () {
 
 /***/ },
 
-/***/ 6261
+/***/ 6817
 (module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -101271,6 +101271,8 @@ const processTableNode = (node, index, parent, documentPosition) => {
         type: 'table',
         position,
         children,
+        // Remember the author's spelling so the serializer can write `<table>` back instead of `<Table>`
+        ...(node.name === 'table' && { data: { lowercaseTable: true } }),
     };
     parent.children[index] = mdNode;
 };
@@ -116873,7 +116875,7 @@ const rehypeToc = ({ components = {} }) => {
         });
     };
 };
-const MAX_DEPTH = 2;
+const MAX_DEPTH = 3;
 /**
  * Get the depth of a heading element based on its tag name.
  *
@@ -125871,6 +125873,106 @@ const generateSlugForHeadings = () => (tree) => {
 };
 /* harmony default export */ const heading_slugs = (generateSlugForHeadings);
 
+;// ./processor/transform/mdxish/images-to-jsx.ts
+
+
+
+
+
+const IMAGE_ATTRS = ['align', 'alt', 'border', 'caption', 'className', 'height', 'lazy', 'src', 'title', 'width'];
+/** The three attributes markdown's `![alt](src "title")` can carry. Anything else forces JSX. */
+const PLAIN_IMAGE_ATTRS = ['alt', 'src', 'title'];
+const EMOJI_COLONS = /^:(.*):$/;
+const hasExtra = (attributes) => attributes.some(attr => !PLAIN_IMAGE_ATTRS.includes(attr.name));
+const toImageJsx = (attributes, children = []) => ({
+    type: 'mdxJsxFlowElement',
+    name: 'Image',
+    attributes,
+    children,
+});
+/**
+ * An `image` is phrasing content, but the nodes it replaces here (`image-block`, and a plain
+ * `[block:image]`) sit where flow content belongs. `mdast-util-to-markdown` picks a block separator
+ * from the two node types around it and has no rule for phrasing-next-to-flow, so it emits none and
+ * glues the image to whatever follows (`![a](src)# Heading`), which then cascades through the rest
+ * of the document. Wrapping restores a block for it to join against.
+ */
+const placeImage = (parent, index, image) => {
+    const wrapped = { type: 'paragraph', children: [image] };
+    parent.children[index] = INLINE_ONLY_PARENT_TYPES.has(parent.type) ? image : wrapped;
+};
+/**
+ * Serializes the three image shapes a parsed document carries. An image that picked up readme
+ * attributes has no markdown spelling left and goes out as `<Image>`, a plain one stays
+ * `![alt](src)`.
+ *
+ * Order matters: `figure` unwraps into the `image` its caption belongs to, so it runs first.
+ */
+const imagesToJsx = () => tree => {
+    visit(tree, NodeTypes.figure, (node, index, parent) => {
+        if (!parent || index === undefined)
+            return;
+        const [image, caption] = node.children;
+        const { align, className, width } = image.data.hProperties;
+        parent.children[index] = toImageJsx(toAttributes({ ...image, align, width, ...(className === 'border' && { border: true }), src: image.src || image.url }, IMAGE_ATTRS), 
+        // The caption stays a child rather than a pre-serialized `caption` attribute, so readme nodes
+        // inside it (emoji, variables, glossary) reach their own handlers instead of the bare
+        // `toMarkdown` in `compatibility.figureToImageBlock`, which throws on them.
+        caption.children);
+    });
+    visit(tree, 'image', (n, index, parent) => {
+        const node = n;
+        if (!parent || index === undefined)
+            return undefined;
+        const hProperties = node.data?.hProperties;
+        // A `:joy:`-style shortcode round-trips as a gemoji rather than the image it parsed into.
+        if (hProperties?.className === 'emoji' && node.title) {
+            const emoji = {
+                type: NodeTypes.emoji,
+                name: node.title.replace(EMOJI_COLONS, '$1'),
+                value: node.title,
+            };
+            parent.children[index] = emoji;
+            return undefined;
+        }
+        if (hProperties) {
+            const attributes = toAttributes({ ...node, ...hProperties, src: node.url }, IMAGE_ATTRS);
+            if (hasExtra(attributes)) {
+                parent.children[index] = toImageJsx(attributes);
+                return undefined;
+            }
+        }
+        // An attribute-less `[block:image]` parses straight to an `image` in a flow slot, so it needs
+        // the same wrap. Editor images always arrive inside a paragraph and are left alone.
+        if (INLINE_ONLY_PARENT_TYPES.has(parent.type))
+            return undefined;
+        placeImage(parent, index, node);
+        // Step over the paragraph just created, or the visitor walks back into the same image.
+        return [(/* inlined export .SKIP */"skip"), index + 1];
+    });
+    visit(tree, NodeTypes.imageBlock, (node, index, parent) => {
+        if (!parent || index === undefined)
+            return;
+        // An image-block keeps its caption as children, so it has to be re-serialized back into the
+        // `caption` attribute before the node is replaced.
+        const captionChildren = node.children ?? [];
+        const caption = captionChildren.length ? toMarkdown({ type: 'root', children: captionChildren }).trim() : '';
+        const attributes = toAttributes({ ...node, ...node.data.hProperties, ...(caption && { caption }) }, IMAGE_ATTRS);
+        if (hasExtra(attributes)) {
+            parent.children[index] = toImageJsx(attributes);
+            return;
+        }
+        placeImage(parent, index, {
+            type: 'image',
+            url: node.src,
+            ...(node.title && { title: node.title }),
+            ...(node.alt && { alt: node.alt }),
+        });
+    });
+    return tree;
+};
+/* harmony default export */ const images_to_jsx = (imagesToJsx);
+
 // EXTERNAL MODULE: ./node_modules/@readme/variable/dist/index.js
 var variable_dist = __webpack_require__(4355);
 var variable_dist_default = /*#__PURE__*/__webpack_require__.n(variable_dist);
@@ -127749,13 +127851,22 @@ const mdxishTablesToJsx = () => tree => {
             gfmCells.push([cell, normalized]);
             return undefined;
         });
-        if (!requiresJsxTable) {
+        const stayLowercase = table.data?.lowercaseTable === true;
+        // We transform to GFM tables if:
+        // 1. If it doesn't contain complex elements that the syntax can't represent
+        // 2. The original table is not lowercase HTML <table>, because we want to 
+        // preserve original tables as much as possible
+        if (!requiresJsxTable && !stayLowercase) {
             gfmCells.forEach(([cell, children]) => {
                 cell.children = children;
             });
             table.type = 'table';
             return;
         }
+        // Nothing to build a JSX table from; leave the empty node to the GFM stringifier.
+        const [headerRow, ...bodyRows] = table.children;
+        if (!headerRow)
+            return;
         visit(table, mdxish_tables_to_jsx_isTableCell, flattenBreaksToNewlines);
         const styles = table.align.map(mdxish_tables_to_jsx_alignToStyle);
         const head = {
@@ -127767,7 +127878,7 @@ const mdxishTablesToJsx = () => tree => {
                     attributes: [],
                     type: 'mdxJsxFlowElement',
                     name: 'tr',
-                    children: table.children[0].children.map((cell, cellIndex) => {
+                    children: headerRow.children.map((cell, cellIndex) => {
                         return {
                             attributes: [],
                             type: 'mdxJsxFlowElement',
@@ -127783,7 +127894,7 @@ const mdxishTablesToJsx = () => tree => {
             attributes: [],
             type: 'mdxJsxFlowElement',
             name: 'tbody',
-            children: table.children.splice(1).map(row => {
+            children: bodyRows.map(row => {
                 return {
                     attributes: [],
                     type: 'mdxJsxFlowElement',
@@ -127811,8 +127922,8 @@ const mdxishTablesToJsx = () => tree => {
         ];
         const jsx = {
             type: 'mdxJsxFlowElement',
-            name: 'Table',
-            attributes: table.align.find(a => a) ? attributes : [],
+            name: stayLowercase ? 'table' : 'Table',
+            attributes: !stayLowercase && table.align.find(a => a) ? attributes : [],
             children: [head, body],
         };
         parent.children[index] = jsx;
@@ -127907,6 +128018,24 @@ function normalizeTableSeparator(content) {
 }
 /* harmony default export */ const normalize_table_separator = ((/* unused pure expression or super */ null && (normalizeTableSeparator)));
 
+;// ./processor/transform/mdxish/unwrap-pins.ts
+
+/**
+ * A `sidebar: true` magic block (e.g. `[block:code]`) parses into an `rdme-pin` wrapper via
+ * `wrapPinnedBlocks`, and remark-stringify throws on any node type without a handler. The mdxish
+ * dialect has no spelling for a pin, so the wrapper serializes as its content instead — the same
+ * (lossy) unwrap `readmeToMdx` has always done, trading the `sidebar` flag for not crashing.
+ */
+const unwrapPins = () => tree => {
+    visit(tree, 'rdme-pin', (node, index, parent) => {
+        if (!parent || index === undefined)
+            return;
+        parent.children.splice(index, 1, ...node.children);
+    });
+    return tree;
+};
+/* harmony default export */ const unwrap_pins = (unwrapPins);
+
 ;// ./processor/transform/mdxish/variables-code.ts
 
 
@@ -128053,6 +128182,10 @@ function loadComponents() {
 
 
 
+
+
+
+
 
 
 
@@ -128136,35 +128269,43 @@ function mdxishAstProcessor(mdContent, opts = {}) {
     };
 }
 /**
- * Registers the mdx-jsx serialization extension so remark-stringify
- * can convert JSX nodes (e.g. `<Table>`) to markdown.
+ * Registers serialization for the node types remark-stringify can't write on its own:
+ * JSX elements (e.g. `<Table>`), MDX expressions, and ESM exports.
  */
-function mdxJsxStringify() {
+function mdxStringifyExtensions() {
     const data = this.data();
     const extensions = data.toMarkdownExtensions || (data.toMarkdownExtensions = []);
-    extensions.push({ extensions: [mdxJsxToMarkdown()] });
+    extensions.push({ extensions: [mdxJsxToMarkdown(), mdxExpressionToMarkdown(), mdxjsEsmToMarkdown()] });
 }
+const stringifyOptions = {
+    bullet: (/* inlined export .DEFAULT_BULLET */"-"),
+    emphasis: '_',
+    // Escape literal braces in text so they don't parse as (often
+    // unterminated) MDX expressions on the next round trip.
+    unsafe: [
+        { character: '{', inConstruct: 'phrasing' },
+        { character: '}', inConstruct: 'phrasing' },
+    ],
+};
 /**
  * Serializes an Mdast back into a markdown string.
  */
 function mdxishMdastToMd(mdast) {
     const processor = unified()
         .use(remarkGfm)
+        // Readme nodes with no markdown spelling go out as JSX, the same tags mdxish re-parses.
         .use(callout_to_jsx)
         .use(mdxish_tables_to_jsx)
         .use(anchor_to_jsx)
+        // The rest only a PARSER tree carries.
+        // A `sidebar: true` block parses into an `rdme-pin` wrapper the dialect can't spell.
+        .use(unwrap_pins)
+        // Figures, image blocks, and images that picked up readme attributes while parsing.
+        .use(images_to_jsx)
+        // Handlers for the readme nodes that stay themselves (variables, emoji, html-blocks, lists).
         .use(mdxishCompilers)
-        .use(mdxJsxStringify)
-        .use(remarkStringify, {
-        bullet: (/* inlined export .DEFAULT_BULLET */"-"),
-        emphasis: '_',
-        // Escape literal braces in text so they don't parse as (often
-        // unterminated) MDX expressions on the next round trip.
-        unsafe: [
-            { character: '{', inConstruct: 'phrasing' },
-            { character: '}', inConstruct: 'phrasing' },
-        ],
-    });
+        .use(mdxStringifyExtensions)
+        .use(remarkStringify, stringifyOptions);
     return processor.stringify(processor.runSync(mdast));
 }
 /**
@@ -129233,7 +129374,7 @@ module.exports = /*#__PURE__*/JSON.parse('{"*":["about","acceptCharset","accessK
 /******/ 	// startup
 /******/ 	// Load entry module and return exports
 /******/ 	// This entry module used 'module' so it can't be inlined
-/******/ 	let __webpack_exports__ = __webpack_require__(6261);
+/******/ 	let __webpack_exports__ = __webpack_require__(6817);
 /******/ 	module.exports = __webpack_exports__;
 /******/ 	
 /******/ })()