@deepseek-ai/dsh-client-ui-primitives 0.1.6-alpha.1 → 0.1.6-alpha.2

package/lib/markdown/MarkdownText.module.css

@@ -1,6 +1,6 @@
 /* Visual baseline: deepsuite `@deepseek/md` markdown.css, adapted to CSS
-   Modules. Cite pills, header anchors, and thinking-small variants are
-   intentionally absent (no matching DOM). Token names match that sheet. */
+   Modules. Cite pills and header anchors are absent (no matching DOM).
+   Token names match that sheet. */
 
 .markdown {
   min-width: 0;
@@ -55,7 +55,8 @@
   margin-bottom: 8px;
 }
 
-.markdown a {
+.markdown a,
+.markdown .fileLink {
   /* deepsuite markdown.css uses brand-text (blue in newDesign); this sheet
      keeps design-platform brand-text as near-black, so links use the
      dedicated link alias instead. */
@@ -80,7 +81,8 @@
   text-underline-offset: 3px;
 }
 
-.markdown a:focus-visible {
+.markdown a:focus-visible,
+.fileMention:focus-visible {
   box-shadow: 0 0 0 2px var(--dsw-alias-state-business-primary);
 }
 
@@ -314,9 +316,147 @@
   cursor: pointer;
 }
 
+.fileLink {
+  max-width: 100%;
+  text-align: inherit;
+}
+
 .fileMention:hover,
 .fileMention:focus {
   outline: none;
   text-decoration: underline dotted var(--dsw-alias-link);
   text-underline-offset: 3px;
 }
+
+.compact {
+  max-width: 100%;
+  font-size: var(--dsh-content-font-size-secondary, 13px);
+  line-height: calc(20px + var(--dsh-content-font-delta-secondary, 0px));
+  color: var(--dsw-alias-label-tertiary);
+}
+
+.compact :is(h1, h2, h3, h4, h5, h6) {
+  margin: 8px 0 4px;
+  font: inherit;
+  font-weight: 600;
+  color: inherit;
+}
+
+.compact :is(p, ul, ol, blockquote) {
+  margin: 4px 0;
+}
+
+.compact li:not(:first-child) {
+  margin-top: 2px;
+}
+
+.compact li > p {
+  margin: 4px 0;
+}
+
+.compact li::marker {
+  line-height: inherit;
+  color: inherit;
+}
+
+.compact blockquote {
+  padding-left: 8px;
+}
+
+.compact hr {
+  margin: 8px 0;
+}
+
+.compact a,
+.compact .fileMention {
+  font-weight: inherit;
+  color: inherit;
+  text-decoration: underline dotted;
+}
+
+.compact a:hover,
+.compact a:focus,
+.compact .fileMention:hover,
+.compact .fileMention:focus {
+  text-decoration-color: currentColor;
+}
+
+.compact :not(pre) > code {
+  display: inline;
+  font: inherit;
+  font-family: var(--ds-font-family-code);
+  font-size: 1em !important;
+  border-radius: 4px;
+  padding: 0 3px;
+  box-decoration-break: clone;
+}
+
+.markdown.compact :global(.md-code-block) {
+  margin: 4px 0;
+  color: inherit;
+}
+
+.compact :global(.md-code-block) > :has(> [data-code-block-banner]) {
+  position: static;
+  z-index: auto;
+}
+
+.compact [data-code-block-banner] {
+  padding: 4px 8px;
+  font: inherit;
+}
+
+.compact [data-code-block-banner] > :first-child {
+  font-size: inherit;
+  line-height: inherit;
+  color: inherit;
+}
+
+.compact pre {
+  margin: 4px 0;
+  padding: 8px;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+/* Shiki writes token colors inline; compact code uses the surrounding text color. */
+.compact pre,
+.compact pre :is(code, span) {
+  color: inherit !important;
+}
+
+.markdown.compact .tableScroll {
+  width: 100%;
+  max-width: 100%;
+  margin: 4px 0;
+  padding-left: 0;
+}
+
+.markdown.compact .tableScroll > table {
+  z-index: auto;
+}
+
+.compact :is(th, td) {
+  padding: 4px 8px;
+  font: inherit;
+}
+
+.compact th {
+  font-weight: 600;
+}
+
+.compact :global(.katex) {
+  font-size: 1em;
+}
+
+/* Keep KaTeX's inline baseline and scroll the containing block only when needed. */
+.compact :is(p, h1, h2, h3, h4, h5, h6, ul, ol):has(:global(.katex)) {
+  overflow-x: auto;
+  overflow-y: hidden;
+  /* KaTeX descenders can paint one pixel below a fractional line-box edge. */
+  padding-bottom: 1px;
+}
+
+.compact :global(.katex-display) {
+  margin: 4px 0;
+}

package/lib/types/Checkbox.d.ts

@@ -0,0 +1,20 @@
+/** Controlled native checkbox with a caller-owned visible and accessible label. */
+/**
+ * Render a labeled checkbox with native keyboard and form semantics.
+ * @param props.checked - current checked state.
+ * @param props.onChange - receives the requested checked state.
+ * @param props.label - localized visible and accessible label.
+ * @param props.disabled - whether the control refuses changes.
+ * @param props.title - optional localized hover text.
+ * @param props.className - extra class for the label's placement.
+ * @returns the label containing its checkbox.
+ */
+export declare function Checkbox({ checked, onChange, label, disabled, title, className }: {
+    checked: boolean;
+    onChange: (next: boolean) => void;
+    label: string;
+    disabled?: boolean;
+    title?: string | undefined;
+    className?: string | undefined;
+}): import("react").JSX.Element;
+//# sourceMappingURL=Checkbox.d.ts.map

package/lib/types/LinkIcon.d.ts

@@ -7,6 +7,10 @@
  * cannot compose a glyph outside a link. Design sources:
  * ic_globe_language_outline_20, ic_code_outline_20, ic_folder_outline_20,
  * ic_photo_outline_20, ic_paper_doc_outline_20, ic_paper_outline_20.
+ *
+ * A `url` glyph whose destination names a well-known site is that site's own
+ * mark instead of the globe (`SiteGlyph.tsx`); every mark keeps the same
+ * currentColor-only rule.
  */
 import type { ReactNode } from 'react';
 import type { IconProps } from './icons/props.ts';
@@ -20,6 +24,12 @@ export type LinkIconKind = 'url' | 'folder' | 'code' | 'image' | 'document' | 'o
 /** Props for {@link LinkIcon}: the category plus the shared icon sizing seat. */
 export interface LinkIconProps extends IconProps {
     kind: LinkIconKind;
+    /**
+     * Destination of a `url` link. A well-known site draws its own mark, so
+     * callers that know the destination should pass it; anything else keeps the
+     * globe. Other kinds ignore it — their destination is a path, not a site.
+     */
+    href?: string | undefined;
 }
 /**
  * Derive a file path's link-icon category from its extension. Unknown and
@@ -30,9 +40,10 @@ export interface LinkIconProps extends IconProps {
 export declare function classifyLinkPath(path: string): LinkIconKind;
 /**
  * Render the leading glyph for one clickable artifact link.
- * @param props - The link category, optional size (default 14px — the inline
- * link text size these glyphs sit beside), and optional CSS class.
+ * @param props - The link category, the optional destination that can select a
+ * site mark, optional size (default 14px — the inline link text size these
+ * glyphs sit beside), and optional CSS class.
  * @returns The category's SVG glyph, riding currentColor.
  */
-export declare function LinkIcon({ kind, size, className }: LinkIconProps): ReactNode;
+export declare function LinkIcon({ kind, href, size, className }: LinkIconProps): ReactNode;
 //# sourceMappingURL=LinkIcon.d.ts.map

package/lib/types/Menu.d.ts

@@ -25,8 +25,13 @@ export interface MenuLabel {
 /** One primary-menu entry: a row, a separator, or a heading label. */
 export type MenuEntry = MenuItem | MenuSeparator | MenuLabel;
 /**
- * Render an anchored dropdown menu.
- * @param props.autoFocus - focus the first item on open and enable arrow-key navigation; Escape focuses the anchor's first button.
+ * Render an anchored dropdown menu. While the list is open its keys mirror the
+ * composer's: Tab settles the focused row — from the trigger, Tab enters the
+ * list instead — and Escape or Shift+Tab close it and return focus to the
+ * anchor's first button, and selecting a row does the same — the rows unmount
+ * with the list. Only a keyboard on the trigger or inside the list is
+ * intercepted; Tab presses elsewhere on the page stay the browser's.
+ * @param props.autoFocus - focus the first item on open; the arrow keys walk the list either way.
  * @param props.open - whether the list is showing (owner-controlled).
  * @param props.anchor - the trigger element (rendered in place).
  * @param props.items - selectable rows and optional separators.

package/lib/types/Modal.d.ts

@@ -19,7 +19,8 @@ type ModalProps = ModalBaseProps & ({
 /**
  * Render a centered, body-portaled modal over a blurred page mask.
  * @param props.open - whether the dialog is showing.
- * @param props.onClose - Escape or mask click.
+ * @param props.onClose - Escape or mask click; while a menu is open inside the
+ * dialog, Escape belongs to that menu first.
  * @param props.title - dialog heading (aria-label in every mode).
  * @param props.closeLabel - localized accessible close-button label.
  * @param props.description - optional supporting sentence under the title.

package/lib/types/SiteGlyph.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Site marks for well-known external link hosts. {@link LinkIcon} renders one in
+ * the leading glyph seat, so a familiar destination leads with its own mark
+ * instead of the generic globe. The marks are the `simple-icons` artwork set
+ * (CC0-1.0), pinned by this package's dependency on it; each mark takes the
+ * link's `currentColor` rather than the brand fill that set records.
+ */
+import type { ReactElement } from 'react';
+/** Props for {@link siteGlyph}: the destination plus the shared icon sizing seat. */
+interface SiteGlyphProps {
+    /** The link destination; only an absolute http(s) URL can name a host. */
+    href: string | undefined;
+    /** Square edge in px. */
+    size: number;
+    /** Extra class for layout placement. */
+    className?: string | undefined;
+}
+/**
+ * Render the site mark for a known external destination.
+ * @param props - The destination and the icon sizing seat.
+ * @returns The site's mark riding currentColor, or undefined for an unknown site.
+ */
+export declare function siteGlyph({ href, size, className }: SiteGlyphProps): ReactElement | undefined;
+export {};
+//# sourceMappingURL=SiteGlyph.d.ts.map

package/lib/types/TerminalBlock.d.ts

@@ -9,6 +9,8 @@ export interface TerminalBlockLabels {
     signal: (signal: string) => string;
     /** Status pill text for a non-zero exit code. */
     exitCode: (exitCode: number) => string;
+    /** Status pill text for a command that ended without an exit code: killed by a signal the view does not know, or never started. */
+    noExitCode: string;
     /** Run-state text while the command is still running. */
     running: string;
     /** Run-state text for a signal or non-zero-exit settle. */
@@ -39,11 +41,14 @@ export interface TerminalBlockProps {
     home?: string | undefined;
     /** The command's output text; may contain ANSI escape sequences. */
     output?: string | undefined;
-    /** Settled exit code; a non-zero value renders the status pill. */
-    exitCode?: number | undefined;
+    /** Settled exit code; a non-zero value renders the status pill, and null (settled without one) the no-exit-code pill. */
+    exitCode?: number | null | undefined;
     /** Settled terminating signal name; any value renders the status pill, taking precedence over the exit code. */
     signal?: string | undefined;
-    /** The command is still running: the block shows the prompt line alone. */
+    /**
+     * The command is still running: the block shows the prompt line, and the
+     * output printed so far when there is any, with no copy control until it settles.
+     */
     running?: boolean | undefined;
     /** Height cap in output lines before the middle collapses (default {@link DEFAULT_TERMINAL_MAX_LINES}); Infinity disables the cap. */
     maxLines?: number | undefined;

package/lib/types/darwin-desktop.d.ts

@@ -0,0 +1,9 @@
+/** macOS desktop detection for hiddenInset-titlebar layout variants. */
+/**
+ * Whether the client runs in the macOS desktop shell: the Electron preload
+ * marks `<html>` with `data-platform="darwin"`; plain web never sets it.
+ * Read at render time — the mark may arrive as late as DOMContentLoaded.
+ * @returns true only inside the macOS Electron shell.
+ */
+export declare function isDarwinDesktop(): boolean;
+//# sourceMappingURL=darwin-desktop.d.ts.map

package/lib/types/icons/index.d.ts

@@ -161,6 +161,8 @@ export declare const IconInspectOutline12: ({ size, className }: IconProps) => i
 export declare const IconSkillOutline16: ({ size, className }: IconProps) => import("react").JSX.Element;
 /** ic_ds_question_outline_14 (figma extract): ring + question glyph. */
 export declare const IconQuestionOutline14: ({ size, className }: IconProps) => import("react").JSX.Element;
+/** Info companion to the question outline: the same ring with an "i" glyph. */
+export declare const IconInfoOutline14: ({ size, className }: IconProps) => import("react").JSX.Element;
 /** Alarm clock outline for active scheduled-task indicators. */
 export declare const IconAlarmClockOutline16: ({ size, className }: IconProps) => import("react").JSX.Element;
 /** ic_ds_archive_outline_20 (figma extract): lidded box + label slot. The export's
@@ -193,4 +195,6 @@ export declare const SHIELD_OUTLINE_PATH = "M8.20554 0.899994L14.7901 3.36857V7.
 export declare const SHIELD_OUTLINE_STROKE = "1.31831";
 /** Permission row glyph of the composer menu: the shield contour alone, without a mode mark. */
 export declare const IconShieldOutline16: ({ size, className }: IconProps) => import("react").JSX.Element;
+/** Plugin pinwheel (design handoff for the plugin manager): four interleaved arcs on the 16 grid. */
+export declare const IconPluginPinwheelOutline16: ({ size, className }: IconProps) => import("react").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/lib/types/index.d.ts

@@ -11,6 +11,7 @@ export { Pill } from './Pill.tsx';
 export { Tag } from './Tag.tsx';
 export type { TagTone } from './Tag.tsx';
 export { Switch } from './Switch.tsx';
+export { Checkbox } from './Checkbox.tsx';
 export { Input } from './Input.tsx';
 export { Menu } from './Menu.tsx';
 export type { MenuEntry, MenuItem, MenuSeparator, MenuLabel } from './Menu.tsx';
@@ -42,6 +43,7 @@ export { fileSizeText } from './file-size.ts';
 export { writeClipboard } from './clipboard.ts';
 export { relativeTime } from './relative-time.ts';
 export { rankByName } from './rank-by-name.ts';
+export { isDarwinDesktop } from './darwin-desktop.ts';
 export type { RelativeTime, RelativeTimeUnit } from './relative-time.ts';
 export { JsonTree } from './JsonTree.tsx';
 export type { JsonTreeProps, JsonTreeLabels } from './JsonTree.tsx';
@@ -58,6 +60,8 @@ export type { WebBlockProps, WebSearchBlockProps, WebFetchBlockProps, WebSourceV
 export { CodeBlock } from './markdown/CodeBlock.tsx';
 export type { CodeBlockProps } from './markdown/CodeBlock.tsx';
 export { JsonBlock } from './markdown/JsonBlock.tsx';
+export { MarkdownDelegateProvider } from './markdown/MarkdownDelegate.tsx';
+export type { MarkdownDelegate, MarkdownDelegateProviderProps, MarkdownExternalLinkHandler } from './markdown/MarkdownDelegate.tsx';
 export { MarkdownText } from './markdown/MarkdownText.tsx';
 export type { MarkdownCodeLabels, MarkdownFileMentions, MarkdownLabels, MarkdownPathImages } from './markdown/MarkdownText.tsx';
 export { extractMarkdownPlainText } from './markdown/plain-text.ts';

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

@@ -0,0 +1,36 @@
+import type { ReactNode } from 'react';
+/**
+ * Handle one sanitized absolute HTTP(S) URL selected from Markdown.
+ * @param href - destination URL.
+ */
+export type MarkdownExternalLinkHandler = (href: string) => void;
+/** Navigation capabilities supplied by the nearest Markdown owner. */
+export interface MarkdownDelegate {
+    /** Ordinary HTTP(S) activation; absent handlers retain native anchor behavior. */
+    readonly openExternalLink?: MarkdownExternalLinkHandler | undefined;
+    /**
+     * Open a decoded local destination from settled Markdown; absent handlers leave plain text.
+     * @param path - Absolute or workspace-relative file path.
+     * @param options - First line to reveal when the destination specifies a line or range.
+     */
+    readonly openFile?: ((path: string, options?: {
+        line?: number;
+    }) => void) | undefined;
+}
+/** Props for one Markdown navigation scope. */
+export interface MarkdownDelegateProviderProps extends MarkdownDelegate {
+    readonly children: ReactNode;
+}
+/**
+ * Scope Markdown navigation without threading callbacks through renderers.
+ * Nested providers replace the enclosing capabilities. Handler changes reach cached links.
+ * @param props - Child tree and its file and HTTP(S) link handlers.
+ * @returns the scoped child tree.
+ */
+export declare function MarkdownDelegateProvider({ children, openExternalLink, openFile, }: MarkdownDelegateProviderProps): ReactNode;
+/**
+ * Read the nearest Markdown navigation capabilities.
+ * @returns Owner callbacks, or an empty delegate outside a provider.
+ */
+export declare function useMarkdownDelegate(): MarkdownDelegate;
+//# sourceMappingURL=MarkdownDelegate.d.ts.map

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

@@ -24,19 +24,26 @@ export type { MarkdownCodeLabels, MarkdownFileMentions, MarkdownLabels, Markdown
  * identity discards the streaming render cache mid-message. `fileMentions`
  * links inline-code tokens its resolver recognizes as real files, and
  * `pathImages` rewrites image destinations that are local file paths into
- * displayable URLs its resolver vouches for; both vocabularies are the
+ * displayable URLs its resolver vouches for. Those two vocabularies are the
  * single streaming gate — they apply to settled renders only, because a
  * streaming message's vocabulary is not final and frozen cached elements
- * must not bake in handlers that could go stale.
- * @returns A GFM document with TeX math rendered through KaTeX; raw HTML,
- * relative links, and unsafe protocols are disabled, while absolute HTTP(S)
- * images render directly.
+ * must not bake in handlers that could go stale. A surrounding
+ * `MarkdownDelegateProvider` can delegate ordinary HTTP(S) activation while
+ * modified clicks retain native behavior. `variant="compact"` uses secondary
+ * text sizing, uniform bold headings, and tight block spacing; the default
+ * `body` variant uses the full document typography.
+ * The provider's `openFile` enables local Markdown links in settled messages,
+ * including `#L24` and `#L24-L30` destinations (ranges open at their first line).
+ * @returns A GFM document with TeX math rendered through KaTeX; raw HTML and
+ * unsafe protocols are disabled. Local links without an opener remain text;
+ * absolute HTTP(S) images render directly.
  */
-export declare const MarkdownText: import("react").MemoExoticComponent<({ text, streaming, labels, fileMentions, pathImages }: {
+export declare const MarkdownText: import("react").MemoExoticComponent<({ text, streaming, labels, fileMentions, pathImages, variant, }: {
     text: string;
     streaming?: boolean;
     labels: MarkdownLabels;
     fileMentions?: MarkdownFileMentions | undefined;
     pathImages?: MarkdownPathImages | undefined;
+    variant?: "body" | "compact";
 }) => import("react").JSX.Element>;
 //# sourceMappingURL=MarkdownText.d.ts.map

package/lib/types/markdown/file-link.d.ts

@@ -0,0 +1,13 @@
+/** Local Markdown destinations accepted by the file-preview callback. */
+/**
+ * Decode a file destination and its optional GitHub-style line fragment.
+ * Literal `?` and `#` in filenames must be percent-encoded.
+ * @param value - Parsed Markdown link destination.
+ * @returns A local path and optional first line, or undefined for URLs,
+ * fragment-only links, queries, malformed escapes, or invalid line ranges.
+ */
+export declare function parseFileLink(value: string): {
+    path: string;
+    line?: number;
+} | undefined;
+//# sourceMappingURL=file-link.d.ts.map

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

@@ -4,8 +4,8 @@
  * cache frozen blocks as React elements; the rendered DOM is pinned
  * byte-for-byte by `tests/fixtures/markdown-dom` and must not drift.
  *
- * Untrusted-output policy (unchanged from the replaced pipeline): link and
- * image destinations pass a protocol allowlist, images additionally require
+ * External link and image destinations pass a protocol allowlist; settled
+ * local file links use an explicit owner callback. Images additionally require
  * absolute HTTP(S), raw HTML renders as literal text (no HTML enters the
  * DOM), and KaTeX runs without trusted commands. Fragment-anchor URLs fail
  * the allowlist, so footnote references and back-references render as plain

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.6-alpha.1",
+  "version": "0.1.6-alpha.2",
   "publishConfig": {
     "access": "public"
   },
@@ -46,6 +46,7 @@
     "mdast-util-math": "^3.0.0",
     "micromark-extension-gfm": "^3.0.0",
     "micromark-util-sanitize-uri": "^2.0.1",
+    "simple-icons": "16.31.0",
     "@deepseek-ai/cordis": "^4.0.2"
   },
   "files": [