Add a Print / PDF export button

packages/web/src/ui/app.test.ts

@@ -1,4 +1,4 @@
-import { describe, it, expect } from "vitest";
+import { describe, it, expect, vi } from "vitest";
 import { mountApp } from "./app.js";
 
 describe("app", () => {
@@ -42,6 +42,19 @@ describe("app", () => {
     history.replaceState(null, "", "#");
   });
 
+  it("offers a Print / PDF button that opens the browser print dialog", () => {
+    const root = document.createElement("main");
+    mountApp(root);
+    const print = root.querySelector<HTMLButtonElement>('[data-export="print"]')!;
+    expect(print).not.toBeNull();
+    expect(print.textContent).toBe("Print / PDF");
+    const spy = vi.spyOn(window, "print").mockImplementation(() => {});
+    print.click();
+    expect(spy).toHaveBeenCalledTimes(1);
+    spy.mockRestore();
+    history.replaceState(null, "", "#");
+  });
+
   it("shows a readable notice for malformed input instead of throwing", () => {
     const root = document.createElement("main");
     mountApp(root);

packages/web/src/ui/app.ts

@@ -32,6 +32,7 @@ export function mountApp(root: HTMLElement): void {
       <button data-export="link">Copy link</button>
       <button data-export="json">Copy JSON</button>
       <button data-export="csv">Download CSV</button>
+      <button data-export="print">Print / PDF</button>
     </section>`;
   let rows: ResultRow[] = [];
   let summary: SolveSummary | undefined;
@@ -100,6 +101,9 @@ export function mountApp(root: HTMLElement): void {
     const blob = new Blob([toCsv(rows, summary)], { type: "text/csv" });
     const a = document.createElement("a"); a.href = URL.createObjectURL(blob); a.download = "involute-frontier.csv"; a.click();
   });
+  // The @media print stylesheet already reduces the page to a spec sheet
+  // (schematic + table + summary), so opening the browser dialog is all we need.
+  root.querySelector('[data-export="print"]')!.addEventListener("click", () => window.print());
   // initial solve with the panel's default request
   panel.dispatchEvent(new Event("change", { bubbles: true }));
 }