awesome-repositories.com
Blog
MCP
awesome-repositories.com

Entdecke die besten Open-Source-Repositories mit KI-gestützter Suche.

EntdeckenKuratierte SuchenOpen-Source-AlternativenSelf-hosted SoftwareBlogSitemap
ProjektÜber unsRanking-MethodikPresseMCP-Server
RechtlichesDatenschutzAGB
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
MatthewHerbst avatar

MatthewHerbst/react-to-print

0
View on GitHub↗
2,474 Stars·235 Forks·TypeScript·MIT·5 Aufrufewww.npmjs.com/package/react-to-print↗

React To Print

This project is a React print component and utility for rendering specific components or DOM elements into a browser print dialog. It functions as a print layout controller and lifecycle manager, using a hidden iframe to isolate content so that printing does not alter the main page layout.

The tool specializes in copying DOM and Shadow DOM content into a printable window while preserving encapsulated styles. It allows for the injection of custom fonts and CSS to manage page breaks, margins, and orientations for consistent physical paper or PDF output.

The library includes asynchronous lifecycle hooks for updating application state before and after printing, as well as configuration for print iframe attributes and document metadata. It also supports non-browser environments by allowing the standard print method to be replaced with a custom implementation.

Features

  • Targeted Element Printing - Enables sending specific DOM content from a component directly to the browser print dialog without affecting the main page.
  • Print Pagination Controls - Implements precise control over page breaks, margins, and orientations to ensure correct rendering on physical paper.
  • DOM Node Manipulators - Copies target element nodes and styles from the active page into the print window for visual consistency.
  • React Components - Provides a React component that renders specific elements into a hidden iframe to trigger the browser print dialog.
  • Printable - Sends specific React components to the browser print dialog without affecting the main page layout or visibility.
  • Print Isolation Frames - Renders targeted components into a hidden iframe to trigger the browser print dialog without altering the main page layout.
  • Print-Optimized Layouts - Generates HTML views specifically styled for physical printing by injecting custom fonts and CSS page styles.
  • Print Process Managers - Provides a set of hooks for executing asynchronous logic and updating state immediately before and after the printing process.
  • Web Component Print Support - Extracts and renders elements from the Shadow DOM to ensure encapsulated styles are preserved in the printed output.
  • Shadow DOM Flattening - Extracts elements from shadow roots and merges them into the print window to render encapsulated web component styles.
  • Shadow DOM Printing - Copies elements from Shadow Roots into the print window to ensure encapsulated web component styles are rendered.
  • DOM-to-Print Utilities - Copies DOM elements and Shadow DOM content into a printable window with custom styling.
  • Print Lifecycle Hooks - Provides asynchronous hooks to execute custom logic and update application state before and after the print process.
  • Programmatic PDF Layout Tools - Controls page breaks, margins, and CSS styles to ensure web content renders correctly on physical paper or PDF exports.
  • CSS Style Injections - Injects custom stylesheets and font families into the print document head to control margins and page breaks.
  • Pluggable Print Implementations - Allows replacing the standard browser print method with a custom function to execute printing tasks in desktop or non-browser environments.

Star-Verlauf

Star-Verlauf für matthewherbst/react-to-printStar-Verlauf für matthewherbst/react-to-print

KI-Suche

Entdecke weitere awesome Repositories

Beschreibe in einfachen Worten, was du brauchst — die KI bewertet tausende kuratierte Open-Source-Projekte nach Relevanz.

Start searching with AI

Häufig gestellte Fragen

Was macht matthewherbst/react-to-print?

This project is a React print component and utility for rendering specific components or DOM elements into a browser print dialog. It functions as a print layout controller and lifecycle manager, using a hidden iframe to isolate content so that printing does not alter the main page layout.

Was sind die Hauptfunktionen von matthewherbst/react-to-print?

Die Hauptfunktionen von matthewherbst/react-to-print sind: Targeted Element Printing, Print Pagination Controls, DOM Node Manipulators, React Components, Printable, Print Isolation Frames, Print-Optimized Layouts, Print Process Managers.

Welche Open-Source-Alternativen gibt es zu matthewherbst/react-to-print?

Open-Source-Alternativen zu matthewherbst/react-to-print sind unter anderem: crabbly/print.js — Print.js is a JavaScript print library that provides a client-side interface for triggering system print dialogs and… douyinfe/semi-design — Semi Design is a React UI component library and design token system used to build web application frontends. It… adobe/react-spectrum — This project is a design system component library and adaptive UI framework based on Adobe's Spectrum design system.… etesam913/react-magic-motion — React Magic Motion is a component-based library for React that automates layout transitions and visual movement. It… arco-design/arco-design — Arco Design is a React UI component library and design system framework used to build professional web interfaces. It… facebook/react — React is a JavaScript library for building user interfaces based on a component-driven architecture and unidirectional…

Open-Source-Alternativen zu React To Print

Ähnliche Open-Source-Projekte, sortiert nach der Anzahl der gemeinsamen Funktionen mit React To Print.
  • crabbly/print.jsAvatar von crabbly

    crabbly/Print.js

    4,548Auf GitHub ansehen↗

    Print.js is a JavaScript print library that provides a client-side interface for triggering system print dialogs and formatting HTML content for physical paper output from a web browser. It functions as a browser print controller that manages the lifecycle of temporary print documents to ensure consistent rendering. The library utilizes a DOM-to-frame printing utility that clones specific HTML elements into hidden iframes. This process isolates printable content from the main page layout, allowing the system to render a clean document without triggering a full page reload. The tool covers br

    JavaScript
    Auf GitHub ansehen↗4,548
  • arco-design/arco-designAvatar von arco-design

    arco-design/arco-design

    5,625Auf GitHub ansehen↗

    Arco Design is a React UI component library and design system framework used to build professional web interfaces. It provides a collection of pre-built visual elements and layouts designed to maintain a consistent design language across applications. The system features a token-based theming engine that utilizes hierarchical design variables and CSS variables to enable granular visual customization. This allows for the modification of global and component-level styles through a dedicated theme editor or loader to align the interface with specific brand identities. The framework supports ent

    TypeScript
    Auf GitHub ansehen↗5,625
  • adobe/react-spectrumAvatar von adobe

    adobe/react-spectrum

    15,567Auf GitHub ansehen↗

    This project is a design system component library and adaptive UI framework based on Adobe's Spectrum design system. It provides a collection of accessible React components designed to create consistent user experiences through a standardized set of adaptive and themeable interface elements. The framework features a responsive scale system that automatically optimizes touch targets and component sizing for mobile and desktop contexts. It is built as a tree-shakable library, allowing for the import of only the specific components used to minimize the final JavaScript and CSS bundle size. The

    TypeScriptaccessibilitydesign-systemsreact
    Auf GitHub ansehen↗15,567
  • douyinfe/semi-designAvatar von DouyinFE

    DouyinFE/semi-design

    10,017Auf GitHub ansehen↗

    Semi Design is a React UI component library and design token system used to build web application frontends. It provides a collection of pre-built interface elements and a framework of visual constants to maintain consistent branding across a product. The project features a design-to-code workflow that converts visual design drafts into production-ready React code and stylesheets. It includes an internationalization framework for adapting interfaces to different languages and text layouts, as well as a web component wrapper to isolate UI elements for use in SDKs and browser plugins. The libr

    TypeScriptai-friendlycode2designdark-mode
    Auf GitHub ansehen↗10,017
Alle 30 Alternativen zu React To Print anzeigen→