# react-papier

> A library of React components for creating documents meant for print.

Latest version **0.0.0** (published 2019-01-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-papier
pnpm add react-papier
yarn add react-papier
bun add react-papier
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.0 |
| Published | 2019-01-03 |
| First published | 2019-01-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 2.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Jesse Lee Schmucker |
| Maintainers | jesselee34 |

## Links

- npm: https://www.npmjs.com/package/react-papier
- npm.io page: https://npm.io/package/react-papier

## Recent versions

- 0.0.0 (latest) — 2019-01-03

## README

# React Pages

React Pages is a library of pure functional react components that make it easy to create documents meant for print using web technology. It was built as a solution for encapulating the main challenges of using HTML for creating data driven PDF documents. Challenges like dynamic page wrapping, page numbering, table of contents pages, ect. are the primary focus.

# Getting Started

## Simple example

Every ReactPages document must have at it's root one or more `<Document>` components. It's direct children must be `<Page>` components. The `<Document>` component acts as a context provider for data about the document like the number of pages for example. Because of this ReactPages `<Document>` components are created using a factory function.

```
import React from 'react';
import ReactDOM from 'react-dom';
import { createDocument, Page } from 'react-pages';

const { Document } = createDocument();

// Some basic styles to make the pages centered and visually separated.
const pageStyle = { margin: '10px auto' };

const TwoPageDoc = () => (
  <Document>
    <Page style={pageStyle}>
      <h1>First Page</h1>
      <p>Here is some stuff for the first page.</p>
    </Page>
    <Page style={pageStyle}>
      <h1>Second Page</h1>
      <p>Here is some stuff for the second page.</p>
    </Page>
  </Document>
);

ReactDom.render(
  <TwoPageDoc />,
  document.body
);
```

# API Documentation

To see the full ReactPages api documention visit the documentation site here: TODO: Build a documentation site and link to it here.

# Contributing

## Instalation

```
npm install
```

## Running the dev server

The dev server will run the glossary layout example by default. To run one of the other examples open `src/dev/index.js` and change the exmple component being rendered to the one desired.

The open a command line, `cd` to the root and run:

```
npm start
```

---
_Source: https://npm.io/package/react-papier · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._