Skip to content

Commit c2b6b8b

Browse files
blankjulblankjul
committed
web: richer rendered markdown — GitHub alerts + emoji (for agent-authored docs)
The rendered document view now runs GFM + emoji shortcodes (remark-gemoji) + GitHub alerts (remark-github-blockquote-alert): `> [!NOTE] / [!TIP] / [!IMPORTANT] / [!WARNING] / [!CAUTION]` render as colored callout boxes with icons, and `:rocket:` style shortcodes become emoji — so a doc an agent writes renders richly. Alert styling is imported straight from the package's own alert.css (self-contained, auto light/dark) rather than hand-rolled. Verified rendering in a headless browser.
1 parent 24a4dbb commit c2b6b8b

9 files changed

Lines changed: 196 additions & 138 deletions

File tree

‎src/pyclawd/web/static/assets/index-CCp_FKiO.js‎

Lines changed: 0 additions & 133 deletions
This file was deleted.

‎src/pyclawd/web/static/assets/index-DA8OQWcg.js‎

Lines changed: 135 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/pyclawd/web/static/assets/index-DdE0C6b4.css‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎src/pyclawd/web/static/assets/index-DnuO9ktp.css‎

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/pyclawd/web/static/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<title>pyclawd web</title>
7-
<script type="module" crossorigin src="/assets/index-CCp_FKiO.js"></script>
8-
<link rel="stylesheet" crossorigin href="/assets/index-DdE0C6b4.css">
7+
<script type="module" crossorigin src="/assets/index-DA8OQWcg.js"></script>
8+
<link rel="stylesheet" crossorigin href="/assets/index-DnuO9ktp.css">
99
</head>
1010
<body>
1111
<div id="root"></div>

‎src/pyclawd/web_frontend/package-lock.json‎

Lines changed: 45 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/pyclawd/web_frontend/package.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,9 @@
2121
"react": "^19.0.0",
2222
"react-dom": "^19.0.0",
2323
"react-markdown": "^10.1.0",
24+
"remark-gemoji": "^8.0.0",
2425
"remark-gfm": "^4.0.1",
26+
"remark-github-blockquote-alert": "^2.1.0",
2527
"remark-parse": "^11.0.0",
2628
"tailwind-merge": "^3.0.1",
2729
"unified": "^11.0.5"

‎src/pyclawd/web_frontend/src/components/DiffView.tsx‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,18 @@
55
import { useQuery, useQueryClient } from "@tanstack/react-query";
66
import { useEffect, useMemo, useRef, useState } from "react";
77
import ReactMarkdown from "react-markdown";
8+
import remarkGemoji from "remark-gemoji";
89
import remarkGfm from "remark-gfm";
10+
import { remarkAlert } from "remark-github-blockquote-alert";
911
import remarkParse from "remark-parse";
1012
import { unified } from "unified";
1113

14+
import "remark-github-blockquote-alert/alert.css";
15+
16+
/** Remark plugins for the rendered document view: GFM + emoji shortcodes + GitHub
17+
* alerts (`> [!NOTE]` → styled callout), so agent-authored docs render richly. */
18+
const DOC_PLUGINS = [remarkGfm, remarkGemoji, remarkAlert];
19+
1220
import { api } from "@/api";
1321
import { Markdown } from "@/components/Markdown";
1422
import { usePersisted } from "@/hooks";
@@ -475,7 +483,7 @@ function BlockRow({ block }: { block: MdBlock }) {
475483
💬
476484
</button>
477485
<div className="md-body">
478-
<ReactMarkdown remarkPlugins={[remarkGfm]}>{block.source}</ReactMarkdown>
486+
<ReactMarkdown remarkPlugins={DOC_PLUGINS}>{block.source}</ReactMarkdown>
479487
</div>
480488
{open && (
481489
<div className="my-2 max-w-2xl space-y-2">

‎src/pyclawd/web_frontend/src/index.css‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -182,6 +182,8 @@ body {
182182
.md-commented:hover {
183183
background: #fff3d4;
184184
}
185+
/* GitHub alert (> [!NOTE] etc.) styling is imported directly from the
186+
remark-github-blockquote-alert package — see the import in DiffView.tsx. */
185187
.md-body p,
186188
.md-body ul,
187189
.md-body ol,

0 commit comments

Comments
 (0)