cortena-ui 1.10.0 → 1.11.0

package/CHANGELOG.md

@@ -3,6 +3,49 @@
 Notable changes per release. Versions before 1.6.0 are recorded in the git log
 and in `../../CONSUMING.md`; this file starts where the changelog does.
 
+## 1.11.0
+
+### Added
+
+- **`RichTextEditor`** (DESIGN-54). Rich text editing, which nothing in the
+  fleet had. KeyStone needs it for vision documents, PRDs and requirement
+  documents; Tasks needs it to be able to replace a `<textarea>` it chose on
+  purpose. TipTap on ProseMirror, React bindings, value is Markdown (GFM) in
+  and out. Exported from the barrel and from its own subpath entry,
+  `cortena-ui/rich-text-editor` — TipTap and ProseMirror are 619 kB and MCP app
+  HTML is capped at 512 kB, so `test/bundle-probe.test.mjs` now asserts that no
+  other entry carries a byte of the editor engine (`button` from the barrel is
+  still 37.7 kB and pulls none of it).
+  - **The round trip is the feature.** An untouched document serialises
+    byte-identically — same line endings, same trailing whitespace — and
+    editing one paragraph changes one paragraph. Tasks uses a plain textarea
+    because a rich editor "would reformat text nobody touched and land it as a
+    spurious revision"; that constraint is a requirement of this component.
+    `markdown-bridge.ts` is mdast-based and source-preserving rather than
+    `tiptap-markdown`, which serialises through Turndown and renormalises
+    everything it touches. Asserted over an 18-file corpus in
+    `test/fixtures/rich-text/`.
+  - **Supported subset**: paragraphs, h2–h4, bold, italic, strikethrough,
+    inline code, links, ordered/bullet/task lists, blockquote, fenced code, GFM
+    tables, horizontal rule, images by URL. Anything outside it — front matter,
+    HTML blocks, footnotes, display maths, h1, h5, h6 — is preserved as a raw
+    Markdown block, never dropped.
+  - **Slots, not features**: `mentionProvider`, `selectionActions`,
+    `renderChip`. A mention is stored as `[@Priya](mention:user-42)`, so it is
+    still Markdown. Editor JSON and HTML never leave the component.
+  - **Controlled `value` with an explicit `version`**: a new revision arriving
+    while the author is focused does not clobber them; `onExternalChange` fires
+    with an `apply` for a conflict banner.
+  - Toolbar on the existing `Toolbar` primitive, keyboard shortcuts, and the
+    Markdown input rules (`## `, `- `, `1. `, `> `, backticks).
+
+### Changed
+
+- The prose class map moved to `src/lib/prose.ts` and is now shared by
+  `Markdown` and `RichTextEditor`. No visual change — the strings are the same
+  ones — but the read view and the edit view can no longer drift apart, which
+  is what keeps a document from shifting when it enters edit mode.
+
 ## 1.10.0
 
 1.9.0 was never released: it was published by mistake and has been deprecated.

package/README.md

@@ -36,6 +36,7 @@ consumer's bundler getting tree-shaking right:
 | `cortena-ui/a2ui` | the A2UI catalogue and renderer | most of the package, by design |
 | `cortena-ui/sortable-list` | `SortableList`, `SortableHandle`, `arrayMove` | dnd-kit |
 | `cortena-ui/agent-chat` | `AgentChatPopup`, `AgentChat`, `createAguiAgentChatClient` | the A2UI catalogue, plus `@ag-ui/client` (rxjs, zod 3, uuid, protobuf) |
+| `cortena-ui/rich-text-editor` | `RichTextEditor`, `parseMarkdown`, `serializeMarkdown` | TipTap on ProseMirror, 619 kB — the heaviest entry in the package |
 
 Each component has exactly one home, so the barrel re-exports every entry
 without an ambiguous name. **Adding a component means adding it to its area
@@ -431,6 +432,119 @@ names the session (the key is still written, so one window stays on one
 session), `listSessions: false` for a host with its own session list, and
 `mintSessionKey` for a host that binds sessions some other way.
 
+## RichTextEditor
+
+WYSIWYG editing whose value is Markdown (GFM), in and out. KeyStone needs it for
+vision documents, PRDs and requirement documents; nothing else in the fleet has
+rich text at all.
+
+```tsx
+import { RichTextEditor } from "cortena-ui/rich-text-editor";
+
+<RichTextEditor
+  value={markdown}
+  version={revision}
+  aria-label="Vision document"
+  onChange={setMarkdown}
+  onExternalChange={({ apply }) => setConflict(() => apply)}
+  mentionProvider={({ trigger, query }) => search(trigger, query)}
+  selectionActions={({ text, editor }) => <AskAgent text={text} />}
+/>
+```
+
+Editor JSON and HTML never leave the component. There is no `getHTML` escape
+hatch on purpose: the moment a consumer stores ProseMirror JSON, the document
+stops being a file that anything else can read.
+
+### The round trip is the feature
+
+Tasks deliberately uses a plain `<textarea>` for its section editor, because a
+rich editor "would reformat text nobody touched and land it as a spurious
+revision". That constraint is a requirement of this component, not a nice-to-have:
+
+- **An untouched document serialises byte-identically.** Same bytes, including
+  line endings, trailing whitespace and a byte order mark.
+- **Editing one paragraph changes one paragraph.** Every other block is written
+  back from the source it was parsed from.
+
+`test/rich-text-markdown.test.tsx` asserts both over an 18-file corpus in
+`test/fixtures/rich-text/`, covering nested lists, fences containing fences,
+tables with escaped pipes, links with titles, CRLF and trailing whitespace.
+
+### Why the bridge is written rather than adopted
+
+`tiptap-markdown` is the obvious candidate and it fails the one requirement
+above. It serialises by rendering the editor to HTML and running Turndown over
+it, so the output is whatever Turndown's rules produce: bullets become `*`,
+emphasis becomes `_`, tables are re-padded, and a document nobody edited comes
+back different from how it went in. A component that cannot replace the Tasks
+textarea has not delivered anything.
+
+A plain mdast serializer does not fix it either. Any AST round trip normalises —
+`mdast-util-to-markdown` has one way to write a bullet — and the moment the
+author's file disagrees, every untouched paragraph in it is rewritten.
+
+So `markdown-bridge.ts` is mdast-based **and** source-preserving. Parsing keeps
+the exact source slice of every top-level block; a block whose ProseMirror JSON
+is byte-for-byte what parsing produced is written back from that slice, and only
+a block the user actually changed goes through `mdast-util-to-markdown`. The
+dependencies are `mdast-util-from-markdown`, `mdast-util-to-markdown`,
+`mdast-util-gfm` and `micromark-extension-frontmatter` (all MIT), which is the
+same layer react-markdown already uses — `src/lib/prose.ts` is imported by both
+views and reaches neither react-markdown nor ProseMirror.
+
+### The supported subset, and what happens outside it
+
+Paragraphs; headings h2–h4 (h1 is reserved for the record's own title); bold,
+italic, strikethrough, inline code; links; ordered, bullet and task lists;
+blockquote; fenced code; GFM tables; horizontal rule; images by URL.
+
+Anything else — front matter, HTML blocks, footnotes, display maths, h1, h5, h6 —
+becomes a **raw block**: a code-like node holding the original Markdown as text,
+editable as raw Markdown and serialised with no escaping. It is never dropped.
+The rule applies at the block boundary, so a paragraph containing a footnote
+reference goes raw whole rather than losing the reference from an otherwise
+editable paragraph.
+
+Not in scope: maths rendering, collaborative cursors, comments UI, image upload,
+syntax highlighting in fences.
+
+### Slots, not features
+
+`@` and `#` mean nothing to this component. `mentionProvider` is asked for items
+and a chip is inserted; whether that resolves to a person, a task or a page is
+the consumer's business. A mention is stored as `[@Priya](mention:user-42)`, so
+the document is still ordinary Markdown and the editor reads the chip back on
+the next open.
+
+What survives in the **read** view is the label, not the link: `Markdown` passes
+URLs through react-markdown's `urlTransform`, which drops any protocol it does
+not know, so `[@Priya](mention:user-42)` renders as the text `@Priya` with no
+href. A host that wants mentions to be clickable in the read view passes its own
+`urlTransform` to `Markdown` and resolves `mention:` itself.
+
+`selectionActions` renders whatever the host wants over the current selection,
+and `renderChip` replaces how a mention looks in the menu.
+
+### The controlled value and `version`
+
+`value` is the document and `version` is the revision it belongs to. A new
+revision arriving while the author is focused does **not** replace what they are
+writing: `onExternalChange` fires with `{ value, version, apply }` so the
+consumer can show a conflict banner and adopt it on the author's say-so. When
+the author is not in the editor it is adopted silently. `version` defaults to
+`value`, so a consumer that simply echoes `onChange` back still behaves — an
+echo of our own output is never treated as a conflict.
+
+### Styling
+
+Prose comes from `src/lib/prose.ts`, the same class strings the `Markdown`
+renderer paints the read view with, handed to TipTap as each node's
+`HTMLAttributes.class`. That is the only reason a document does not shift when
+it enters edit mode, and `test/rich-text-editor.test.tsx` compares the computed
+font size, family, weight and line height of both components on the same source.
+Changing a prose style means changing it in `prose.ts`, for both views at once.
+
 ## Column widths
 
 `DataTable` lays the grid out `table-fixed`: every column is drawn at its

package/dist/components/badge.d.ts

@@ -3,7 +3,7 @@ import { VariantProps } from "class-variance-authority";
 import * as React from "react";
 //#region src/components/badge.d.ts
 declare const badgeVariants: (props?: ({
-  variant?: "default" | "success" | "warn" | "destructive" | "danger" | "info" | "outline" | "warning" | "neutral" | "secondary" | null | undefined;
+  variant?: "default" | "success" | "warn" | "destructive" | "danger" | "info" | "warning" | "neutral" | "secondary" | "outline" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface BadgeProps extends React.ComponentProps<"span">, VariantProps<typeof badgeVariants> {}
 declare function Badge({ className, variant, ...props }: BadgeProps): React.JSX.Element;

package/dist/components/button.d.ts

@@ -14,7 +14,7 @@ import { Button } from "@base-ui/react/button";
  * rendered element, which is Base UI's equivalent.
  */
 declare const buttonVariants: (props?: ({
-  variant?: "link" | "destructive" | "outline" | "secondary" | "primary" | "ghost" | "soft" | null | undefined;
+  variant?: "link" | "destructive" | "secondary" | "outline" | "primary" | "ghost" | "soft" | null | undefined;
   size?: "sm" | "md" | "lg" | "icon" | "icon-sm" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface ButtonProps extends React.ComponentProps<typeof Button>, VariantProps<typeof buttonVariants> {}

package/dist/components/markdown.js

@@ -2,6 +2,7 @@
 "use client";
 import { cn } from "../lib/cn.js";
 import { shakeable } from "../lib/shakeable.js";
+import { prose } from "../lib/prose.js";
 import { Check, Copy } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as React from "react";
@@ -28,10 +29,6 @@ function dom(props) {
 	const { node: _node, ...rest } = props;
 	return rest;
 }
-const block = "my-3 first:mt-0 last:mb-0 group-data-[compact]/markdown:my-1.5";
-const body = /* @__PURE__ */ cn("text-[length:var(--ds-text-body-sm)] leading-[var(--ds-text-body-sm--line-height)] text-[color:var(--ds-foreground)]");
-const heading = /* @__PURE__ */ cn("font-[family-name:var(--ds-font-display)] text-[color:var(--ds-foreground)]", "mt-6 mb-2 first:mt-0 group-data-[compact]/markdown:mt-3 group-data-[compact]/markdown:mb-1");
-const cellClassName = "border border-[var(--ds-border)] px-3 py-1.5 align-top";
 function CopyButton({ text }) {
 	const [copied, setCopied] = React.useState(false);
 	React.useEffect(() => {
@@ -55,31 +52,31 @@ function buildComponents(codeRenderer) {
 	return {
 		h1: (p) => /* @__PURE__ */ jsx("h1", {
 			...dom(p),
-			className: cn(heading, "text-[length:var(--ds-text-h1)] leading-[var(--ds-text-h1--line-height)] tracking-[var(--ds-text-h1--letter-spacing)] font-semibold", "group-data-[compact]/markdown:text-[length:var(--ds-text-h3)] group-data-[compact]/markdown:leading-[var(--ds-text-h3--line-height)]")
+			className: prose.h1
 		}),
 		h2: (p) => /* @__PURE__ */ jsx("h2", {
 			...dom(p),
-			className: cn(heading, "text-[length:var(--ds-text-h2)] leading-[var(--ds-text-h2--line-height)] tracking-[var(--ds-text-h2--letter-spacing)] font-bold", "group-data-[compact]/markdown:text-[length:var(--ds-text-body-lg)] group-data-[compact]/markdown:leading-[var(--ds-text-body-lg--line-height)]")
+			className: prose.h2
 		}),
 		h3: (p) => /* @__PURE__ */ jsx("h3", {
 			...dom(p),
-			className: cn(heading, "text-[length:var(--ds-text-h3)] leading-[var(--ds-text-h3--line-height)] font-semibold", "group-data-[compact]/markdown:text-[length:var(--ds-text-body-md)] group-data-[compact]/markdown:leading-[var(--ds-text-body-md--line-height)]")
+			className: prose.h3
 		}),
 		h4: (p) => /* @__PURE__ */ jsx("h4", {
 			...dom(p),
-			className: cn(heading, "font-[family-name:var(--ds-font-body)] text-[length:var(--ds-text-body-md)] leading-[var(--ds-text-body-md--line-height)] font-semibold")
+			className: prose.h4
 		}),
 		h5: (p) => /* @__PURE__ */ jsx("h5", {
 			...dom(p),
-			className: cn(heading, "font-[family-name:var(--ds-font-body)] text-[length:var(--ds-text-body)] leading-[var(--ds-text-body--line-height)] font-semibold")
+			className: prose.h5
 		}),
 		h6: (p) => /* @__PURE__ */ jsx("h6", {
 			...dom(p),
-			className: cn(heading, "font-[family-name:var(--ds-font-body)] text-[length:var(--ds-text-eyebrow)] leading-[var(--ds-text-eyebrow--line-height)] tracking-[var(--ds-text-eyebrow--letter-spacing)] font-semibold uppercase text-[color:var(--ds-muted-foreground)]")
+			className: prose.h6
 		}),
 		p: (p) => /* @__PURE__ */ jsx("p", {
 			...dom(p),
-			className: cn(block, body)
+			className: prose.p
 		}),
 		a: (p) => {
 			const { href, ...rest } = dom(p);
@@ -89,24 +86,24 @@ function buildComponents(codeRenderer) {
 				href,
 				target: external ? "_blank" : void 0,
 				rel: external ? "noopener noreferrer" : void 0,
-				className: cn("text-[color:var(--ds-primary)] underline underline-offset-4 decoration-[color:var(--ds-primary)]/40", "hover:text-[color:var(--ds-primary-hover)] hover:decoration-[color:var(--ds-primary-hover)]", "outline-none focus-visible:ring-[3px] focus-visible:ring-[var(--ds-ring)]/40 rounded-[var(--ds-radius-sm)]")
+				className: prose.a
 			});
 		},
 		strong: (p) => /* @__PURE__ */ jsx("strong", {
 			...dom(p),
-			className: "font-semibold text-[color:var(--ds-foreground)]"
+			className: prose.strong
 		}),
 		em: (p) => /* @__PURE__ */ jsx("em", {
 			...dom(p),
-			className: "italic"
+			className: prose.em
 		}),
 		del: (p) => /* @__PURE__ */ jsx("del", {
 			...dom(p),
-			className: "line-through text-[color:var(--ds-muted-foreground)]"
+			className: prose.del
 		}),
 		code: (p) => /* @__PURE__ */ jsx("code", {
 			...dom(p),
-			className: cn("rounded-[var(--ds-radius-sm)] bg-[var(--ds-muted)] px-1 py-0.5", "font-[family-name:var(--ds-font-mono)] text-[length:var(--ds-text-caption-lg)] text-[color:var(--ds-foreground)]", "border border-[var(--ds-border-subtle)]")
+			className: prose.code
 		}),
 		pre: (p) => {
 			const codeNode = p.node?.children.find((c) => c.type === "element" && c.tagName === "code");
@@ -119,12 +116,12 @@ function buildComponents(codeRenderer) {
 			return /* @__PURE__ */ jsxs("div", {
 				"data-slot": "markdown-pre",
 				"data-language": language,
-				className: cn(block, "group/pre relative overflow-hidden", "rounded-[var(--ds-radius-md)] border border-[var(--ds-border-subtle)] bg-[var(--ds-muted)]"),
+				className: cn(prose.codeFrame, "group/pre relative overflow-hidden"),
 				children: [codeRenderer ? codeRenderer({
 					code,
 					language
 				}) : /* @__PURE__ */ jsx("pre", {
-					className: cn("overflow-x-auto p-3 pr-10", "font-[family-name:var(--ds-font-mono)] text-[length:var(--ds-text-caption-lg)] leading-[var(--ds-text-caption-lg--line-height)] text-[color:var(--ds-foreground)]"),
+					className: cn("overflow-x-auto p-3 pr-10", prose.codeText),
 					children: /* @__PURE__ */ jsx("code", {
 						"data-language": language,
 						children: code
@@ -134,15 +131,15 @@ function buildComponents(codeRenderer) {
 		},
 		blockquote: (p) => /* @__PURE__ */ jsx("blockquote", {
 			...dom(p),
-			className: cn(block, "border-l-2 border-[var(--ds-border-strong)] pl-4 text-[color:var(--ds-muted-foreground)]", "[&>p]:text-[color:inherit]")
+			className: prose.blockquote
 		}),
 		ul: (p) => /* @__PURE__ */ jsx("ul", {
 			...dom(p),
-			className: cn(block, body, "list-disc pl-6 marker:text-[color:var(--ds-text-tertiary)]", "[&_ul]:my-1 [&_ol]:my-1")
+			className: prose.ul
 		}),
 		ol: (p) => /* @__PURE__ */ jsx("ol", {
 			...dom(p),
-			className: cn(block, body, "list-decimal pl-6 marker:text-[color:var(--ds-text-tertiary)]", "[&_ul]:my-1 [&_ol]:my-1")
+			className: prose.ol
 		}),
 		li: (p) => {
 			const rest = dom(p);
@@ -150,49 +147,46 @@ function buildComponents(codeRenderer) {
 			return /* @__PURE__ */ jsx("li", {
 				...rest,
 				"data-task": task || void 0,
-				className: cn("my-1 group-data-[compact]/markdown:my-0.5", task && "-ml-6 list-none")
-			});
-		},
-		input: (p) => {
-			const rest = dom(p);
-			return /* @__PURE__ */ jsx("input", {
-				...rest,
-				readOnly: true,
-				className: cn("mr-2 size-3.5 translate-y-px accent-[var(--ds-primary)] align-baseline", "rounded-[var(--ds-radius-sm)]")
+				className: cn(prose.li, task && prose.liTask)
 			});
 		},
+		input: (p) => /* @__PURE__ */ jsx("input", {
+			...dom(p),
+			readOnly: true,
+			className: prose.checkbox
+		}),
 		table: (p) => /* @__PURE__ */ jsx("div", {
 			"data-slot": "markdown-table",
-			className: cn(block, "w-full overflow-x-auto"),
+			className: prose.tableWrap,
 			children: /* @__PURE__ */ jsx("table", {
 				...dom(p),
-				className: cn("w-full border-collapse text-[length:var(--ds-text-caption-lg)] leading-[var(--ds-text-caption-lg--line-height)] text-[color:var(--ds-foreground)]")
+				className: prose.table
 			})
 		}),
 		thead: (p) => /* @__PURE__ */ jsx("thead", {
 			...dom(p),
-			className: "bg-[var(--ds-muted)]"
+			className: prose.thead
 		}),
 		tbody: (p) => /* @__PURE__ */ jsx("tbody", {
 			...dom(p),
-			className: "[&>tr:nth-child(even)]:bg-[var(--ds-muted)]"
+			className: prose.tbody
 		}),
 		tr: (p) => /* @__PURE__ */ jsx("tr", { ...dom(p) }),
 		th: (p) => /* @__PURE__ */ jsx("th", {
 			...dom(p),
-			className: cn(cellClassName, "text-left font-semibold text-[color:var(--ds-foreground)]")
+			className: prose.th
 		}),
 		td: (p) => /* @__PURE__ */ jsx("td", {
 			...dom(p),
-			className: cellClassName
+			className: prose.td
 		}),
 		hr: (p) => /* @__PURE__ */ jsx("hr", {
 			...dom(p),
-			className: "my-5 border-0 border-t border-[var(--ds-border)] group-data-[compact]/markdown:my-3"
+			className: prose.hr
 		}),
 		img: (p) => /* @__PURE__ */ jsx("img", {
 			...dom(p),
-			className: "my-3 max-w-full rounded-[var(--ds-radius-md)] border border-[var(--ds-border-subtle)]"
+			className: prose.img
 		})
 	};
 }

package/dist/components/markdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"markdown.js","names":[],"sources":["../../src/components/markdown.tsx"],"sourcesContent":["\"use client\";\n\nimport { Check, Copy } from \"lucide-react\";\nimport * as React from \"react\";\nimport ReactMarkdown, { type Components, type ExtraProps, type Options } from \"react-markdown\";\nimport rehypeSanitize, { defaultSchema, type Options as SanitizeSchema } from \"rehype-sanitize\";\nimport remarkGfm from \"remark-gfm\";\nimport { cn } from \"@/lib/cn\";\nimport { shakeable } from \"@/lib/shakeable\";\n\n/**\n * Markdown.\n *\n * react-markdown with GFM (tables, task lists, strikethrough, autolinks) and\n * rehype-sanitize's GitHub schema, so pasted or model-written HTML cannot run\n * scripts or leak styles. Every element is mapped through `components` onto\n * tokens: headings take the type scale with the display face, body copy is\n * `body-sm`, code is mono on the sunken surface, tables stripe with the\n * border colour and fenced blocks carry a copy button.\n *\n * `compact` halves the vertical rhythm and steps headings down for chat\n * bubbles. There is no syntax highlighting; pass `codeRenderer` to plug one in\n * (shiki, prism) for fenced blocks — it receives the raw text and language.\n */\n\ntype HastNode = NonNullable<ExtraProps[\"node\"]>;\ntype HastChild = HastNode[\"children\"][number];\n\nfunction hastText(node: HastChild | HastNode): string {\n  if (node.type === \"text\") return node.value;\n  if (\"children\" in node) return node.children.map(hastText).join(\"\");\n  return \"\";\n}\n\n/** The GitHub schema, plus `class=\"language-*\"` on code and `checked` on task boxes. */\nconst markdownSanitizeSchema: SanitizeSchema = /* @__PURE__ */ shakeable(() => ({\n  ...defaultSchema,\n  attributes: {\n    ...defaultSchema.attributes,\n    code: [...(defaultSchema.attributes?.code ?? []), [\"className\", /^language-./]],\n    input: [...(defaultSchema.attributes?.input ?? []), \"checked\"],\n  },\n}));\n\nexport interface CodeRendererProps {\n  /** The fenced block's text, without a trailing newline. */\n  code: string;\n  /** From the fence's info string, e.g. `ts` for ```ts. */\n  language: string | undefined;\n}\n\n/** Strip react-markdown's `node` so the rest can be spread onto a DOM element. */\nfunction dom<T extends object>(props: T & ExtraProps): T {\n  const { node: _node, ...rest } = props;\n  return rest as T;\n}\n\nconst block = \"my-3 first:mt-0 last:mb-0 group-data-[compact]/markdown:my-1.5\";\n\nconst body = /* @__PURE__ */ cn(\n  \"text-[length:var(--ds-text-body-sm)] leading-[var(--ds-text-body-sm--line-height)] text-[color:var(--ds-foreground)]\",\n);\n\nconst heading = /* @__PURE__ */ cn(\n  \"font-[family-name:var(--ds-font-display)] text-[color:var(--ds-foreground)]\",\n  \"mt-6 mb-2 first:mt-0 group-data-[compact]/markdown:mt-3 group-data-[compact]/markdown:mb-1\",\n);\n\nconst cellClassName = \"border border-[var(--ds-border)] px-3 py-1.5 align-top\";\n\nfunction CopyButton({ text }: { text: string }) {\n  const [copied, setCopied] = React.useState(false);\n  React.useEffect(() => {\n    if (!copied) return;\n    const id = window.setTimeout(() => setCopied(false), 1500);\n    return () => window.clearTimeout(id);\n  }, [copied]);\n  return (\n    <button\n      type=\"button\"\n      data-slot=\"markdown-copy\"\n      data-copied={copied || undefined}\n      aria-label={copied ? \"Copied\" : \"Copy code\"}\n      onClick={() => {\n        void navigator.clipboard?.writeText(text).then(() => setCopied(true));\n      }}\n      className={cn(\n        \"absolute top-1.5 right-1.5 inline-flex size-7 items-center justify-center\",\n        \"rounded-[var(--ds-radius-sm)] text-[color:var(--ds-muted-foreground)]\",\n        \"opacity-0 transition-opacity duration-[var(--ds-duration-fast)] ease-[var(--ds-ease-out)]\",\n        \"group-hover/pre:opacity-100 focus-visible:opacity-100 data-[copied]:opacity-100\",\n        \"hover:bg-[var(--ds-hover)] hover:text-[color:var(--ds-foreground)]\",\n        \"outline-none focus-visible:ring-[3px] focus-visible:ring-[var(--ds-ring)]/40\",\n        \"data-[copied]:text-[color:var(--ds-success)]\",\n        \"[&_svg]:size-3.5\",\n      )}\n    >\n      {copied ? <Check aria-hidden /> : <Copy aria-hidden />}\n    </button>\n  );\n}\n\nfunction buildComponents(codeRenderer: MarkdownProps[\"codeRenderer\"]): Components {\n  return {\n    h1: (p) => (\n      <h1\n        {...dom(p)}\n        className={cn(\n          heading,\n          \"text-[length:var(--ds-text-h1)] leading-[var(--ds-text-h1--line-height)] tracking-[var(--ds-text-h1--letter-spacing)] font-semibold\",\n          \"group-data-[compact]/markdown:text-[length:var(--ds-text-h3)] group-data-[compact]/markdown:leading-[var(--ds-text-h3--line-height)]\",\n        )}\n      />\n    ),\n    h2: (p) => (\n      <h2\n        {...dom(p)}\n        className={cn(\n          heading,\n          \"text-[length:var(--ds-text-h2)] leading-[var(--ds-text-h2--line-height)] tracking-[var(--ds-text-h2--letter-spacing)] font-bold\",\n          \"group-data-[compact]/markdown:text-[length:var(--ds-text-body-lg)] group-data-[compact]/markdown:leading-[var(--ds-text-body-lg--line-height)]\",\n        )}\n      />\n    ),\n    h3: (p) => (\n      <h3\n        {...dom(p)}\n        className={cn(\n          heading,\n          \"text-[length:var(--ds-text-h3)] leading-[var(--ds-text-h3--line-height)] font-semibold\",\n          \"group-data-[compact]/markdown:text-[length:var(--ds-text-body-md)] group-data-[compact]/markdown:leading-[var(--ds-text-body-md--line-height)]\",\n        )}\n      />\n    ),\n    h4: (p) => (\n      <h4\n        {...dom(p)}\n        className={cn(\n          heading,\n          \"font-[family-name:var(--ds-font-body)] text-[length:var(--ds-text-body-md)] leading-[var(--ds-text-body-md--line-height)] font-semibold\",\n        )}\n      />\n    ),\n    h5: (p) => (\n      <h5\n        {...dom(p)}\n        className={cn(\n          heading,\n          \"font-[family-name:var(--ds-font-body)] text-[length:var(--ds-text-body)] leading-[var(--ds-text-body--line-height)] font-semibold\",\n        )}\n      />\n    ),\n    h6: (p) => (\n      <h6\n        {...dom(p)}\n        className={cn(\n          heading,\n          \"font-[family-name:var(--ds-font-body)] text-[length:var(--ds-text-eyebrow)] leading-[var(--ds-text-eyebrow--line-height)] tracking-[var(--ds-text-eyebrow--letter-spacing)] font-semibold uppercase text-[color:var(--ds-muted-foreground)]\",\n        )}\n      />\n    ),\n    p: (p) => <p {...dom(p)} className={cn(block, body)} />,\n    a: (p) => {\n      const { href, ...rest } = dom(p);\n      const external = typeof href === \"string\" && /^https?:\\/\\//.test(href);\n      return (\n        <a\n          {...rest}\n          href={href}\n          target={external ? \"_blank\" : undefined}\n          rel={external ? \"noopener noreferrer\" : undefined}\n          className={cn(\n            \"text-[color:var(--ds-primary)] underline underline-offset-4 decoration-[color:var(--ds-primary)]/40\",\n            \"hover:text-[color:var(--ds-primary-hover)] hover:decoration-[color:var(--ds-primary-hover)]\",\n            \"outline-none focus-visible:ring-[3px] focus-visible:ring-[var(--ds-ring)]/40 rounded-[var(--ds-radius-sm)]\",\n          )}\n        />\n      );\n    },\n    strong: (p) => <strong {...dom(p)} className=\"font-semibold text-[color:var(--ds-foreground)]\" />,\n    em: (p) => <em {...dom(p)} className=\"italic\" />,\n    del: (p) => <del {...dom(p)} className=\"line-through text-[color:var(--ds-muted-foreground)]\" />,\n    code: (p) => (\n      <code\n        {...dom(p)}\n        className={cn(\n          \"rounded-[var(--ds-radius-sm)] bg-[var(--ds-muted)] px-1 py-0.5\",\n          \"font-[family-name:var(--ds-font-mono)] text-[length:var(--ds-text-caption-lg)] text-[color:var(--ds-foreground)]\",\n          \"border border-[var(--ds-border-subtle)]\",\n        )}\n      />\n    ),\n    pre: (p) => {\n      const codeNode = p.node?.children.find(\n        (c): c is HastNode => c.type === \"element\" && c.tagName === \"code\",\n      );\n      const source = codeNode ? hastText(codeNode) : hastText(p.node ?? { type: \"text\", value: \"\" });\n      const code = source.replace(/\\n$/, \"\");\n      const classes = codeNode?.properties.className;\n      const language = (Array.isArray(classes) ? classes : [classes])\n        .map(String)\n        .find((c) => c.startsWith(\"language-\"))\n        ?.slice(\"language-\".length);\n      return (\n        <div\n          data-slot=\"markdown-pre\"\n          data-language={language}\n          className={cn(\n            block,\n            \"group/pre relative overflow-hidden\",\n            \"rounded-[var(--ds-radius-md)] border border-[var(--ds-border-subtle)] bg-[var(--ds-muted)]\",\n          )}\n        >\n          {codeRenderer ? (\n            codeRenderer({ code, language })\n          ) : (\n            <pre\n              className={cn(\n                \"overflow-x-auto p-3 pr-10\",\n                \"font-[family-name:var(--ds-font-mono)] text-[length:var(--ds-text-caption-lg)] leading-[var(--ds-text-caption-lg--line-height)] text-[color:var(--ds-foreground)]\",\n              )}\n            >\n              <code data-language={language}>{code}</code>\n            </pre>\n          )}\n          <CopyButton text={code} />\n        </div>\n      );\n    },\n    blockquote: (p) => (\n      <blockquote\n        {...dom(p)}\n        className={cn(\n          block,\n          \"border-l-2 border-[var(--ds-border-strong)] pl-4 text-[color:var(--ds-muted-foreground)]\",\n          \"[&>p]:text-[color:inherit]\",\n        )}\n      />\n    ),\n    ul: (p) => (\n      <ul\n        {...dom(p)}\n        className={cn(\n          block,\n          body,\n          \"list-disc pl-6 marker:text-[color:var(--ds-text-tertiary)]\",\n          \"[&_ul]:my-1 [&_ol]:my-1\",\n        )}\n      />\n    ),\n    ol: (p) => (\n      <ol\n        {...dom(p)}\n        className={cn(\n          block,\n          body,\n          \"list-decimal pl-6 marker:text-[color:var(--ds-text-tertiary)]\",\n          \"[&_ul]:my-1 [&_ol]:my-1\",\n        )}\n      />\n    ),\n    li: (p) => {\n      const rest = dom(p);\n      const task = typeof rest.className === \"string\" && rest.className.includes(\"task-list-item\");\n      return (\n        <li\n          {...rest}\n          data-task={task || undefined}\n          className={cn(\"my-1 group-data-[compact]/markdown:my-0.5\", task && \"-ml-6 list-none\")}\n        />\n      );\n    },\n    input: (p) => {\n      const rest = dom(p);\n      return (\n        <input\n          {...rest}\n          readOnly\n          className={cn(\n            \"mr-2 size-3.5 translate-y-px accent-[var(--ds-primary)] align-baseline\",\n            \"rounded-[var(--ds-radius-sm)]\",\n          )}\n        />\n      );\n    },\n    table: (p) => (\n      <div data-slot=\"markdown-table\" className={cn(block, \"w-full overflow-x-auto\")}>\n        <table\n          {...dom(p)}\n          className={cn(\n            \"w-full border-collapse text-[length:var(--ds-text-caption-lg)] leading-[var(--ds-text-caption-lg--line-height)] text-[color:var(--ds-foreground)]\",\n          )}\n        />\n      </div>\n    ),\n    thead: (p) => <thead {...dom(p)} className=\"bg-[var(--ds-muted)]\" />,\n    tbody: (p) => <tbody {...dom(p)} className=\"[&>tr:nth-child(even)]:bg-[var(--ds-muted)]\" />,\n    tr: (p) => <tr {...dom(p)} />,\n    th: (p) => (\n      <th\n        {...dom(p)}\n        className={cn(cellClassName, \"text-left font-semibold text-[color:var(--ds-foreground)]\")}\n      />\n    ),\n    td: (p) => <td {...dom(p)} className={cellClassName} />,\n    hr: (p) => (\n      <hr {...dom(p)} className=\"my-5 border-0 border-t border-[var(--ds-border)] group-data-[compact]/markdown:my-3\" />\n    ),\n    img: (p) => (\n      <img\n        {...dom(p)}\n        className=\"my-3 max-w-full rounded-[var(--ds-radius-md)] border border-[var(--ds-border-subtle)]\"\n      />\n    ),\n  };\n}\n\nexport interface MarkdownProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n  /** The markdown source. */\n  children: string | null | undefined;\n  /** Tighter rhythm and smaller headings, for chat bubbles. */\n  compact?: boolean;\n  /** Renders fenced code blocks; the copy button is still added. Use for syntax highlighting. */\n  codeRenderer?: (props: CodeRendererProps) => React.ReactNode;\n  /** Override or extend the element map. */\n  components?: Components;\n  /** Extra remark plugins, appended after GFM. */\n  remarkPlugins?: NonNullable<Options[\"remarkPlugins\"]>;\n  /** Extra rehype plugins, appended after sanitize. */\n  rehypePlugins?: NonNullable<Options[\"rehypePlugins\"]>;\n  /**\n   * Rehype plugins that must run BEFORE sanitize. The one legitimate use is\n   * `rehype-raw` in a host that embeds trusted custom tags in markdown (the\n   * webchat's `<cortena-*>` blocks): raw HTML has to become nodes before the\n   * sanitizer sees it, and the sanitize schema then decides what survives.\n   * Anything placed here widens what reaches the sanitizer, so keep the\n   * schema strict when you use it.\n   */\n  rehypePluginsBeforeSanitize?: NonNullable<Options[\"rehypePlugins\"]>;\n  /** Replace the sanitize schema; defaults to `markdownSanitizeSchema`. */\n  sanitizeSchema?: SanitizeSchema;\n  /** Rewrite URLs; defaults to react-markdown's, which drops non-http(s)/mailto/tel schemes. */\n  urlTransform?: Options[\"urlTransform\"];\n}\n\nfunction Markdown({\n  children,\n  compact = false,\n  codeRenderer,\n  components,\n  remarkPlugins,\n  rehypePlugins,\n  rehypePluginsBeforeSanitize,\n  sanitizeSchema = markdownSanitizeSchema,\n  urlTransform,\n  className,\n  ...props\n}: MarkdownProps) {\n  const map = React.useMemo(\n    () => ({ ...buildComponents(codeRenderer), ...components }),\n    [codeRenderer, components],\n  );\n  const remark = React.useMemo(() => [remarkGfm, ...(remarkPlugins ?? [])], [remarkPlugins]);\n  const rehype = React.useMemo(\n    () => [...(rehypePluginsBeforeSanitize ?? []), [rehypeSanitize, sanitizeSchema] as const, ...(rehypePlugins ?? [])],\n    [rehypePluginsBeforeSanitize, rehypePlugins, sanitizeSchema],\n  );\n  return (\n    <div\n      data-slot=\"markdown\"\n      data-compact={compact || undefined}\n      className={cn(\"group/markdown min-w-0 break-words text-[color:var(--ds-foreground)]\", className)}\n      {...props}\n    >\n      <ReactMarkdown\n        remarkPlugins={remark}\n        rehypePlugins={rehype as NonNullable<Options[\"rehypePlugins\"]>}\n        components={map}\n        urlTransform={urlTransform}\n      >\n        {children ?? \"\"}\n      </ReactMarkdown>\n    </div>\n  );\n}\n\nexport { Markdown, markdownSanitizeSchema };\nexport type { Components as MarkdownComponents };\n"],"mappings":"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"}
+{"version":3,"file":"markdown.js","names":[],"sources":["../../src/components/markdown.tsx"],"sourcesContent":["\"use client\";\n\nimport { Check, Copy } from \"lucide-react\";\nimport * as React from \"react\";\nimport ReactMarkdown, { type Components, type ExtraProps, type Options } from \"react-markdown\";\nimport rehypeSanitize, { defaultSchema, type Options as SanitizeSchema } from \"rehype-sanitize\";\nimport remarkGfm from \"remark-gfm\";\nimport { cn } from \"@/lib/cn\";\nimport { prose } from \"@/lib/prose\";\nimport { shakeable } from \"@/lib/shakeable\";\n\n/**\n * Markdown.\n *\n * react-markdown with GFM (tables, task lists, strikethrough, autolinks) and\n * rehype-sanitize's GitHub schema, so pasted or model-written HTML cannot run\n * scripts or leak styles. Every element is mapped through `components` onto\n * tokens: headings take the type scale with the display face, body copy is\n * `body-sm`, code is mono on the sunken surface, tables stripe with the\n * border colour and fenced blocks carry a copy button.\n *\n * `compact` halves the vertical rhythm and steps headings down for chat\n * bubbles. There is no syntax highlighting; pass `codeRenderer` to plug one in\n * (shiki, prism) for fenced blocks — it receives the raw text and language.\n */\n\ntype HastNode = NonNullable<ExtraProps[\"node\"]>;\ntype HastChild = HastNode[\"children\"][number];\n\nfunction hastText(node: HastChild | HastNode): string {\n  if (node.type === \"text\") return node.value;\n  if (\"children\" in node) return node.children.map(hastText).join(\"\");\n  return \"\";\n}\n\n/** The GitHub schema, plus `class=\"language-*\"` on code and `checked` on task boxes. */\nconst markdownSanitizeSchema: SanitizeSchema = /* @__PURE__ */ shakeable(() => ({\n  ...defaultSchema,\n  attributes: {\n    ...defaultSchema.attributes,\n    code: [...(defaultSchema.attributes?.code ?? []), [\"className\", /^language-./]],\n    input: [...(defaultSchema.attributes?.input ?? []), \"checked\"],\n  },\n}));\n\nexport interface CodeRendererProps {\n  /** The fenced block's text, without a trailing newline. */\n  code: string;\n  /** From the fence's info string, e.g. `ts` for ```ts. */\n  language: string | undefined;\n}\n\n/** Strip react-markdown's `node` so the rest can be spread onto a DOM element. */\nfunction dom<T extends object>(props: T & ExtraProps): T {\n  const { node: _node, ...rest } = props;\n  return rest as T;\n}\n\nfunction CopyButton({ text }: { text: string }) {\n  const [copied, setCopied] = React.useState(false);\n  React.useEffect(() => {\n    if (!copied) return;\n    const id = window.setTimeout(() => setCopied(false), 1500);\n    return () => window.clearTimeout(id);\n  }, [copied]);\n  return (\n    <button\n      type=\"button\"\n      data-slot=\"markdown-copy\"\n      data-copied={copied || undefined}\n      aria-label={copied ? \"Copied\" : \"Copy code\"}\n      onClick={() => {\n        void navigator.clipboard?.writeText(text).then(() => setCopied(true));\n      }}\n      className={cn(\n        \"absolute top-1.5 right-1.5 inline-flex size-7 items-center justify-center\",\n        \"rounded-[var(--ds-radius-sm)] text-[color:var(--ds-muted-foreground)]\",\n        \"opacity-0 transition-opacity duration-[var(--ds-duration-fast)] ease-[var(--ds-ease-out)]\",\n        \"group-hover/pre:opacity-100 focus-visible:opacity-100 data-[copied]:opacity-100\",\n        \"hover:bg-[var(--ds-hover)] hover:text-[color:var(--ds-foreground)]\",\n        \"outline-none focus-visible:ring-[3px] focus-visible:ring-[var(--ds-ring)]/40\",\n        \"data-[copied]:text-[color:var(--ds-success)]\",\n        \"[&_svg]:size-3.5\",\n      )}\n    >\n      {copied ? <Check aria-hidden /> : <Copy aria-hidden />}\n    </button>\n  );\n}\n\nfunction buildComponents(codeRenderer: MarkdownProps[\"codeRenderer\"]): Components {\n  return {\n    h1: (p) => <h1 {...dom(p)} className={prose.h1} />,\n    h2: (p) => <h2 {...dom(p)} className={prose.h2} />,\n    h3: (p) => <h3 {...dom(p)} className={prose.h3} />,\n    h4: (p) => <h4 {...dom(p)} className={prose.h4} />,\n    h5: (p) => <h5 {...dom(p)} className={prose.h5} />,\n    h6: (p) => <h6 {...dom(p)} className={prose.h6} />,\n    p: (p) => <p {...dom(p)} className={prose.p} />,\n    a: (p) => {\n      const { href, ...rest } = dom(p);\n      const external = typeof href === \"string\" && /^https?:\\/\\//.test(href);\n      return (\n        <a\n          {...rest}\n          href={href}\n          target={external ? \"_blank\" : undefined}\n          rel={external ? \"noopener noreferrer\" : undefined}\n          className={prose.a}\n        />\n      );\n    },\n    strong: (p) => <strong {...dom(p)} className={prose.strong} />,\n    em: (p) => <em {...dom(p)} className={prose.em} />,\n    del: (p) => <del {...dom(p)} className={prose.del} />,\n    code: (p) => <code {...dom(p)} className={prose.code} />,\n    pre: (p) => {\n      const codeNode = p.node?.children.find(\n        (c): c is HastNode => c.type === \"element\" && c.tagName === \"code\",\n      );\n      const source = codeNode ? hastText(codeNode) : hastText(p.node ?? { type: \"text\", value: \"\" });\n      const code = source.replace(/\\n$/, \"\");\n      const classes = codeNode?.properties.className;\n      const language = (Array.isArray(classes) ? classes : [classes])\n        .map(String)\n        .find((c) => c.startsWith(\"language-\"))\n        ?.slice(\"language-\".length);\n      return (\n        <div\n          data-slot=\"markdown-pre\"\n          data-language={language}\n          // The frame clips to its own radius; the `<pre>` inside it scrolls.\n          className={cn(prose.codeFrame, \"group/pre relative overflow-hidden\")}\n        >\n          {codeRenderer ? (\n            codeRenderer({ code, language })\n          ) : (\n            <pre className={cn(\"overflow-x-auto p-3 pr-10\", prose.codeText)}>\n              <code data-language={language}>{code}</code>\n            </pre>\n          )}\n          <CopyButton text={code} />\n        </div>\n      );\n    },\n    blockquote: (p) => <blockquote {...dom(p)} className={prose.blockquote} />,\n    ul: (p) => <ul {...dom(p)} className={prose.ul} />,\n    ol: (p) => <ol {...dom(p)} className={prose.ol} />,\n    li: (p) => {\n      const rest = dom(p);\n      const task = typeof rest.className === \"string\" && rest.className.includes(\"task-list-item\");\n      return (\n        <li {...rest} data-task={task || undefined} className={cn(prose.li, task && prose.liTask)} />\n      );\n    },\n    input: (p) => <input {...dom(p)} readOnly className={prose.checkbox} />,\n    table: (p) => (\n      <div data-slot=\"markdown-table\" className={prose.tableWrap}>\n        <table\n          {...dom(p)}\n          className={prose.table}\n        />\n      </div>\n    ),\n    thead: (p) => <thead {...dom(p)} className={prose.thead} />,\n    tbody: (p) => <tbody {...dom(p)} className={prose.tbody} />,\n    tr: (p) => <tr {...dom(p)} />,\n    th: (p) => <th {...dom(p)} className={prose.th} />,\n    td: (p) => <td {...dom(p)} className={prose.td} />,\n    hr: (p) => <hr {...dom(p)} className={prose.hr} />,\n    img: (p) => <img {...dom(p)} className={prose.img} />,\n  };\n}\n\nexport interface MarkdownProps extends Omit<React.ComponentProps<\"div\">, \"children\"> {\n  /** The markdown source. */\n  children: string | null | undefined;\n  /** Tighter rhythm and smaller headings, for chat bubbles. */\n  compact?: boolean;\n  /** Renders fenced code blocks; the copy button is still added. Use for syntax highlighting. */\n  codeRenderer?: (props: CodeRendererProps) => React.ReactNode;\n  /** Override or extend the element map. */\n  components?: Components;\n  /** Extra remark plugins, appended after GFM. */\n  remarkPlugins?: NonNullable<Options[\"remarkPlugins\"]>;\n  /** Extra rehype plugins, appended after sanitize. */\n  rehypePlugins?: NonNullable<Options[\"rehypePlugins\"]>;\n  /**\n   * Rehype plugins that must run BEFORE sanitize. The one legitimate use is\n   * `rehype-raw` in a host that embeds trusted custom tags in markdown (the\n   * webchat's `<cortena-*>` blocks): raw HTML has to become nodes before the\n   * sanitizer sees it, and the sanitize schema then decides what survives.\n   * Anything placed here widens what reaches the sanitizer, so keep the\n   * schema strict when you use it.\n   */\n  rehypePluginsBeforeSanitize?: NonNullable<Options[\"rehypePlugins\"]>;\n  /** Replace the sanitize schema; defaults to `markdownSanitizeSchema`. */\n  sanitizeSchema?: SanitizeSchema;\n  /** Rewrite URLs; defaults to react-markdown's, which drops non-http(s)/mailto/tel schemes. */\n  urlTransform?: Options[\"urlTransform\"];\n}\n\nfunction Markdown({\n  children,\n  compact = false,\n  codeRenderer,\n  components,\n  remarkPlugins,\n  rehypePlugins,\n  rehypePluginsBeforeSanitize,\n  sanitizeSchema = markdownSanitizeSchema,\n  urlTransform,\n  className,\n  ...props\n}: MarkdownProps) {\n  const map = React.useMemo(\n    () => ({ ...buildComponents(codeRenderer), ...components }),\n    [codeRenderer, components],\n  );\n  const remark = React.useMemo(() => [remarkGfm, ...(remarkPlugins ?? [])], [remarkPlugins]);\n  const rehype = React.useMemo(\n    () => [...(rehypePluginsBeforeSanitize ?? []), [rehypeSanitize, sanitizeSchema] as const, ...(rehypePlugins ?? [])],\n    [rehypePluginsBeforeSanitize, rehypePlugins, sanitizeSchema],\n  );\n  return (\n    <div\n      data-slot=\"markdown\"\n      data-compact={compact || undefined}\n      className={cn(\"group/markdown min-w-0 break-words text-[color:var(--ds-foreground)]\", className)}\n      {...props}\n    >\n      <ReactMarkdown\n        remarkPlugins={remark}\n        rehypePlugins={rehype as NonNullable<Options[\"rehypePlugins\"]>}\n        components={map}\n        urlTransform={urlTransform}\n      >\n        {children ?? \"\"}\n      </ReactMarkdown>\n    </div>\n  );\n}\n\nexport { Markdown, markdownSanitizeSchema };\nexport type { Components as MarkdownComponents };\n"],"mappings":"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"}

package/dist/components/rich-text-editor/extensions.d.ts

@@ -0,0 +1,43 @@
+"use client";
+import { Extension, Extensions, Node } from "@tiptap/core";
+//#region src/components/rich-text-editor/extensions.d.ts
+/** h1 is reserved for the record's own title; h5 and h6 are below the editable scale. */
+export declare const HEADING_LEVELS: readonly [2, 3, 4];
+/**
+ * A block the subset cannot represent, carried through untouched.
+ *
+ * Front matter, an HTML block, a footnote definition, an h1, a maths display.
+ * It behaves like a code block — plain text, no marks, newlines allowed — so an
+ * author can still edit the raw markdown, and it serialises as exactly its own
+ * text with no escaping applied. Dropping these instead would destroy a PRD's
+ * front matter on first save.
+ */
+export declare const RawBlock: Node<any, any>;
+export interface MentionChipAttributes {
+  id: string;
+  label: string;
+  trigger: string;
+}
+/**
+ * A mention, as an inline atom.
+ *
+ * It serialises as a link on the `mention:` protocol — `[@Priya](mention:u-1)` —
+ * so a mention survives a round trip through plain Markdown and through any
+ * other tool that reads the file. What `@` and `#` mean is the consumer's
+ * business: the component only asks `mentionProvider` for items and inserts
+ * what comes back.
+ */
+export declare const MentionChip: Node<any, any>;
+export interface RichTextExtensionOptions {
+  /** Shown on an empty document. */
+  placeholder?: string;
+}
+/**
+ * The extension list, and therefore the schema.
+ *
+ * Pure: `parseMarkdown` normalises documents through the schema this produces,
+ * so it must depend on nothing but its options.
+ */
+export declare function richTextExtensions(options?: RichTextExtensionOptions): Extensions;
+//#endregion
+//# sourceMappingURL=extensions.d.ts.map