@squadbase/vantage 0.6.1-dev2.5f947f1 → 0.6.2-stg.3a2ba98

package/dist/doc/index.js

@@ -91,6 +91,7 @@ function themeToCssVars(theme) {
   if (theme.maxWidth) vars["--doc-max-width"] = theme.maxWidth;
   return Object.keys(vars).length > 0 ? vars : void 0;
 }
+var PRINT_PAGE_CSS = "@media print { @page { margin: 0 } }";
 function printLabel() {
   return navigator.language.toLowerCase().startsWith("ja") ? "PDF \u3068\u3057\u3066\u4FDD\u5B58" : "Save as PDF";
 }
@@ -108,6 +109,7 @@ var Document = forwardRef(function Document2({ theme, style, ...props }, ref) {
         ...props
       }
     ),
+    /* @__PURE__ */ jsx("style", { children: PRINT_PAGE_CSS }),
     /* @__PURE__ */ jsxs(
       Button,
       {

package/dist/doc/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/doc/print.ts","../../src/doc/document.tsx"],"names":["Document"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Printing a document — the browser's own print dialog, where \"Save as PDF\"\n * is the download. Paper is white and backgrounds are dropped by default, so a\n * dark theme would print pale text on nothing: the page is switched to light\n * for the duration and put back afterwards.\n */\n\nconst DARK_CLASS = \"dark\"\nconst THEME_ATTR = \"data-theme\"\n\ntype Restore = () => void\n\nlet restore: Restore | null = null\n\n/** Drop every dark marker on `<html>`/`<body>`, remembering exactly what was there. */\nfunction forceLight(): void {\n  if (restore) return\n  const undo: Restore[] = []\n  for (const el of [document.documentElement, document.body]) {\n    if (!el) continue\n    if (el.classList.contains(DARK_CLASS)) {\n      el.classList.remove(DARK_CLASS)\n      undo.push(() => el.classList.add(DARK_CLASS))\n    }\n    if (el.getAttribute(THEME_ATTR) === \"dark\") {\n      el.setAttribute(THEME_ATTR, \"light\")\n      undo.push(() => el.setAttribute(THEME_ATTR, \"dark\"))\n    }\n  }\n  restore = () => {\n    for (const fn of undo) fn()\n  }\n}\n\nfunction restoreTheme(): void {\n  restore?.()\n  restore = null\n}\n\nfunction nextFrame(): Promise<void> {\n  return new Promise((resolve) => {\n    let settled = false\n    const settle = () => {\n      if (settled) return\n      settled = true\n      resolve()\n    }\n    requestAnimationFrame(settle)\n    setTimeout(settle, 50)\n  })\n}\n\n/**\n * Canvas charts keep the colours they were painted with, and a CSS switch at\n * print time does not repaint them. Their tokens are re-read a frame after the\n * theme flips, then React re-inits the chart, which animates in from empty —\n * printed mid-way, the bars are missing. So wait a few frames for the re-init\n * to start, then for every chart to report its paint done.\n */\nconst REPAINT_FRAMES = 4\nconst CHART_TIMEOUT_MS = 3000\n\nasync function waitForCharts(): Promise<void> {\n  const deadline = performance.now() + CHART_TIMEOUT_MS\n  while (performance.now() < deadline) {\n    if (!document.querySelector('[data-slot=\"echart-canvas\"][data-rendering]')) return\n    await nextFrame()\n  }\n}\n\n/**\n * The theme comes back on `afterprint` (see `watchPrintEvents`), not after\n * `window.print()` returns — not every browser blocks on the dialog.\n */\nexport async function printDocument(): Promise<void> {\n  const wasForced = restore !== null\n  forceLight()\n  try {\n    if (!wasForced && restore) {\n      for (let i = 0; i < REPAINT_FRAMES; i++) await nextFrame()\n    }\n    await waitForCharts()\n    window.print()\n  } catch (error) {\n    restoreTheme()\n    throw error\n  }\n}\n\n/**\n * Must be mounted while a document is on screen. It also covers the browser's\n * own Print command, which skips the button: flipping the theme in\n * `beforeprint` still gets the text and rules right, though canvas charts\n * cannot repaint in time on that path.\n */\nexport function watchPrintEvents(): () => void {\n  window.addEventListener(\"beforeprint\", forceLight)\n  window.addEventListener(\"afterprint\", restoreTheme)\n  return () => {\n    window.removeEventListener(\"beforeprint\", forceLight)\n    window.removeEventListener(\"afterprint\", restoreTheme)\n  }\n}\n","import { forwardRef, useEffect } from \"react\"\nimport type { CSSProperties, HTMLAttributes } from \"react\"\nimport { PrinterIcon } from \"lucide-react\"\n\nimport { Button } from \"../ui/button\"\nimport { printDocument, watchPrintEvents } from \"./print\"\nimport type { DocumentTheme } from \"./types\"\n\nexport interface DocumentProps extends HTMLAttributes<HTMLElement> {\n  /** Token overrides for this document; anything omitted follows the app's theme. */\n  theme?: DocumentTheme\n}\n\n/**\n * Only the keys the document set are emitted — the rest resolve up the\n * cascade to `--doc-*` in theme.css. Writing defaults here would freeze every\n * document to light.\n */\nfunction themeToCssVars(theme: DocumentTheme | undefined): CSSProperties | undefined {\n  if (!theme) return undefined\n  const vars: Record<string, string> = {}\n  if (theme.fg) vars[\"--doc-fg\"] = theme.fg\n  if (theme.muted) vars[\"--doc-muted\"] = theme.muted\n  if (theme.accent) vars[\"--doc-accent\"] = theme.accent\n  if (theme.border) vars[\"--doc-border\"] = theme.border\n  if (theme.subtle) vars[\"--doc-subtle\"] = theme.subtle\n  if (theme.fontBody) vars[\"--doc-font-body\"] = theme.fontBody\n  if (theme.fontHeading) vars[\"--doc-font-heading\"] = theme.fontHeading\n  if (theme.fontMono) vars[\"--doc-font-mono\"] = theme.fontMono\n  if (theme.sizeBody) vars[\"--doc-size-body\"] = theme.sizeBody\n  if (theme.lineHeight) vars[\"--doc-line-height\"] = theme.lineHeight\n  if (theme.maxWidth) vars[\"--doc-max-width\"] = theme.maxWidth\n  return Object.keys(vars).length > 0 ? (vars as CSSProperties) : undefined\n}\n\n/** The one piece of chrome a document shows: English, Japanese for a Japanese browser. */\nfunction printLabel(): string {\n  return navigator.language.toLowerCase().startsWith(\"ja\") ? \"PDF として保存\" : \"Save as PDF\"\n}\n\n/**\n * The container of a document page. Plain elements written inside it —\n * headings, paragraphs, lists, tables, quotes, code, figures — are typeset by\n * the `[data-slot=\"document\"]` rules in theme.css, so the page body needs no\n * classes. Those rules sit in `@layer components`, below Tailwind utilities, so\n * a `className` on any element still wins.\n *\n * It also carries its own way out: a button that opens the print dialog, where\n * \"Save as PDF\" is the download. The print rules in theme.css leave only the\n * document on paper.\n */\nexport const Document = forwardRef<HTMLElement, DocumentProps>(function Document(\n  { theme, style, ...props },\n  ref,\n) {\n  const themeVars = themeToCssVars(theme)\n  const label = printLabel()\n  useEffect(() => watchPrintEvents(), [])\n  return (\n    <>\n      <article\n        ref={ref}\n        data-slot=\"document\"\n        style={themeVars || style ? { ...themeVars, ...style } : undefined}\n        {...props}\n      />\n      <Button\n        data-slot=\"document-print\"\n        variant=\"outline\"\n        size=\"sm\"\n        className=\"fixed right-4 bottom-4 z-10 shadow-sm\"\n        onClick={() => void printDocument()}\n        title={label}\n      >\n        <PrinterIcon aria-hidden=\"true\" />\n        {label}\n      </Button>\n    </>\n  )\n})\nDocument.displayName = \"Document\"\n"]}
+{"version":3,"sources":["../../src/doc/print.ts","../../src/doc/document.tsx"],"names":["Document"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Printing a document — the browser's own print dialog, where \"Save as PDF\"\n * is the download. Paper is white and backgrounds are dropped by default, so a\n * dark theme would print pale text on nothing: the page is switched to light\n * for the duration and put back afterwards.\n */\n\nconst DARK_CLASS = \"dark\"\nconst THEME_ATTR = \"data-theme\"\n\ntype Restore = () => void\n\nlet restore: Restore | null = null\n\n/** Drop every dark marker on `<html>`/`<body>`, remembering exactly what was there. */\nfunction forceLight(): void {\n  if (restore) return\n  const undo: Restore[] = []\n  for (const el of [document.documentElement, document.body]) {\n    if (!el) continue\n    if (el.classList.contains(DARK_CLASS)) {\n      el.classList.remove(DARK_CLASS)\n      undo.push(() => el.classList.add(DARK_CLASS))\n    }\n    if (el.getAttribute(THEME_ATTR) === \"dark\") {\n      el.setAttribute(THEME_ATTR, \"light\")\n      undo.push(() => el.setAttribute(THEME_ATTR, \"dark\"))\n    }\n  }\n  restore = () => {\n    for (const fn of undo) fn()\n  }\n}\n\nfunction restoreTheme(): void {\n  restore?.()\n  restore = null\n}\n\nfunction nextFrame(): Promise<void> {\n  return new Promise((resolve) => {\n    let settled = false\n    const settle = () => {\n      if (settled) return\n      settled = true\n      resolve()\n    }\n    requestAnimationFrame(settle)\n    setTimeout(settle, 50)\n  })\n}\n\n/**\n * Canvas charts keep the colours they were painted with, and a CSS switch at\n * print time does not repaint them. Their tokens are re-read a frame after the\n * theme flips, then React re-inits the chart, which animates in from empty —\n * printed mid-way, the bars are missing. So wait a few frames for the re-init\n * to start, then for every chart to report its paint done.\n */\nconst REPAINT_FRAMES = 4\nconst CHART_TIMEOUT_MS = 3000\n\nasync function waitForCharts(): Promise<void> {\n  const deadline = performance.now() + CHART_TIMEOUT_MS\n  while (performance.now() < deadline) {\n    if (!document.querySelector('[data-slot=\"echart-canvas\"][data-rendering]')) return\n    await nextFrame()\n  }\n}\n\n/**\n * The theme comes back on `afterprint` (see `watchPrintEvents`), not after\n * `window.print()` returns — not every browser blocks on the dialog.\n */\nexport async function printDocument(): Promise<void> {\n  const wasForced = restore !== null\n  forceLight()\n  try {\n    if (!wasForced && restore) {\n      for (let i = 0; i < REPAINT_FRAMES; i++) await nextFrame()\n    }\n    await waitForCharts()\n    window.print()\n  } catch (error) {\n    restoreTheme()\n    throw error\n  }\n}\n\n/**\n * Must be mounted while a document is on screen. It also covers the browser's\n * own Print command, which skips the button: flipping the theme in\n * `beforeprint` still gets the text and rules right, though canvas charts\n * cannot repaint in time on that path.\n */\nexport function watchPrintEvents(): () => void {\n  window.addEventListener(\"beforeprint\", forceLight)\n  window.addEventListener(\"afterprint\", restoreTheme)\n  return () => {\n    window.removeEventListener(\"beforeprint\", forceLight)\n    window.removeEventListener(\"afterprint\", restoreTheme)\n  }\n}\n","import { forwardRef, useEffect } from \"react\"\nimport type { CSSProperties, HTMLAttributes } from \"react\"\nimport { PrinterIcon } from \"lucide-react\"\n\nimport { Button } from \"../ui/button\"\nimport { printDocument, watchPrintEvents } from \"./print\"\nimport type { DocumentTheme } from \"./types\"\n\nexport interface DocumentProps extends HTMLAttributes<HTMLElement> {\n  /** Token overrides for this document; anything omitted follows the app's theme. */\n  theme?: DocumentTheme\n}\n\n/**\n * Only the keys the document set are emitted — the rest resolve up the\n * cascade to `--doc-*` in theme.css. Writing defaults here would freeze every\n * document to light.\n */\nfunction themeToCssVars(theme: DocumentTheme | undefined): CSSProperties | undefined {\n  if (!theme) return undefined\n  const vars: Record<string, string> = {}\n  if (theme.fg) vars[\"--doc-fg\"] = theme.fg\n  if (theme.muted) vars[\"--doc-muted\"] = theme.muted\n  if (theme.accent) vars[\"--doc-accent\"] = theme.accent\n  if (theme.border) vars[\"--doc-border\"] = theme.border\n  if (theme.subtle) vars[\"--doc-subtle\"] = theme.subtle\n  if (theme.fontBody) vars[\"--doc-font-body\"] = theme.fontBody\n  if (theme.fontHeading) vars[\"--doc-font-heading\"] = theme.fontHeading\n  if (theme.fontMono) vars[\"--doc-font-mono\"] = theme.fontMono\n  if (theme.sizeBody) vars[\"--doc-size-body\"] = theme.sizeBody\n  if (theme.lineHeight) vars[\"--doc-line-height\"] = theme.lineHeight\n  if (theme.maxWidth) vars[\"--doc-max-width\"] = theme.maxWidth\n  return Object.keys(vars).length > 0 ? (vars as CSSProperties) : undefined\n}\n\n/**\n * With no page margin the browser has nowhere to print its date / URL header\n * and footer. Rendered by `<Document>` rather than put in theme.css because an\n * `@page` rule cannot be scoped — there it would reach every dashboard too.\n */\nconst PRINT_PAGE_CSS = \"@media print { @page { margin: 0 } }\"\n\n/** The one piece of chrome a document shows: English, Japanese for a Japanese browser. */\nfunction printLabel(): string {\n  return navigator.language.toLowerCase().startsWith(\"ja\") ? \"PDF として保存\" : \"Save as PDF\"\n}\n\n/**\n * The container of a document page. Plain elements written inside it —\n * headings, paragraphs, lists, tables, quotes, code, figures — are typeset by\n * the `[data-slot=\"document\"]` rules in theme.css, so the page body needs no\n * classes. Those rules sit in `@layer components`, below Tailwind utilities, so\n * a `className` on any element still wins.\n *\n * It also carries its own way out: a button that opens the print dialog, where\n * \"Save as PDF\" is the download. The print rules in theme.css leave only the\n * document on paper.\n */\nexport const Document = forwardRef<HTMLElement, DocumentProps>(function Document(\n  { theme, style, ...props },\n  ref,\n) {\n  const themeVars = themeToCssVars(theme)\n  const label = printLabel()\n  useEffect(() => watchPrintEvents(), [])\n  return (\n    <>\n      <article\n        ref={ref}\n        data-slot=\"document\"\n        style={themeVars || style ? { ...themeVars, ...style } : undefined}\n        {...props}\n      />\n      <style>{PRINT_PAGE_CSS}</style>\n      <Button\n        data-slot=\"document-print\"\n        variant=\"outline\"\n        size=\"sm\"\n        className=\"fixed right-4 bottom-4 z-10 shadow-sm\"\n        onClick={() => void printDocument()}\n        title={label}\n      >\n        <PrinterIcon aria-hidden=\"true\" />\n        {label}\n      </Button>\n    </>\n  )\n})\nDocument.displayName = \"Document\"\n"]}

package/docs/en/changelog.md

@@ -9,6 +9,17 @@ What changed in each Vantage release. Newest is on top.
 > minor release may include backwards-incompatible changes. A patch is limited to
 > backwards-compatible additions and bug fixes.
 
+## v0.6.2
+
+Document pages can now be saved as PDF (2026-09-30).
+
+### Added
+
+- **`<Document>` shows a "Save as PDF" button at the bottom right** (labelled "PDF として保存" in a
+  Japanese browser). It opens the browser's print dialog. Only the document body is printed — the
+  app's header and sidebar, and the date / URL the browser adds, are left out. It prints in the light
+  palette even in dark mode, and charts are printed once they have finished drawing.
+
 ## v0.6.1
 
 Pages can now be written as documents (2026-09-25).

package/docs/ja/changelog.md

@@ -8,6 +8,17 @@ Vantage のリリースごとの変更点です。新しいものが上に来ま
 > まだプロトタイプ(**0.x**)です。0.x の間は **minor が実質のメジャー**扱いで、後方互換性の
 > ない変更は minor で入ることがあります。patch は後方互換の機能追加とバグ修正のみです。
 
+## v0.6.2
+
+ドキュメントのページを PDF として保存できるようになりました(2026-09-30)。
+
+### 追加
+
+- **`<Document>` が右下に「PDF として保存」ボタンを出します**(ブラウザの言語が日本語以外なら
+  「Save as PDF」)。押すとブラウザの印刷ダイアログが開きます。印刷されるのはドキュメントの本文だけで、
+  アプリのヘッダーやサイドバー、ブラウザが付ける日付・URL は載りません。ダークモードでもライトの配色で
+  印刷され、チャートは描き終わってから印刷されます。
+
 ## v0.6.1
 
 ドキュメントのページを書けるようになりました(2026-09-25)。

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@squadbase/vantage",
-  "version": "0.6.1-dev2.5f947f1",
+  "version": "0.6.2-stg.3a2ba98",
   "description": "Data dashboard framework for Squadbase Editor. Vite-powered, config-free, one-file first.",
   "type": "module",
   "license": "MIT",

package/theme.css

@@ -421,6 +421,14 @@
       background: none;
     }
   }
+  /* The page margin is zeroed by `<Document>` (an `@page` rule cannot be
+     scoped to it here), which drops the browser's date / URL header and
+     footer; this padding is the margin instead, repeated on every page. */
+  [data-slot="document"] {
+    padding: 16mm 18mm;
+    -webkit-box-decoration-break: clone;
+    box-decoration-break: clone;
+  }
   [data-slot="document"] :where(h1, h2, h3, h4) {
     break-after: avoid;
   }