Quarterly production report
This block is the print target for every demo. .no-print elements vanish
You should never see this sentence on paper (excluded via
excludeSelectorList).
Reference links
Read the internal spec, the MDN @page docs, and the external whitepaper.
Run log (scrollable on screen, expandable on paper)
| Run | Sheets | Waste % |
|---|
Live chart (canvas)
Order form (state survives to paper)
Field memo Sample PII · all fake
This block exists so the redaction and privacy jobs have something juicy to censor. Every identifier below is invented.
Officer R. VELVET met the contact (NIGHTJAR) at the drop point. Reach the desk at case-handler@agency-example.gov or +1 (202) 555-0173. Reimbursement went to card 4111 1111 1111 1111, payroll ref SSN 078-05-1120.
Routing: safehouse 12B, Krausenstr. 9, rear entrance code 4471.
Contact confirmed the shipment arrives Thursday. Recommend continued surveillance.
Declarative triggers (no js written)
These buttons carry their whole job in data attributes. The library's delegated listener picks them up at boot, so they work for content added later too.
Content can self-describe too: mark elements with
data-printcraft-exclude,
data-printcraft-break-before,
data-printcraft-avoid-break, or
data-printcraft-reveal
and every job honors them.
Interaction layer
Right-click anywhere on this page. The menu installs itself at load, so nothing below is needed to use it. Every entry is a registered action, which is also why the same things appear in the command palette and on the keyboard.
| ModK | All commands |
| ModP | Print the page |
| Mod⇧P | Print settings |
| Mod⇧D | Draw a print area |
| Mod⇧R | Redact by dragging |
| Mod⇧N | All notes and redactions |
| Mod⇧I | Preview the print |
Mod is ⌘ on a Mac and Ctrl elsewhere; either works.
Notes and redactions are stored as data-printcraft-* attributes on
the live element, so every later job honours them, and
Printcraft.ui.notes() lists them all before anything prints.
Two interfaces, one page
Invoice pane
Right-click here after scoping: printing and previewing only.
Legal pane
And here: redaction only, with its own heading.
Each pane owns a registry, a menu, a keymap and a scope.
destroy() takes one down completely, which is what an app that
mounts and unmounts a panel needs.
Backends
The browser's dialog is one backend among several. This page has no print
server, so Send to a print server fails on purpose and shows you the error it
gives: the url it tried and what to do. A real one takes
httpBackend({ url }) or
socketBackend({ url }) and everything else is unchanged.
Devtools
The inspector shows the assembled print document in an overlay before any
dialog. Debug logging prints per-stage timings for every job.
Printcraft.devtools.jobs keeps
the last 20 job records. You can also enable debug with
?printcraft-debug in the url or
localStorage.setItem('printcraft:debug','1').