Skip to main content

Print and PDF

Corva dashboards can render apps into PDF reports. A dark-theme app often needs a light report background and explicit print colors.

Detect report mode​

The root app props include layoutEnvironment.pdfReportMode. Pass that narrow value to the component that owns report styling instead of passing all platform props through the app.

import { AppContainer, AppHeader } from '@corva/ui/componentsV2';

export default function App({ layoutEnvironment }) {
  const pdfReportMode = Boolean(layoutEnvironment?.pdfReportMode);

  return (
    <AppContainer header={<AppHeader />}>
      <main className={pdfReportMode ? styles.pdf : styles.screen}>
        <ReportContent pdfReportMode={pdfReportMode} />
      </main>
    </AppContainer>
  );
}
.pdf {
  min-height: 100%;
  color: #171717;
  background: #fff;
}

Use print-specific colors for charts as well as HTML. Highcharts options can select a light palette when pdfReportMode is true.

Full-page reports​

Set this manifest field when the app should use an entire PDF report page:

{
  "application": {
    "ui": {
      "full_screen_report": true
    }
  }
}

Verify the exported result​

  • Check labels and chart series against a white background.
  • Avoid content that depends on hover or tooltips.
  • Confirm long tables and charts do not overflow their page.
  • Keep key context such as well, pad, range, and units visible in the exported content.
  • Test the actual Corva PDF flow; browser print preview is not an exact substitute.