@readme/markdown 14.4.0 → 14.5.0

package/dist/processor/transform/mdxish/tables/repair-expression-escapes.d.ts

@@ -0,0 +1,14 @@
+import { type RepairResult } from './utils';
+/**
+ * mdxjs hands the contents of every `{…}` to acorn as a JavaScript expression.
+ * A bare backslash is only legal inside a string/template literal in JS, so a
+ * markdown-style escape such as `{customer\_id}` — common when authors escape an
+ * underscore out of habit — makes acorn throw "Could not parse expression with
+ * acorn", which drops parsing for the whole surrounding `<Table>`.
+ *
+ * This pass deletes backslashes that sit in JS *code* position inside a `{…}`
+ * expression. Backslashes within a '…', "…" or `…` literal are valid escapes
+ * and are left untouched. Scoped to the malformed-retry path; the happy path
+ * never runs it.
+ */
+export declare const repairExpressionEscapes: (html: string) => RepairResult;

package/dist/processor/transform/mdxish/tables/tag-walker.d.ts

@@ -7,12 +7,22 @@ interface TagEvent {
     name: string;
     start: number;
 }
+/**
+ * `isSelfClosing` — source ends with `/>`.
+ * `isStrayCloser` — source starts with `</`. htmlparser2 follows the HTML5
+ *   spec and rewrites stray void closers (`</br>`, `</p>`) into `onopentag`
+ *   events; this flag lets consumers tell that apart from a real opener.
+ */
+interface OpenEvent extends TagEvent {
+    isSelfClosing: boolean;
+    isStrayCloser: boolean;
+}
 interface CloseEvent extends TagEvent {
     implicit: boolean;
 }
 interface TagWalkHandlers {
     onClose?: (event: CloseEvent) => void;
-    onOpen?: (event: TagEvent) => void;
+    onOpen?: (event: OpenEvent) => void;
 }
 /**
  * Drive htmlparser2 over `html` (after masking non-tag regions) and emit

package/package.json

@@ -2,7 +2,7 @@
   "name": "@readme/markdown",
   "description": "ReadMe's React-based Markdown parser",
   "author": "Rafe Goldberg <rafe@readme.io>",
-  "version": "14.4.0",
+  "version": "14.5.0",
   "main": "dist/main.node.js",
   "types": "dist/index.d.ts",
   "browser": "dist/main.js",

package/styles/gfm.scss

@@ -86,10 +86,24 @@
     border-width: 0 0 1px;
     box-sizing: content-box;
     height: 0;
-    margin: 15px 0;
+    margin: var(--markdown-spacing, 15px) 0;
     overflow: hidden;
   }
 
+  // Direct-child only, top-level headings/hr act as section breaks that
+  // clear preceding floats (e.g. `<Image align="left|right">`). Nested
+  // headings (inside Callout, Cards, etc.) keep wrapping behavior so the
+  // component's own layout (e.g. callout icon float) isn't disrupted.
+  > h1,
+  > h2,
+  > h3,
+  > h4,
+  > h5,
+  > h6,
+  > hr {
+    clear: both;
+  }
+
   input {
     font: inherit;
     margin: 0;
@@ -133,8 +147,19 @@
     font-size: var(--markdown-title-size);
     font-weight: var(--markdown-title-weight, 600);
     line-height: 1.25;
-    margin-bottom: var(--markdown-title-marginBottom, 1rem);
+    margin-bottom: var(--markdown-title-marginBottom, var(--markdown-spacing, 15px));
     margin-top: var(--markdown-title-marginTop, 1em);
+
+    &:has(+ h1, + h2, + h3, + h4, + h5, + h6, + p) {
+      margin-bottom: calc(var(--markdown-spacing, 15px) / 2);
+    }
+  }
+
+  // Tighten the gap when a heading immediately follows another heading
+  // (e.g. h1 + h2 as title/subtitle). Lets the preceding heading's margin-bottom
+  // define the gap instead of the following heading's larger margin-top.
+  :is(h1, h2, h3, h4, h5, h6) + :is(h1, h2, h3, h4, h5, h6) {
+    margin-top: 0;
   }
 
   h1 {
@@ -245,13 +270,23 @@
 
   blockquote,
   dl,
-  ol,
   p,
   pre,
-  table,
+  table {
+    margin-bottom: var(--markdown-spacing, 15px);
+    margin-top: 0;
+  }
+
+  ol,
   ul {
-    margin-bottom: 15px;
+    margin-bottom: round(1.3333em, 1px); // 20px at 15px base (condensed)
     margin-top: 0;
+
+    ol,
+    ul {
+      margin-bottom: 0;
+      margin-top: round(0.5333em, 1px); // 8px at 15px base (condensed)
+    }
   }
 
   blockquote {
@@ -278,14 +313,6 @@
     padding-left: 2em;
   }
 
-  ol ol,
-  ol ul,
-  ul ol,
-  ul ul {
-    margin-bottom: 0;
-    margin-top: 0;
-  }
-
   li {
     clear: both;
     word-wrap: break-all;
@@ -296,7 +323,7 @@
   }
 
   li + li {
-    margin-top: 0.25em;
+    margin-top: round(0.5333em, 1px); // 8px at 15px base (condensed)
   }
 
   dl {
@@ -316,6 +343,10 @@
     padding: 0 1em;
   }
 
+  .img {
+    margin: round(calc(var(--markdown-img-margin, var(--markdown-spacing, 15px)) * 1.33), 1px) 0;
+  }
+
   :checked + .radio-label {
     border-color: var(--project-color-primary);
     position: relative;
@@ -341,19 +372,14 @@
 }
 
 @mixin markdown-overrides {
-  h5,
-  h6 {
-    font-size: 0.9em;
-  }
-
   blockquote h1:last-child,
   blockquote h2:last-child {
     border-bottom: 0;
   }
 
   > * {
-    margin-bottom: 15px !important;
-    margin-top: 15px;
+    margin-bottom: var(--markdown-spacing, 15px);
+    margin-top: var(--markdown-spacing, 15px);
   }
 
   .task-list-item input {