@brett_lamy/docstream 0.3.3 → 0.3.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brett_lamy/docstream",
-  "version": "0.3.3",
+  "version": "0.3.5",
   "description": "GitBook-aware readonly markdown and AI stream renderer.",
   "type": "module",
   "main": "./src/index.ts",

package/src/docs/DocsRenderer.tsx

@@ -336,8 +336,16 @@ function Blocks({ blocks, inline, liveRenderer }: { blocks: Block[]; inline?: bo
 
 // Renders a markdown string inline — used for embedded markdown like
 // OpenAPI descriptions, which can themselves contain GitBook blocks.
-export function MarkdownContent({ markdown, liveRenderer }: { markdown: string; liveRenderer?: LivePreviewRenderer }) {
-  return <Blocks blocks={parseMarkdown(markdown).children} liveRenderer={liveRenderer} />
+export function MarkdownContent({
+  markdown,
+  liveRenderer,
+  className,
+}: { markdown: string; liveRenderer?: LivePreviewRenderer; className?: string }) {
+  return (
+    <div data-docstream="" className={className}>
+      <Blocks blocks={parseMarkdown(markdown).children} liveRenderer={liveRenderer} />
+    </div>
+  )
 }
 
 export function DocsRenderer({ doc, liveRenderer }: { doc: DocumentNode; liveRenderer?: LivePreviewRenderer }) {

package/src/styles.css

@@ -2,19 +2,19 @@
 
 [data-docstream],
 .docs-article {
-  --gb-panel: var(--card);
-  --gb-panel-foreground: var(--card-foreground);
-  --gb-muted: var(--muted);
-  --gb-muted-foreground: var(--muted-foreground);
-  --gb-border: var(--border);
-  --gb-accent: var(--accent);
-  --gb-accent-foreground: var(--accent-foreground);
-  --gb-primary: var(--primary);
-  --gb-primary-foreground: var(--primary-foreground);
+  --gb-panel: var(--card, #ffffff);
+  --gb-panel-foreground: var(--card-foreground, #18181b);
+  --gb-muted: var(--muted, #f4f4f5);
+  --gb-muted-foreground: var(--muted-foreground, #71717a);
+  --gb-border: var(--border, #e4e4e7);
+  --gb-accent: var(--accent, #f4f4f5);
+  --gb-accent-foreground: var(--accent-foreground, #18181b);
+  --gb-primary: var(--primary, #4f46e5);
+  --gb-primary-foreground: var(--primary-foreground, #fafafa);
   /* Plain rgba/hex values (no color-mix()/oklch()) so the theme renders
      correctly in older Chromium forks; hosts can override any token. */
   --gb-code-bg: rgba(128, 128, 128, 0.13);
-  --gb-code-fg: var(--foreground);
+  --gb-code-fg: var(--foreground, #18181b);
 
   /* Semantic hint palette — solid color plus precomputed tints. Matches the
      editor palette in @brett_lamy/docstream-editor/styles.css. */
@@ -55,7 +55,7 @@
   font-weight: 650;
   margin-top: 1.4em;
   padding-bottom: 0.2em;
-  border-bottom: 1px solid var(--border);
+  border-bottom: 1px solid var(--border, #e4e4e7);
 }
 
 .docs-article h3 {
@@ -216,8 +216,8 @@
 }
 
 .docs-tabs-header .docs-tab-active {
-  background: var(--background);
-  color: var(--foreground);
+  background: var(--background, #ffffff);
+  color: var(--foreground, #18181b);
   font-weight: 500;
 }
 
@@ -298,7 +298,7 @@
   border-radius: 12px;
   font-weight: 500;
   text-decoration: none !important;
-  color: var(--foreground) !important;
+  color: var(--foreground, #18181b) !important;
 }
 
 .docs-content-ref:hover {
@@ -463,7 +463,7 @@
   padding: 16px;
   border: 1px solid var(--gb-border);
   border-radius: 12px;
-  background: var(--background);
+  background: var(--background, #ffffff);
 }
 
 .docs-mermaid svg {
@@ -560,7 +560,7 @@
 }
 
 .oas-desc {
-  color: var(--foreground);
+  color: var(--foreground, #18181b);
   margin-bottom: 8px;
 }
 
@@ -713,27 +713,27 @@
 .hljs-type,
 .hljs-tag,
 .hljs-name {
-  color: var(--chart-4, var(--gb-primary));
+  color: var(--chart-4, #cf222e);
 }
 
 .hljs-string,
 .hljs-attr,
 .hljs-symbol,
 .hljs-bullet {
-  color: var(--chart-1, var(--gb-primary));
+  color: var(--chart-1, #0a7a4b);
 }
 
 .hljs-title,
 .hljs-section,
 .hljs-function .hljs-title {
-  color: var(--chart-2, var(--gb-primary));
+  color: var(--chart-2, #8250df);
 }
 
 .hljs-number,
 .hljs-literal,
 .hljs-variable,
 .hljs-template-variable {
-  color: var(--chart-3, var(--gb-primary));
+  color: var(--chart-3, #0550ae);
 }
 
 .hljs-comment,