@deepseek-ai/dsh-client-ui-primitives 0.1.2-alpha.2 → 0.1.2-alpha.4

package/README.i18n.yaml

@@ -2,5 +2,5 @@
 # side as of the last confirmed-consistent state. Both languages carry equal authority;
 # after editing either side, bring the other along and re-record with:
 #   pnpm run verify-translation-pairing --write packages/client/ui-primitives/README.md
-README.md: 42c1110e8735dd2191c8b7a2e4dcc1f2b9b938bc
-README.zh.md: 9f3c06cacebb7a596204dbe1c8e00a549ce1fcae
+README.md: 78cb6caec665687feb1c18c65e1afe47c6e01ea1
+README.zh.md: 1450de83f88e4e33be4616ebd1f70588dd19e8d2

package/README.md

@@ -33,7 +33,7 @@ Compose feature UI from these atoms whenever the web client needs a standard con
 
 ### Rendering agent output
 
-`MarkdownText` renders untrusted GFM and TeX math, blocks unsafe links and images, and can turn resolved file mentions into explicit controls. While a reply streams, it freezes completed blocks and highlights a growing fence from saved Shiki grammar state; the final render uses the same span tree ([incremental renderer](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.md), [streaming fence highlighting](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md)). `TerminalBlock`, `ReadBlock`, `DiffBlock`, `SearchBlock`, and `WebBlock` render the matching tool-result intent with copy controls, overflow handling, and ANSI processing where applicable. `JsonTree` and `JsonBlock` inspect JSON values read-only, while `MessageText` remains the literal-text primitive for user-authored content.
+`MarkdownText` renders untrusted GFM and TeX math, blocks unsafe links and images, and can turn resolved file mentions into explicit controls. While a reply streams, it freezes completed blocks, advances a top-level open fence by completed lines, and highlights that fence from saved Shiki grammar state. Completed token lines enter fixed-size React groups, so later chunks reconcile only the growing group; an unchanged fence retains that DOM when the final full parse resolves cross-document syntax ([incremental renderer](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.md), [streaming fence highlighting](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md)). `TerminalBlock`, `ReadBlock`, `DiffBlock`, `SearchBlock`, and `WebBlock` render the matching tool-result intent with copy controls, overflow handling, and ANSI processing where applicable. `JsonTree` and `JsonBlock` inspect JSON values read-only, while `MessageText` remains the literal-text primitive for user-authored content.
 
 ### Localizing copy
 
@@ -63,7 +63,7 @@ The package is one separation: presentational React atoms with zero Cordis and z
 
 ### Streaming markdown
 
-While a reply streams, `MarkdownText` parses incrementally: all but the trailing two blocks freeze as cached React elements and only the source tail re-parses per chunk, so per-chunk work tracks the tail instead of the whole reply. A growing fenced block tokenizes completed text from saved Shiki grammar state plus the unfinished last line; completed lines retain their DOM, and the settled render uses the same span tree. The settled full parse at finalize also resolves references that crossed the freeze boundary ([incremental renderer](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.md), [streaming fence highlighting](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md)).
+While a reply streams, `MarkdownText` parses incrementally: all but the trailing two blocks freeze as cached React elements and only the source tail re-parses per chunk, so per-chunk work tracks the tail instead of the whole reply. A final unclosed top-level fence keeps its parsed code node and sends only the last completed line plus the current partial line through the same GFM grammar; a closing fence or ambiguous parse returns to the ordinary tail path. Highlighting likewise resumes from saved Shiki grammar state and publishes only newly completed lines plus the mutable tail. `CodeBlock` seals completed lines into fixed-size React groups, reuses earlier groups, and retains the whole highlighted tree across settlement when code and language are unchanged. The settled full parse still resolves references that crossed the freeze boundary ([incremental renderer](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.md), [streaming fence highlighting](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.md)).
 
 ### Geometry and overflow
 
@@ -103,6 +103,7 @@ None; this package neither assembles nor sends a provider request.
 These limits define how the atoms behave at the edges; they are current package constraints, not a component roadmap.
 
 - **Streaming defers cross-boundary reference resolution** — a reference-style link or footnote whose definition sits on the other side of the incremental freeze boundary renders as literal text while the reply streams; the settled full parse at finalize resolves it.
+- **A long highlighted fence retains its complete token DOM** — streaming avoids re-parsing, re-tokenizing, and reconciling the completed prefix, but it does not discard old colors or virtualize token spans. Final DOM cardinality therefore still follows the fence's token count; nested/container fences and a pathological single long line remain on the general tail path.
 - **Glyph-level icons are redrawn approximations** — the fish logo and the sparkle mark come from font glyphs whose vector geometry is not exportable from the local design data; hand-authored recreations stand in until an exact export path exists.
 - **`Pill` and `Input` have no design source** — both atoms are self-defined; the sidebar search field and view-tab strip that resemble them are consumer-owned compositions, not these atoms.
 - **No `Active` `StateDot` variant** — the supported states are done, warning, ongoing, and error.
@@ -118,3 +119,5 @@ These limits define how the atoms behave at the edges; they are current package
 None.
 
 </details>
+
+**Runtime invariant:** No companion is published. Pure props-in React atoms with no Cordis API — no events, no services, no mutable cross-plugin state; rendering contracts are asserted directly by this package's component specs.

package/README.zh.md

@@ -33,7 +33,7 @@ kind: "package-library"
 
 ### 渲染 agent 输出
 
-`MarkdownText` 渲染不可信的 GFM 与 TeX 公式、阻止不安全的链接与图片，并可把已解析的文件提及转换为显式控件。回复流式输出时，它冻结已完成的块，并从保存的 Shiki grammar state 为不断增长的 fence 增量高亮；最终渲染使用相同的 span 树（[增量渲染器](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.zh.md)、[流式 fence 高亮](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md)）。`TerminalBlock`、`ReadBlock`、`DiffBlock`、`SearchBlock` 与 `WebBlock` 把对应的工具结果意图渲染为带复制控件、溢出处理及适用时 ANSI 处理的卡片。`JsonTree` 与 `JsonBlock` 以只读方式检查 JSON 值；`MessageText` 仍是用户创作内容的字面文本原语。
+`MarkdownText` 渲染不可信的 GFM 与 TeX 公式、阻止不安全的链接与图片，并可把已解析的文件提及转换为显式控件。回复流式输出时，它冻结已完成的块、按已完成行推进顶层未闭合 fence，并从保存的 Shiki grammar state 为该 fence 增量高亮。已完成的 token 行进入固定大小的 React 分组，后续分片只 reconcile 正在增长的分组；最终全量解析解决跨文档语法时，未变化的 fence 会保留该 DOM（[增量渲染器](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.zh.md)、[流式 fence 高亮](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md)）。`TerminalBlock`、`ReadBlock`、`DiffBlock`、`SearchBlock` 与 `WebBlock` 把对应的工具结果意图渲染为带复制控件、溢出处理及适用时 ANSI 处理的卡片。`JsonTree` 与 `JsonBlock` 以只读方式检查 JSON 值；`MessageText` 仍是用户创作内容的字面文本原语。
 
 ### 本地化文案
 
@@ -63,7 +63,7 @@ kind: "package-library"
 
 ### 流式 markdown
 
-回复流式输出期间，`MarkdownText` 增量解析：除末尾两个块外全部冻结为缓存的 React 元素，每个分片只重新解析其后的源文本尾部，因此每分片的工作量跟随尾部而非整个回复。不断增长的 fenced block 会从已保存的 Shiki grammar state 加上尚未完成的最后一行继续分词；已完成行保留其 DOM，定稿渲染则使用相同的 span 树。定稿时的全量解析还会解析跨过冻结边界的引用（[增量渲染器](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.zh.md)、[流式 fence 高亮](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md)）。
+回复流式输出期间，`MarkdownText` 增量解析：除末尾两个块外全部冻结为缓存的 React 元素，每个分片只重新解析其后的源文本尾部，因此每分片的工作量跟随尾部而非整个回复。末尾的顶层未闭合 fence 会保留已解析的 code node，只把最后一个已完成行与当前未完成行交给同一套 GFM grammar；闭合 fence 或有歧义的解析会回到普通尾部路径。高亮同样从保存的 Shiki grammar state 续接，并只发布新完成行与可变尾部。`CodeBlock` 把已完成行封入固定大小的 React 分组、复用更早的分组，并在代码与语言未变化时跨定稿保留整棵高亮树。定稿时的全量解析仍会解析跨过冻结边界的引用（[增量渲染器](../../../.agents/notes/implemented/architecture/2026-08-06-web-markdown-incremental-ast-renderer.zh.md)、[流式 fence 高亮](../../../.agents/notes/implemented/feature/2026-08-20-web-streaming-fence-highlight.zh.md)）。
 
 ### 几何与溢出
 
@@ -103,6 +103,7 @@ kind: "package-library"
 这些限制说明原子组件在边缘情况下的行为；它们是当前包约束，不是组件路线图。
 
 - **流式期间跨边界引用解析被推迟**：定义落在增量冻结边界另一侧的引用式链接或脚注，在回复流式输出期间渲染为字面文本；定稿时的全量解析会将其解析。
+- **长高亮 fence 会保留完整 token DOM**：流式路径避免重新解析、重新 tokenize 和 reconcile 已完成前缀，但不会丢弃旧颜色或虚拟化 token span。因此最终 DOM 数量仍随 fence 的 token 数增长；嵌套／容器内 fence 与病态的单个超长行仍走通用尾部路径。
 - **字形级图标是重新绘制的近似版本**：鱼形标志与闪光标记来自字体字形，而本地设计数据无法导出其矢量几何；在获得精确导出路径前，使用手工重建版本代替。
 - **`Pill` 与 `Input` 没有设计来源**：两个原子组件均自行定义；与其相似的侧边栏搜索字段和视图标签条由消费方组合，不是这些原子组件。
 - **`StateDot` 没有 `Active` 变体**：支持的状态为 done、warning、ongoing 和 error。
@@ -118,3 +119,5 @@ kind: "package-library"
 无。
 
 </details>
+
+**运行时不变式：** 不发布伴生入口。这些是纯 props-in React atom，没有 Cordis API、事件、service 或跨插件可变状态；渲染约定由组件测试覆盖。

package/lib/Button.module.css

@@ -54,7 +54,7 @@
 
 /* Dialog Cancel (figma 451:18655): bordered capsule on transparent fill. */
 .outline {
-  border: 1px solid var(--dsw-alias-border-l2);
+  border: 0.5px solid var(--dsw-alias-border-l3);
   background: transparent;
 }
 

package/lib/Input.module.css

@@ -4,7 +4,7 @@
   gap: 6px;
   height: 32px;
   padding: 0 8px;
-  border: 1px solid var(--dsw-alias-border-l2);
+  border: 0.5px solid var(--dsw-alias-border-l4);
   border-radius: 8px;
   background: var(--dsw-alias-bg-layer-1);
 }

package/lib/Menu.module.css

@@ -4,7 +4,7 @@
 }
 
 /* Dropdown card (figma MenuDropdown 122:9481 / 419:16920): menu surface,
- * r12, inverted hairline border, shadow-lv3, 4px inset padding. */
+ * r12, elevation-prominent (hairline stroke in shadow), 4px inset padding. */
 .list,
 .submenu {
   /* min-widths below are the design's outer card widths — include the pad. */
@@ -13,10 +13,11 @@
   display: flex;
   flex-direction: column;
   gap: 0;
-  border: 1px solid var(--dsw-alias-border-inverted);
-  border-radius: 12px;
+  border: 0;
+  border-radius: 20px;
   background: var(--dsw-specific-menu);
-  box-shadow: var(--dsw-shadow-lv3);
+  --dsw-elevation-stroke-color: var(--dsw-alias-border-l1);
+  box-shadow: var(--dsw-elevation-prominent);
   /* Elevated surface: the scrollbar thumb takes the l2 elevation tokens. The
      declaration sits on the card rather than on `.scrollable .viewport`
      because the elevation is a property of this surface, and the custom
@@ -85,7 +86,7 @@
   flex-direction: column;
   margin-top: 4px;
   padding-top: 4px;
-  border-top: 1px solid var(--dsw-alias-border-l2);
+  border-top: 0.5px solid var(--dsw-alias-border-l2);
 }
 
 .itemWrap {
@@ -212,7 +213,7 @@
 
 /* Separator cell (figma 122:9481): py 4 / px 2 around the hairline. */
 .separator {
-  height: 1px;
+  height: 0.5px;
   margin: 4px 2px;
   background: var(--dsw-alias-border-l1);
 }

package/lib/Modal.module.css

@@ -18,7 +18,7 @@
   backdrop-filter: var(--dsw-mask-blur);
 }
 
-/* Dialog card: r24, shadow-lv3, layer-2 fill, inverted border, pb 24. */
+/* Dialog card: r24, elevation-prominent, layer-2 fill, pb 24. */
 .dialog {
   position: relative;
   z-index: 1;
@@ -28,10 +28,10 @@
   width: min(380px, 100%);
   padding: 0 0 24px;
   overflow: hidden;
-  border: 1px solid var(--dsw-alias-border-inverted);
+  border: 0;
   border-radius: 24px;
   background: var(--dsw-alias-bg-layer-2);
-  box-shadow: var(--dsw-shadow-lv3);
+  box-shadow: var(--dsw-elevation-prominent);
 }
 
 .content {

package/lib/StateDot.module.css

@@ -18,6 +18,7 @@
   position: absolute;
   inset: 0;
   border-radius: 50%;
+  corner-shape: round;
   background: currentColor;
   opacity: 0.1;
 }
@@ -27,6 +28,7 @@
   position: absolute;
   inset: 20%;
   border-radius: 50%;
+  corner-shape: round;
   background: currentColor;
 }
 

package/lib/TerminalBlock.module.css

@@ -62,7 +62,7 @@
    divider the IN/OUT card draws between its sections. A running card is
    banner-only, so it draws none. */
 .block:not([data-running]) .header {
-  border-bottom: 1px solid var(--dsw-alias-border-l2);
+  border-bottom: 0.5px solid var(--dsw-alias-border-l2);
 }
 
 /* One row per command line. The prompt column is the only element allowed to

package/lib/index.js

@@ -4014,7 +4014,7 @@ function runState(running, exitCode, signal, labels) {
 * @param line - the line's styled runs.
 * @returns the line's children.
 */
-function renderLine(line) {
+function renderLine$1(line) {
 	return line.map((span, index) => span.style === void 0 ? span.text : jsx("span", {
 		style: span.style,
 		children: span.text
@@ -4094,7 +4094,7 @@ function TerminalBlock({ command, cwd, home, output, exitCode, signal, running =
 			children: [
 				(capped ? lines.slice(0, headLines) : lines).map((line, index) => jsx("div", {
 					className: css$15.line,
-					children: renderLine(line)
+					children: renderLine$1(line)
 				}, index)),
 				hidden > 0 && jsx("button", {
 					type: "button",
@@ -4106,7 +4106,7 @@ function TerminalBlock({ command, cwd, home, output, exitCode, signal, running =
 				}),
 				capped && lines.slice(lines.length - tailLines).map((line, index) => jsx("div", {
 					className: css$15.line,
-					children: renderLine(line)
+					children: renderLine$1(line)
 				}, index))
 			]
 		}))]
@@ -4253,6 +4253,14 @@ const LANG_ALIASES = new Map([
 	["xml", "xml"],
 	["lua", "lua"]
 ]);
+/**
+* Whether a language hint can use the shared syntax highlighter.
+* @param lang - Language hint from a code surface.
+* @returns Whether the hint resolves to a supported grammar.
+*/
+function supportsHighlighting(lang) {
+	return lang !== void 0 && LANG_ALIASES.has(lang.toLowerCase());
+}
 /** All token colors resolve through `--shiki-*` custom properties (theme package sheets). */
 const cssVariablesTheme = createCssVariablesTheme({
 	name: "css-variables",
@@ -4435,10 +4443,11 @@ function lineSpans(line) {
 * tokenization is line-based and forward-only — a line's tokens depend only on
 * its own text and the grammar state entering it — so appended text never
 * changes a completed line's tokens. The session caches the spans of every
-* completed line together with the grammar state after them; each
-* {@link update} tokenizes newly completed text from that state, plus the
-* still-growing last line. Per-call cost therefore excludes the completed
-* prefix, and the result equals a from-scratch tokenization of the same code.
+* completed line together with the grammar state after them;
+* {@link updateFrame} reports only newly completed lines plus the still-growing
+* last line, while {@link update} materializes the complete compatibility
+* result. Per-call tokenization cost therefore excludes the completed prefix,
+* and the result equals a from-scratch tokenization of the same code.
 * Non-append input and a change of resolved grammar reset the cache and
 * re-tokenize fully, so any input stays correct.
 */
@@ -4454,11 +4463,15 @@ var StreamingHighlightSession = class {
 	lastCode;
 	lastLang;
 	lastResult;
+	generation = 0;
+	lastFrame;
 	reset(resolved) {
 		this.resolved = resolved;
 		this.prefix = "";
 		this.spans = [];
 		this.state = void 0;
+		this.generation += 1;
+		this.lastFrame = void 0;
 	}
 	/** Tokenize `text` with `resolved`, resuming from the cached grammar state when one exists. */
 	tokenize(resolved, text) {
@@ -4469,28 +4482,23 @@ var StreamingHighlightSession = class {
 		});
 	}
 	/**
-	* Tokenize the fence's current text into per-line highlighted runs;
-	* `undefined` means the caller renders its plain fallback. Idempotent per
-	* (`code`, `lang`) input — repeated calls return the identical result array —
-	* and a retained line keeps its span-array identity across growing calls, so
-	* a React caller can reuse cached line elements. A lazy grammar not yet
-	* loaded returns `undefined` and loads in the background exactly as
-	* {@link highlightToHtml} does; the next call after it registers highlights.
-	* @param code - the fence text accumulated so far (display-trimmed, no synthetic trailing newline).
-	* @param lang - the language hint (a markdown fence info string).
-	* @returns one entry per line of `code` (each an array of runs), or `undefined` for unknown or not-yet-loaded languages.
+	* Tokenize one update as a delta for a retained renderer.
+	* @param code - the fence text accumulated so far.
+	* @param lang - the language hint.
+	* @returns Newly completed lines plus the current tail, or `undefined` for the plain arm.
 	*/
-	update(code, lang) {
-		if (code === this.lastCode && lang === this.lastLang && this.lastResult !== void 0) return this.lastResult;
+	updateFrame(code, lang) {
+		if (code === this.lastCode && lang === this.lastLang && this.lastFrame !== void 0) return this.lastFrame;
 		this.lastCode = code;
 		this.lastLang = lang;
+		this.lastResult = void 0;
 		const resolved = lang === void 0 ? void 0 : LANG_ALIASES.get(lang.toLowerCase());
 		if (resolved === void 0 || !ensureGrammar(resolved)) {
 			this.reset(void 0);
-			this.lastResult = void 0;
 			return;
 		}
 		if (resolved !== this.resolved || !code.startsWith(this.prefix)) this.reset(resolved);
+		const firstNewLine = this.spans.length;
 		const rest = code.slice(this.prefix.length);
 		const lastNewline = rest.lastIndexOf("\n");
 		if (lastNewline >= 0) {
@@ -4500,7 +4508,30 @@ var StreamingHighlightSession = class {
 			this.state = highlighter().getLastGrammarState(tokens);
 			this.prefix = code.slice(0, this.prefix.length + lastNewline + 1);
 		}
-		this.lastResult = [...this.spans, ...this.tokenize(resolved, rest.slice(lastNewline + 1)).map(lineSpans)];
+		this.lastFrame = {
+			generation: this.generation,
+			appended: this.spans.slice(firstNewLine),
+			tail: this.tokenize(resolved, rest.slice(lastNewline + 1)).map(lineSpans)
+		};
+		return this.lastFrame;
+	}
+	/**
+	* Tokenize the fence's current text into per-line highlighted runs;
+	* `undefined` means the caller renders its plain fallback. Idempotent per
+	* (`code`, `lang`) input — repeated calls return the identical result array —
+	* and a retained line keeps its span-array identity across growing calls, so
+	* a React caller can reuse cached line elements. A lazy grammar not yet
+	* loaded returns `undefined` and loads in the background exactly as
+	* {@link highlightToHtml} does; the next call after it registers highlights.
+	* @param code - the fence text accumulated so far (display-trimmed, no synthetic trailing newline).
+	* @param lang - the language hint (a markdown fence info string).
+	* @returns one entry per line of `code` (each an array of runs), or `undefined` for unknown or not-yet-loaded languages.
+	*/
+	update(code, lang) {
+		if (code === this.lastCode && lang === this.lastLang && this.lastResult !== void 0) return this.lastResult;
+		const frame = this.updateFrame(code, lang);
+		if (frame === void 0) return void 0;
+		this.lastResult = [...this.spans, ...frame.tail];
 		return this.lastResult;
 	}
 };
@@ -4535,6 +4566,73 @@ function highlightLines(code, lang) {
 	})));
 }
 //#endregion
+//#region lib/types/markdown/useViewportHighlighting.js
+const noop = () => {};
+/** One document-wide observer; activated elements leave it permanently. */
+var HighlightViewport = class {
+	observer;
+	activators = /* @__PURE__ */ new Map();
+	observe(element, activate) {
+		if (typeof IntersectionObserver === "undefined") {
+			activate();
+			return noop;
+		}
+		this.observer ??= new IntersectionObserver((entries) => {
+			for (const entry of entries) {
+				if (!entry.isIntersecting) continue;
+				const current = this.activators.get(entry.target);
+				/* v8 ignore next -- the observer reports only elements still registered with it. */
+				if (current === void 0) continue;
+				this.activators.delete(entry.target);
+				this.observer?.unobserve(entry.target);
+				current();
+			}
+			this.releaseEmptyObserver();
+		});
+		this.activators.set(element, activate);
+		this.observer.observe(element);
+		return () => {
+			this.activators.delete(element);
+			this.observer?.unobserve(element);
+			this.releaseEmptyObserver();
+		};
+	}
+	releaseEmptyObserver() {
+		if (this.activators.size > 0) return;
+		this.observer?.disconnect();
+		this.observer = void 0;
+	}
+};
+const highlightViewport = new HighlightViewport();
+/**
+* Activate one supported code surface when it first intersects the viewport.
+* Activation lasts for the component lifetime; browsers without
+* IntersectionObserver activate immediately.
+* @param target - Code surface whose plain rendering reserves its geometry.
+* @param lang - Optional language hint.
+* @returns Whether this component may build highlighted output.
+*/
+function useViewportHighlighting(target, lang) {
+	const supported = supportsHighlighting(lang);
+	const [activated, setActivated] = useState(false);
+	const activate = useCallback(() => {
+		setActivated(true);
+	}, []);
+	useEffect(() => {
+		if (activated || !supported) return;
+		const element = target.current;
+		/* v8 ignore next -- React attaches the host ref before running effects. */
+		if (element === null) return;
+		return highlightViewport.observe(element, activate);
+	}, [
+		activate,
+		activated,
+		supported,
+		target
+	]);
+	return activated && supported;
+}
+//#endregion
 //#region lib/types/ReadBlock.js
 /**
 * Content lines shown before the height cap collapses the middle. Matches
@@ -4555,8 +4653,11 @@ function renderSpans(spans) {
 * @returns the read block element.
 */
 function ReadBlock({ label, labels, lines, totalLines, lang, maxLines = 16, className }) {
+	const rootRef = useRef(null);
+	const highlighting = useViewportHighlighting(rootRef, lang);
 	const raw = useMemo(() => lines.map((line) => line.text).join("\n"), [lines]);
-	const highlighted = useMemo(() => highlightLines(raw, lang), [
+	const highlighted = useMemo(() => highlighting ? highlightLines(raw, lang) : void 0, [
+		highlighting,
 		raw,
 		lang,
 		useSyncExternalStore(subscribeGrammarLoaded, grammarLoadCount, grammarLoadCount)
@@ -4594,6 +4695,7 @@ function ReadBlock({ label, labels, lines, totalLines, lang, maxLines = 16, clas
 	}, line.number));
 	const paired = lines.map((line, index) => [line, highlighted?.[index]]);
 	return jsxs("div", {
+		ref: rootRef,
 		className: clsx(css$16.block, className),
 		"data-read": "",
 		children: [jsxs("div", {
@@ -5009,19 +5111,23 @@ function SearchBlock(props) {
 * Re-parsing the whole accumulated document on every streaming chunk is
 * quadratic in the final reply length. CommonMark block parsing is line-based
 * and appended text can only reshape the parse frontier — the last top-level
-* block (a paragraph becoming a setext heading or a table, a list continuing
-* after a blank line, an unclosed fence swallowing lines) — so earlier blocks
-* are final. This parser therefore freezes all but the trailing
-* {@link UNSTABLE_TAIL_BLOCKS} blocks and re-parses only the source tail
-* behind them: each source region is parsed O(1) times over the stream
-* instead of once per chunk.
+* block (a paragraph becoming a setext heading or a table, or a list
+* continuing after a blank line) — so earlier blocks are final. This parser
+* therefore freezes all but the trailing {@link UNSTABLE_TAIL_BLOCKS} blocks
+* and re-parses only the source tail behind them. A final unclosed top-level
+* fence cannot freeze as a block, so its completed content lines use a second
+* frontier: only the last completed line and current partial line return
+* through the caller's grammar. Each source region is therefore parsed a
+* bounded number of times over the stream instead of once per chunk.
 *
-* The freeze boundary comes from the parser's own `position` offsets, never
-* from custom source scanning. The cut sits at the *end offset* of the last
-* frozen block (not the next block's start): a following block's start offset
-* excludes up to three spaces of insignificant leading indentation, which is
-* harmless to drop, but cutting at the previous end also keeps the
-* inter-block blank lines in the tail so the sliced source stays verbatim.
+* The block freeze boundary comes from the parser's own `position` offsets.
+* The cut sits at the *end offset* of the last frozen block (not the next
+* block's start): a following block's start offset excludes up to three spaces
+* of insignificant leading indentation, which is harmless to drop, but
+* cutting at the previous end also keeps the inter-block blank lines in the
+* tail so the sliced source stays verbatim. Fence scanning only recognizes a
+* parser-confirmed code node and closing delimiter; ambiguous input returns to
+* the normal tail parse.
 *
 * Known deviation, shared with any prefix-freeze scheme: micromark resolves
 * reference-style links and footnotes document-wide at parse time, so a
@@ -5046,6 +5152,84 @@ function blockKey(node, base, index) {
 	const offset = node.position?.start.offset;
 	return offset === void 0 ? -(index + 1) : base + offset;
 }
+/** Return the first line terminator at or after `start`, including a CRLF pair. */
+function lineTerminatorEnd(text, start) {
+	for (let index = start; index < text.length; index += 1) {
+		const char = text[index];
+		if (char === "\n") return index + 1;
+		if (char === "\r") return text[index + 1] === "\n" ? index + 2 : index + 1;
+	}
+}
+/**
+* Source prefix before the last completed line. Keeping that line beside the
+* current partial line lets the grammar retain its trailing-newline semantics.
+*/
+function committableLinePrefixLength(text) {
+	let previousEnd = 0;
+	let end = 0;
+	for (let index = 0; index < text.length; index += 1) {
+		const char = text[index];
+		if (char === "\n") {
+			previousEnd = end;
+			end = index + 1;
+			continue;
+		}
+		if (char !== "\r" || index + 1 >= text.length) continue;
+		if (text[index + 1] === "\n") index += 1;
+		previousEnd = end;
+		end = index + 1;
+	}
+	return previousEnd;
+}
+/** Exact source terminator ending a non-empty committable prefix. */
+function trailingLineTerminator(text) {
+	return text.endsWith("\r\n") ? "\r\n" : text.endsWith("\r") ? "\r" : "\n";
+}
+/** Whether `text` contains a CommonMark closing fence on one of its logical lines. */
+function containsClosingFence(text, marker, markerLength) {
+	let start = 0;
+	while (start <= text.length) {
+		let end = start;
+		while (end < text.length && text[end] !== "\n" && text[end] !== "\r") end += 1;
+		const line = text.slice(start, end);
+		let indent = 0;
+		while (indent < 3 && line[indent] === " ") indent += 1;
+		let run = indent;
+		while (line[run] === marker) run += 1;
+		if (run - indent >= markerLength && /^[ \t]*$/.test(line.slice(run))) return true;
+		if (end === text.length) return false;
+		start = text[end] === "\r" && text[end + 1] === "\n" ? end + 2 : end + 1;
+	}
+	/* v8 ignore next -- each loop iteration returns at EOF or advances past a line terminator. */
+	return false;
+}
+/** Advance an mdast point across one append while treating a split CRLF as one line ending. */
+function advancePoint(point, appended, precededByCarriageReturn) {
+	let line = point.line;
+	let column = point.column;
+	let afterCarriageReturn = precededByCarriageReturn;
+	for (const char of appended) {
+		if (char === "\n") {
+			if (!afterCarriageReturn) line += 1;
+			column = 1;
+			afterCarriageReturn = false;
+			continue;
+		}
+		if (char === "\r") {
+			line += 1;
+			column = 1;
+			afterCarriageReturn = true;
+			continue;
+		}
+		column += 1;
+		afterCarriageReturn = false;
+	}
+	return {
+		line,
+		column,
+		offset: point.offset + appended.length
+	};
+}
 /**
 * Append-only incremental parser over a caller-supplied grammar. One instance
 * accumulates one streaming document; non-append input resets it.
@@ -5057,10 +5241,112 @@ var IncrementalMarkdownParser = class {
 	frozen = [];
 	generation = 0;
 	cached = null;
+	openFence = null;
 	/** @param parse - Grammar shared with whatever renders the blocks, so boundaries agree. */
 	constructor(parse) {
 		this.parse = parse;
 	}
+	/** Parse one unclosed-fence content slice through the caller's grammar. */
+	fenceValue(state, text) {
+		const root = this.parse(`${state.syntheticPrefix}${text}`);
+		if (root.children.length !== 1) return void 0;
+		const node = root.children[0];
+		return node.type === "code" ? node.value : void 0;
+	}
+	/** Recognize the parsed tail's final unclosed fence and prepare its incremental content frontier. */
+	openFenceState(text, base, tail, frozen) {
+		const codeIndex = tail.length - 1;
+		const block = tail[codeIndex];
+		if (block?.node.type !== "code") return null;
+		const node = block.node;
+		const startOffset = node.position?.start.offset;
+		const end = node.position?.end;
+		if (startOffset === void 0 || end?.offset === void 0) return null;
+		/* v8 ignore next -- the caller's parse slice ends at text.length, so its final node ends there. */
+		if (base + end.offset !== text.length) return null;
+		const source = text.slice(base);
+		const previousLf = source.lastIndexOf("\n", startOffset - 1);
+		const previousCr = source.lastIndexOf("\r", startOffset - 1);
+		const lineStart = Math.max(previousLf, previousCr) + 1;
+		const terminatorEnd = lineTerminatorEnd(source, startOffset);
+		/* v8 ignore next -- a parser-confirmed fenced code node requires its opening line terminator. */
+		if (terminatorEnd === void 0) return null;
+		if (terminatorEnd === source.length && source.endsWith("\r")) return null;
+		const openingLine = source.slice(lineStart, terminatorEnd).replace(/[\r\n]+$/, "");
+		const opening = /^( {0,3})(`{3,}|~{3,})/.exec(openingLine);
+		if (opening === null) return null;
+		const indent = opening[1];
+		const run = opening[2];
+		/* v8 ignore next -- mdast positions a fenced code node at the matched delimiter after indentation. */
+		if (lineStart + indent.length !== startOffset) return null;
+		const marker = run[0];
+		const contentStart = base + terminatorEnd;
+		const content = text.slice(contentStart);
+		if (containsClosingFence(content, marker, run.length)) return null;
+		const syntheticPrefix = `${indent}${run}\n`;
+		const stableLength = committableLinePrefixLength(content);
+		const stableValue = stableLength === 0 ? "" : this.fenceValue({ syntheticPrefix }, content.slice(0, stableLength));
+		if (stableValue === void 0) return null;
+		const pendingStart = contentStart + stableLength;
+		const stableSource = content.slice(0, stableLength);
+		const valuePrefix = stableLength === 0 ? "" : `${stableValue}${trailingLineTerminator(stableSource)}`;
+		const pendingValue = this.fenceValue({ syntheticPrefix }, text.slice(pendingStart));
+		if (pendingValue === void 0 || `${valuePrefix}${pendingValue}` !== node.value) return null;
+		return {
+			marker,
+			markerLength: run.length,
+			syntheticPrefix,
+			codeIndex,
+			frozen,
+			tail,
+			pendingStart,
+			valuePrefix,
+			end: {
+				line: end.line,
+				column: end.column,
+				offset: end.offset
+			},
+			endedWithCarriageReturn: text.endsWith("\r")
+		};
+	}
+	/** Extend a recognized unclosed fence without parsing its completed content prefix again. */
+	updateOpenFence(state, text, previousText) {
+		const pending = text.slice(state.pendingStart);
+		if (containsClosingFence(pending, state.marker, state.markerLength)) return void 0;
+		const pendingValue = this.fenceValue(state, pending);
+		if (pendingValue === void 0) return void 0;
+		const stableLength = committableLinePrefixLength(pending);
+		const stableValue = stableLength === 0 ? "" : this.fenceValue(state, pending.slice(0, stableLength));
+		if (stableValue === void 0) return void 0;
+		const previousNode = state.tail[state.codeIndex].node;
+		const end = advancePoint(state.end, text.slice(previousText.length), state.endedWithCarriageReturn);
+		const node = {
+			...previousNode,
+			value: `${state.valuePrefix}${pendingValue}`,
+			position: {
+				start: previousNode.position.start,
+				end
+			}
+		};
+		const tail = state.tail.map((entry, index) => index === state.codeIndex ? {
+			...entry,
+			node
+		} : entry);
+		const cached = {
+			frozen: state.frozen,
+			tail,
+			generation: this.generation
+		};
+		this.openFence = {
+			...state,
+			tail,
+			pendingStart: state.pendingStart + stableLength,
+			valuePrefix: stableLength === 0 ? state.valuePrefix : `${state.valuePrefix}${stableValue}${trailingLineTerminator(pending.slice(0, stableLength))}`,
+			end,
+			endedWithCarriageReturn: text.endsWith("\r")
+		};
+		return cached;
+	}
 	/**
 	* Fold the current accumulated text and return the frozen/tail split.
 	* Idempotent for identical input (the previous result is returned as-is),
@@ -5074,8 +5360,19 @@ var IncrementalMarkdownParser = class {
 			this.prevText = "";
 			this.tailStart = 0;
 			this.frozen = [];
+			this.openFence = null;
 			this.generation += 1;
 		}
+		const previousText = this.prevText;
+		if (previousText !== "" && this.openFence !== null) {
+			const incremental = this.updateOpenFence(this.openFence, text, previousText);
+			if (incremental !== void 0) {
+				this.prevText = text;
+				this.cached = incremental;
+				return incremental;
+			}
+			this.openFence = null;
+		}
 		this.prevText = text;
 		const base = this.tailStart;
 		const blocks = this.parse(text.slice(base)).children;
@@ -5100,6 +5397,7 @@ var IncrementalMarkdownParser = class {
 			tail,
 			generation: this.generation
 		};
+		this.openFence = this.openFenceState(text, base, tail, this.cached.frozen);
 		return this.cached;
 	}
 };
@@ -5488,52 +5786,100 @@ const SHIKI_PRE_PROPS = {
 	},
 	tabIndex: 0
 };
+/** Completed-line group size; React reconciles groups while the DOM remains line-for-line identical. */
+const STREAMING_LINE_GROUP_SIZE = 32;
+function renderLine(line, index) {
+	return jsxs(Fragment$1, { children: [index > 0 && "\n", jsx("span", {
+		className: "line",
+		children: line.map((span, spanIndex) => jsx("span", {
+			style: span.style,
+			children: span.text
+		}, spanIndex))
+	})] }, index);
+}
 function CodeBlock({ code, lang, streaming, className, copyLabel, copiedLabel }) {
 	const trimmed = code.endsWith("\n") ? code.slice(0, -1) : code;
+	const rootRef = useRef(null);
+	const highlighting = useViewportHighlighting(rootRef, lang);
 	const loaded = useSyncExternalStore(subscribeGrammarLoaded, grammarLoadCount, grammarLoadCount);
-	const html = useMemo(() => streaming === true ? void 0 : highlightToHtml(trimmed, lang), [
-		streaming,
-		trimmed,
-		lang,
-		loaded
-	]);
 	const sessionRef = useRef(null);
 	const lineCacheRef = useRef(null);
+	const settledRef = useRef(false);
 	const streamedBody = useMemo(() => {
+		if (!highlighting) {
+			sessionRef.current = null;
+			lineCacheRef.current = null;
+			settledRef.current = false;
+			return;
+		}
 		if (streaming !== true) {
+			const previous = lineCacheRef.current;
+			if (previous !== null && previous.code === trimmed && previous.lang === lang) {
+				settledRef.current = true;
+				return previous.body;
+			}
 			sessionRef.current = null;
 			lineCacheRef.current = null;
+			settledRef.current = true;
 			return;
 		}
+		if (settledRef.current) {
+			sessionRef.current = null;
+			lineCacheRef.current = null;
+			settledRef.current = false;
+		}
 		sessionRef.current ??= new StreamingHighlightSession();
-		const lines = sessionRef.current.update(trimmed, lang);
-		if (lines === void 0) {
+		const frame = sessionRef.current.updateFrame(trimmed, lang);
+		if (frame === void 0) {
 			lineCacheRef.current = null;
 			return;
 		}
 		const previous = lineCacheRef.current;
-		const elements = lines.map((line, index) => previous !== null && previous.lines[index] === line ? previous.elements[index] : jsxs(Fragment$1, { children: [index > 0 && "\n", jsx("span", {
-			className: "line",
-			children: line.map((span, spanIndex) => jsx("span", {
-				style: span.style,
-				children: span.text
-			}, spanIndex))
-		})] }, index));
-		lineCacheRef.current = {
-			lines,
-			elements
-		};
-		return jsx("pre", {
+		if (previous?.frame === frame && previous.code === trimmed && previous.lang === lang) return previous.body;
+		const sameGeneration = previous?.generation === frame.generation;
+		const groups = sameGeneration ? [...previous.groups] : [];
+		let pending = sameGeneration ? [...previous.pending] : [];
+		let nextLine = sameGeneration ? previous.nextLine : 0;
+		for (const line of frame.appended) {
+			pending.push(renderLine(line, nextLine));
+			nextLine += 1;
+			if (pending.length !== STREAMING_LINE_GROUP_SIZE) continue;
+			const start = nextLine - pending.length;
+			groups.push(jsx(Fragment$1, { children: pending }, start));
+			pending = [];
+		}
+		const tail = frame.tail.map((line, index) => renderLine(line, nextLine + index));
+		const tailGroup = jsx(Fragment$1, { children: [...pending, ...tail] }, nextLine - pending.length);
+		const body = jsx("pre", {
 			...SHIKI_PRE_PROPS,
-			children: jsx("code", { children: elements })
+			children: jsxs("code", { children: [groups, tailGroup] })
 		});
+		lineCacheRef.current = {
+			code: trimmed,
+			lang,
+			generation: frame.generation,
+			frame,
+			groups,
+			pending,
+			nextLine,
+			body
+		};
+		return body;
 	}, [
 		streaming,
+		highlighting,
+		trimmed,
+		lang,
+		loaded
+	]);
+	const html = useMemo(() => highlighting && streaming !== true && streamedBody === void 0 ? highlightToHtml(trimmed, lang) : void 0, [
+		streaming,
+		highlighting,
+		streamedBody,
 		trimmed,
 		lang,
 		loaded
 	]);
-	const rootRef = useRef(null);
 	const [copied, setCopied] = useState(false);
 	const onCopy = useCallback(() => {
 		if (copied) return;
@@ -6039,7 +6385,8 @@ function renderSettled(text, labels, fileMentions) {
 	};
 	const blocks = wrapBlockChildren(renderBlocks(root.children.map((node, index) => ({
 		node,
-		key: index
+		/* v8 ignore next -- parseFull uses parseGfm, which stamps every top-level node. */
+		key: node.position?.start.offset ?? -(index + 1)
 	})), context), false);
 	const section = renderFootnoteSection(context);
 	return section === null ? blocks : [

package/lib/markdown/JsonBlock.module.css

@@ -23,7 +23,7 @@
   max-height: 200px;
   overflow: auto;
   background: var(--dsw-alias-markdown-code-block);
-  border: 1px solid var(--dsw-alias-border-l1);
+  border: 0.5px solid var(--dsw-alias-border-l1);
   border-radius: 6px;
   font-family: var(--ds-font-family-code);
   font-size: 11px;

package/lib/markdown/MarkdownText.module.css

@@ -126,7 +126,7 @@
 .markdown hr {
   display: block;
   border: none;
-  height: 1px;
+  height: 0.5px;
   margin: 32px 0;
   background: var(--dsw-alias-border-l2);
 }
@@ -225,7 +225,7 @@
 .tableScroll th {
   text-align: start;
   padding: 10px 16px;
-  border-bottom: 1px solid var(--dsw-alias-border-l3);
+  border-bottom: 0.5px solid var(--dsw-alias-border-l3);
   border-top: none;
   font: var(--dsw-font-markdown-table-head);
   max-width: 320px;
@@ -235,7 +235,7 @@
 
 .tableScroll td {
   padding: 10px 16px;
-  border-bottom: 1px solid var(--dsw-alias-border-l2);
+  border-bottom: 0.5px solid var(--dsw-alias-border-l2);
   font: var(--dsw-font-markdown-table);
   max-width: 320px;
   max-width: min(30vw, 320px);

package/lib/types/markdown/CodeBlock.d.ts

@@ -6,9 +6,10 @@ export interface CodeBlockProps {
     /**
      * The code is still growing (a streaming markdown fence): highlight through
      * a per-instance {@link StreamingHighlightSession}, which re-tokenizes only
-     * appended text and keeps completed lines' elements (and DOM) untouched.
-     * The caller must keep the component instance stable across growth (a
-     * stream-stable React key); settled callers omit this and get shiki's HTML.
+     * appended text and keeps completed line groups (and DOM) untouched. The
+     * caller must keep the component instance stable across growth (a
+     * stream-stable React key); an unchanged streamed fence also retains that
+     * tree when it settles. Cold settled callers get shiki's HTML.
      */
     streaming?: boolean | undefined;
     /** Extra class merged onto the wrapper (callers position; this component draws). */

package/lib/types/markdown/highlight.d.ts

@@ -18,6 +18,12 @@
  * highlighting, still monospace) — never an error.
  */
 import type { CSSProperties } from 'react';
+/**
+ * Whether a language hint can use the shared syntax highlighter.
+ * @param lang - Language hint from a code surface.
+ * @returns Whether the hint resolves to a supported grammar.
+ */
+export declare function supportsHighlighting(lang: string | undefined): boolean;
 /**
  * Subscribe to lazy-grammar load completions; `listener` fires after a
  * {@link LAZY_GRAMMARS} grammar finishes registering on the singleton, so a
@@ -61,10 +67,11 @@ export interface HighlightSpan {
  * tokenization is line-based and forward-only — a line's tokens depend only on
  * its own text and the grammar state entering it — so appended text never
  * changes a completed line's tokens. The session caches the spans of every
- * completed line together with the grammar state after them; each
- * {@link update} tokenizes newly completed text from that state, plus the
- * still-growing last line. Per-call cost therefore excludes the completed
- * prefix, and the result equals a from-scratch tokenization of the same code.
+ * completed line together with the grammar state after them;
+ * {@link updateFrame} reports only newly completed lines plus the still-growing
+ * last line, while {@link update} materializes the complete compatibility
+ * result. Per-call tokenization cost therefore excludes the completed prefix,
+ * and the result equals a from-scratch tokenization of the same code.
  * Non-append input and a change of resolved grammar reset the cache and
  * re-tokenize fully, so any input stays correct.
  */
@@ -80,9 +87,18 @@ export declare class StreamingHighlightSession {
     private lastCode;
     private lastLang;
     private lastResult;
+    private generation;
+    private lastFrame;
     private reset;
     /** Tokenize `text` with `resolved`, resuming from the cached grammar state when one exists. */
     private tokenize;
+    /**
+     * Tokenize one update as a delta for a retained renderer.
+     * @param code - the fence text accumulated so far.
+     * @param lang - the language hint.
+     * @returns Newly completed lines plus the current tail, or `undefined` for the plain arm.
+     */
+    updateFrame(code: string, lang: string | undefined): StreamingHighlightFrame | undefined;
     /**
      * Tokenize the fence's current text into per-line highlighted runs;
      * `undefined` means the caller renders its plain fallback. Idempotent per
@@ -97,6 +113,15 @@ export declare class StreamingHighlightSession {
      */
     update(code: string, lang: string | undefined): readonly HighlightSpan[][] | undefined;
 }
+/** One retained-renderer update from {@link StreamingHighlightSession.updateFrame}. */
+export interface StreamingHighlightFrame {
+    /** Changes whenever prior completed lines must be discarded. */
+    readonly generation: number;
+    /** Completed lines added since the preceding frame in this generation. */
+    readonly appended: readonly HighlightSpan[][];
+    /** The still-growing final line or lines, replaced by the next frame. */
+    readonly tail: readonly HighlightSpan[][];
+}
 /**
  * Tokenize `code` into per-line highlighted runs when `lang` maps to a
  * registered grammar; `undefined` means the caller renders its plain fallback.

package/lib/types/markdown/incremental.d.ts

@@ -4,19 +4,23 @@
  * Re-parsing the whole accumulated document on every streaming chunk is
  * quadratic in the final reply length. CommonMark block parsing is line-based
  * and appended text can only reshape the parse frontier — the last top-level
- * block (a paragraph becoming a setext heading or a table, a list continuing
- * after a blank line, an unclosed fence swallowing lines) — so earlier blocks
- * are final. This parser therefore freezes all but the trailing
- * {@link UNSTABLE_TAIL_BLOCKS} blocks and re-parses only the source tail
- * behind them: each source region is parsed O(1) times over the stream
- * instead of once per chunk.
+ * block (a paragraph becoming a setext heading or a table, or a list
+ * continuing after a blank line) — so earlier blocks are final. This parser
+ * therefore freezes all but the trailing {@link UNSTABLE_TAIL_BLOCKS} blocks
+ * and re-parses only the source tail behind them. A final unclosed top-level
+ * fence cannot freeze as a block, so its completed content lines use a second
+ * frontier: only the last completed line and current partial line return
+ * through the caller's grammar. Each source region is therefore parsed a
+ * bounded number of times over the stream instead of once per chunk.
  *
- * The freeze boundary comes from the parser's own `position` offsets, never
- * from custom source scanning. The cut sits at the *end offset* of the last
- * frozen block (not the next block's start): a following block's start offset
- * excludes up to three spaces of insignificant leading indentation, which is
- * harmless to drop, but cutting at the previous end also keeps the
- * inter-block blank lines in the tail so the sliced source stays verbatim.
+ * The block freeze boundary comes from the parser's own `position` offsets.
+ * The cut sits at the *end offset* of the last frozen block (not the next
+ * block's start): a following block's start offset excludes up to three spaces
+ * of insignificant leading indentation, which is harmless to drop, but
+ * cutting at the previous end also keeps the inter-block blank lines in the
+ * tail so the sliced source stays verbatim. Fence scanning only recognizes a
+ * parser-confirmed code node and closing delimiter; ambiguous input returns to
+ * the normal tail parse.
  *
  * Known deviation, shared with any prefix-freeze scheme: micromark resolves
  * reference-style links and footnotes document-wide at parse time, so a
@@ -55,8 +59,15 @@ export declare class IncrementalMarkdownParser {
     private frozen;
     private generation;
     private cached;
+    private openFence;
     /** @param parse - Grammar shared with whatever renders the blocks, so boundaries agree. */
     constructor(parse: (text: string) => Root);
+    /** Parse one unclosed-fence content slice through the caller's grammar. */
+    private fenceValue;
+    /** Recognize the parsed tail's final unclosed fence and prepare its incremental content frontier. */
+    private openFenceState;
+    /** Extend a recognized unclosed fence without parsing its completed content prefix again. */
+    private updateOpenFence;
     /**
      * Fold the current accumulated text and return the frozen/tail split.
      * Idempotent for identical input (the previous result is returned as-is),

package/lib/types/markdown/useViewportHighlighting.d.ts

@@ -0,0 +1,11 @@
+import type { RefObject } from 'react';
+/**
+ * Activate one supported code surface when it first intersects the viewport.
+ * Activation lasts for the component lifetime; browsers without
+ * IntersectionObserver activate immediately.
+ * @param target - Code surface whose plain rendering reserves its geometry.
+ * @param lang - Optional language hint.
+ * @returns Whether this component may build highlighted output.
+ */
+export declare function useViewportHighlighting(target: RefObject<Element>, lang: string | undefined): boolean;
+//# sourceMappingURL=useViewportHighlighting.d.ts.map

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@deepseek-ai/dsh-client-ui-primitives",
   "description": "Pure React atoms for the dsh web UI: controls, icons, markdown, and JSON inspectors (zero cordis)",
-  "version": "0.1.2-alpha.2",
+  "version": "0.1.2-alpha.4",
   "publishConfig": {
     "access": "public"
   },
@@ -18,10 +18,6 @@
       "types": "./lib/types/index.d.ts",
       "default": "./lib/index.js"
     },
-    "./invariant": {
-      "types": "./lib/types/invariant.d.ts",
-      "default": "./lib/invariant.js"
-    },
     "./src/*": "./src/*",
     "./package.json": "./package.json"
   },
@@ -51,12 +47,10 @@
   "devDependencies": {
     "@types/react": "~18.3.1",
     "@types/react-dom": "~18.3.0",
-    "@deepseek-ai/dsh-invariants": "^0.1.2-alpha.2",
     "@deepseek-ai/cordis": "^4.0.2"
   },
   "files": [
     "lib/index.js",
-    "lib/invariant.js",
     "lib/**/*.css",
     "lib/types/**/*.d.ts"
   ],

package/lib/invariant.js

@@ -1,26 +0,0 @@
-//#region lib/types/invariant.js
-/**
-* Package-owned invariant companion for `@deepseek-ai/dsh-client-ui-primitives`.
-* @module @deepseek-ai/dsh-client-ui-primitives/invariant
-*/
-const PACKAGE_NAME = "@deepseek-ai/dsh-client-ui-primitives";
-/** Cordis companion plugin name. */
-const name = "client-ui-primitives-invariant";
-/** Service required before the companion can reserve package ownership. */
-const inject = ["invariants"];
-/**
-* No runtime invariant: pure props-in React atoms with no Cordis API —
-* no events, no services, no mutable cross-plugin state; rendering contracts
-* are asserted directly by this package's component specs.
-*/
-const install = () => {};
-/**
-* Register this package's invariant companion.
-* @param ctx - Cordis context carrying the invariant service.
-* @returns the installed registration's disposer after setup succeeds.
-*/
-const apply = (ctx) => Promise.resolve(ctx.invariants.register(PACKAGE_NAME, install));
-//#endregion
-export { apply, inject, name };
-
-//# sourceMappingURL=invariant.js.map

package/lib/types/invariant.d.ts

@@ -1,16 +0,0 @@
-/**
- * Package-owned invariant companion for `@deepseek-ai/dsh-client-ui-primitives`.
- * @module @deepseek-ai/dsh-client-ui-primitives/invariant
- */
-import type { Context } from '@deepseek-ai/cordis';
-/** Cordis companion plugin name. */
-export declare const name = "client-ui-primitives-invariant";
-/** Service required before the companion can reserve package ownership. */
-export declare const inject: string[];
-/**
- * Register this package's invariant companion.
- * @param ctx - Cordis context carrying the invariant service.
- * @returns the installed registration's disposer after setup succeeds.
- */
-export declare const apply: (ctx: Context) => Promise<() => void>;
-//# sourceMappingURL=invariant.d.ts.map