@duckviz/report

AI-powered report editor and deck presenter for DuckViz dashboards. Includes PDF, DOCX, and PPTX export.

Install

npm install @duckviz/report
# peer dependencies
npm install @duckviz/ui @duckviz/widgets @duckviz/db react react-dom @tanstack/react-query

Quick start

Wrap your app with ReportProvider, supplying typed callbacks for your AI backend:

import { ReportProvider, ReportPageContent } from "@duckviz/report";

function App() {
  return (
    <ReportProvider
      callbacks={{
        generateReportSections: async function* (request) {
          // Your SSE endpoint — yield ReportSSEEvent objects
        },
        modifyReportSection: async (request) => {
          // Your modification endpoint — return { content: StructuredReport }
        },
        generateDeckSlides: async function* (request) {
          // Your SSE endpoint — yield DeckSSEEvent objects
        },
        modifyDeckSlides: async (request) => {
          // Your modification endpoint — return { deck: StructuredDeck }
        },
      }}
    >
      <ReportPageContent
        dashboardName="Sales Dashboard"
        widgets={widgets}
        onBack={() => navigate("/dashboard")}
      />
    </ReportProvider>
  );
}

Exports

| Subpath | Description | | ---------------------------- | --------------------------------------------------------- | | @duckviz/report | All components, hooks, utilities, and types (client-side) | | @duckviz/report/server | Types + deck prompts only (server-safe, no React/DOM/CSS) | | @duckviz/report/styles.css | CSS stylesheet (auto-injected via JS import) |

Components

| Export | Description | | -------------------- | ----------------------------------------------------- | | ReportPageContent | Full report page with toolbar, editor, and chat panel | | ReportView | A4-style editor container | | YooptaReportEditor | Yoopta/Slate block editor with toolbar | | ReportOutlinePanel | Document outline sidebar | | ReportRightPanel | AI chat + timeline panel | | DeckView | Slide deck viewer | | DeckPresenter | Fullscreen slide presenter | | DeckSlidePreview | Slide thumbnail strip |

Hooks

| Export | Description | | --------------------- | ------------------------------------------------- | | useReportGeneration | Headless hook: scaffold, stream, chat for reports | | useDeckGeneration | Headless hook: scaffold, stream, chat for decks |

Export utilities

| Export | Description | | -------------- | --------------------------------------- | | exportToPdf | Programmatic PDF from structured report | | exportToDocx | Word document from structured report | | exportToPptx | PowerPoint from structured deck |

Templates

| Export | Description | | ------------------------ | ------------------------------- | | REPORT_TEMPLATES | 22 built-in report templates | | getRelevantTemplateIds | Domain-aware template selection |

Server subpath

API routes and server components should import from @duckviz/report/server to avoid pulling in React and DOM dependencies:

import type { ReportSection, StructuredReport } from "@duckviz/report/server";
import {
  DECK_SYSTEM_PROMPT,
  buildChartSlidePrompt,
} from "@duckviz/report/server";

Peer dependencies

• react >= 18
• react-dom >= 18
• @duckviz/ui >= 0.3.2
• @duckviz/widgets >= 0.2.0
• @duckviz/db >= 0.2.0 (optional)
• @tanstack/react-query >= 5

License

MIT