Getting Started

RichView turns JSON or YAML report schemas into self-contained HTML documents with interactive charts, tables, verification badges, and responsive layouts.

Local Development Setup

RichView is not yet published to npm. Clone and build from source:

git clone https://github.com/richview-universe/richview-v2.git
cd richview-v2
pnpm install
pnpm build

Generate a Report

Render one of the included example schemas:

node packages/cli/dist/index.js generate examples/climate-briefing.json -o out/

Open out/climate-briefing.html in any browser. The output is a single self-contained HTML file with all styles, scripts, and chart data embedded.

If you have the CLI linked (via pnpm link or after global install):

richview generate report.yaml -o dist/

Create a New Report

Scaffold a starter project:

richview init my-report
cd my-report

This creates a directory with an example report schema file.

Validate and Lint

Check schema validity:

richview validate report.yaml

Run quality checks (data quality, chart quality, accessibility, best practices):

richview lint report.yaml

Verify Assertions

Reports can include declarative assertions on their data. The verify command runs them and produces a trust score:

richview verify report.yaml

Assertion types: range-check, consistency-check, freshness-check, citation-check.

Live Development

Start a local server that rebuilds on file changes:

richview serve report.yaml --open

Web Editor

Start the web editor for visual editing with live preview:

pnpm dev
# Open http://localhost:5174

Report Schema Overview

A minimal report schema:

title: Quarterly Revenue
sections:
  - id: summary
    type: markdown
    content: |
      Revenue grew 12% quarter-over-quarter.

  - id: revenue-chart
    type: chart
    title: Revenue by Quarter
    chart:
      type: bar
      xAxis: { field: quarter }
      yAxis: { field: revenue }
      series:
        - dataKey: revenue
    data:
      type: inline
      columns: [quarter, revenue]
      values:
        - [Q1, 1200000]
        - [Q2, 1350000]
        - [Q3, 1510000]
        - [Q4, 1690000]

See the Schema Reference for the full specification.

Using with AI Agents

RichView exposes all functionality through an MCP server. Add it to your claude_desktop_config.json:

{
  "mcpServers": {
    "richview": {
      "command": "node",
      "args": ["/path/to/richview-v2/packages/mcp-server/dist/index.js"]
    }
  }
}

See the MCP Server Guide for available tools and resources.