Page Number

Last updated on

The page being drawn and how many there are, for a document's page furniture.

PageNumber is the one component whose text comes from neither the artifact nor the caller: the two numbers come from whatever is drawing the page. In the preview that is the page plan, so each sheet prints its own number. On the PDF path the engine repeats the footer on every page and fills the same two numbers itself.

Preview

Rendering live preview requires JavaScript.

Installation

npx shadcn@4 add @paradoc/page-number

Or, with the Paradoc CLI, which writes the namespace into components.json for you:

npx paradoc-cli add page-number

Installs to components/paradoc/page-number.tsx.

Usage

import { PageNumber } from "@/components/paradoc/page-number";<PageNumber />
PropTypeDefaultDescription
label?string"Page"Words before the page number. Empty prints the number alone.
separator?string"of"Words between the page number and the page count.
total?booleantruePrints the page count after the separator.
className?string—Application-owned classes on the wrapper.

Composition

It belongs in a page-furniture slot: the furniture prop of Pages or Paper. Hand the same object to renderPdf(element, { plan, furniture }) from @paradoc/react-pdf and the PDF carries the footer the preview drew, page for page.

import { renderPdf } from "@paradoc/react-pdf";
import { PageNumber } from "@/components/paradoc/page-number";
import { Pages } from "@/components/paradoc/pages";

const furniture = { footer: <PageNumber /> };

<Pages furniture={furniture}>{document}</Pages>;
// and, on the server:
await renderPdf(document, { plan, furniture });

The numbers are two marked slots rather than one string, because the PDF engine substitutes its own counters into them. That is why the wording is label and separator rather than a format function: a function could not run inside the engine. Anywhere with nothing paginating above it — a bare Paper, a component rendered on its own — it reads "Page 1 of 1", because there is one sheet.

It carries no pagination unit of its own: furniture is not part of the flow, so it is never planned onto a page and never a Keep Together.

Variants

Number only

total drops the page count, so the foot reads "Page 2" rather than "Page 2 of 4".

Rendering live preview requires JavaScript.

Custom wording

label and separator replace the default "Page" and "of", so the same two numbers read "Sheet 2 / 4".

Rendering live preview requires JavaScript.

On this page