react-to-print - npm Package Compare versions

Comparing version 3.0.0-beta-1 to 3.0.0-beta-2

lib/index.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("lib",["react"],t):"object"==typeof exports?exports.lib=t(require("react")):e.lib=t(e.react)}("undefined"!=typeof self?self:this,(function(e){return function(){"use strict";var t={496:function(t){t.exports=e}},o={};function n(e){var r=o[e];if(void 0!==r)return r.exports;var s=o[e]={exports:{}};return t[e](s,s.exports,n),s.exports}n.d=function(e,t){for(var o in t)n.o(t,o)&&!n.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};return function(){n.r(r),n.d(r,{useReactToPrint:function(){return l}});var e=n(496);function t({level:e="error",messages:t,suppressErrors:o=!1}){o||("error"===e?console.error(t):"warning"===e?console.warn(t):"debug"===e&&console.debug(t))}function o(e,t){if(t||!e){const e=document.getElementById("printWindow");e&&document.body.removeChild(e)}}function s(e,n){const{documentTitle:r,onAfterPrint:s,onPrintError:i,preserveAfterPrint:l,print:a,suppressErrors:c}=n;setTimeout((()=>{var n,d;if(e.contentWindow)if(e.contentWindow.focus(),a)a(e).then((()=>null==s?void 0:s())).then((()=>o(l))).catch((e=>{i?i("print",e):t({messages:["An error was thrown by the specified `print` function"],suppressErrors:c})}));else{if(e.contentWindow.print){const t=null!==(d=null===(n=e.contentDocument)||void 0===n?void 0:n.title)&&void 0!==d?d:"",o=e.ownerDocument.title;r&&(e.ownerDocument.title=r,e.contentDocument&&(e.contentDocument.title=r)),e.contentWindow.print(),r&&(e.ownerDocument.title=o,e.contentDocument&&(e.contentDocument.title=t))}else t({messages:["Printing for this browser is not currently possible: the browser does not have a `print` method available for iframes."],suppressErrors:c});null==s||s(),o(l)}else t({messages:["Printing failed because the `contentWindow` of the print iframe did not load. This is possibly an error with `react-to-print`. Please file an issue: https://github.com/MatthewHerbst/react-to-print/issues/"],suppressErrors:c})}),500)}const i='\n    @page {\n        /* Remove browser default header (title) and footer (url) */\n        margin: 0;\n    }\n    @media print {\n        body {\n            /* Tell browsers to print background colors */\n            color-adjust: exact; /* Firefox. This is an older version of "print-color-adjust" */\n            print-color-adjust: exact; /* Firefox/Safari */\n            -webkit-print-color-adjust: exact; /* Chrome/Safari/Edge/Opera */\n        }\n    }\n';function l(n){const{contentRef:r,fonts:l,ignoreGlobalStyles:a,preserveAfterPrint:c,suppressErrors:d}=n,u=(0,e.useCallback)((e=>{o(c,!0);const u=function({contentRef:e,optionalContent:o,suppressErrors:n}){return o?(e&&t({level:"warning",messages:['"react-to-print" received a `contentRef` option and a optional-content param passed to its callback. The `contentRef` option will be ignored.']}),o()):e?e.current:void t({messages:['"react-to-print" did not receive a `contentRef` option or a optional-content param pass to its callback.'],suppressErrors:n})}({contentRef:r,optionalContent:e,suppressErrors:d});if(!u)return void t({messages:["There is nothing to print"],suppressErrors:d});if(!u)return void t({messages:['"react-to-print" could not locate the DOM node corresponding with the `content` prop'],suppressErrors:d});const p=u.cloneNode(!0),h=document.querySelectorAll("link[rel~='stylesheet'], link[as='style']"),m=p.querySelectorAll("img"),g=p.querySelectorAll("video"),f=l?l.length:0,b=(a?0:h.length)+m.length+g.length+f,y=[],v=[],w=function(){const e=document.createElement("iframe");return e.width=`${document.documentElement.clientWidth}px`,e.height=`${document.documentElement.clientHeight}px`,e.style.position="absolute",e.style.top=`-${document.documentElement.clientHeight+100}px`,e.style.left=`-${document.documentElement.clientWidth+100}px`,e.id="printWindow",e.srcdoc="<!DOCTYPE html>",e}(),E=(e,o)=>{y.includes(e)?t({level:"debug",messages:["Tried to mark a resource that has already been handled",e],suppressErrors:d}):(o?(t({messages:['"react-to-print" was unable to load a resource but will continue attempting to print the page',...o],suppressErrors:d}),v.push(e)):y.push(e),y.length+v.length===b&&function(e,t){const{onBeforePrint:o,onPrintError:n}=t;o?o().then((()=>{s(e,t)})).catch((e=>{null==n||n("onBeforePrint",e)})):s(e,t)}(w,n))};w.onload=()=>function(e,o,n,r){var l,a,c;const{clonedContentNode:d,contentNode:u,numResourcesToLoad:p,renderComponentImgNodes:h,renderComponentVideoNodes:m}=n,{bodyClass:g,fonts:f,ignoreGlobalStyles:b,pageStyle:y,nonce:v,suppressErrors:w}=r;e.onload=null;const E=e.contentDocument||(null===(l=e.contentWindow)||void 0===l?void 0:l.document);if(E){E.body.appendChild(d),f&&((null===(a=e.contentDocument)||void 0===a?void 0:a.fonts)&&(null===(c=e.contentWindow)||void 0===c?void 0:c.FontFace)?f.forEach((t=>{const n=new FontFace(t.family,t.source,{weight:t.weight,style:t.style});e.contentDocument.fonts.add(n),n.loaded.then((()=>{o(n)})).catch((e=>{o(n,["Failed loading the font:",n,"Load error:",e])}))})):(f.forEach((e=>o(e))),t({messages:['"react-to-print" is not able to load custom fonts because the browser does not support the FontFace API but will continue attempting to print the page'],suppressErrors:w})));const n=null!=y?y:i,r=E.createElement("style");v&&(r.setAttribute("nonce",v),E.head.setAttribute("nonce",v)),r.appendChild(E.createTextNode(n)),E.head.appendChild(r),g&&E.body.classList.add(...g.split(" "));const s=u.querySelectorAll("canvas"),l=E.querySelectorAll("canvas");for(let e=0;e<s.length;++e){const t=s[e],o=l[e].getContext("2d");o&&o.drawImage(t,0,0)}for(let e=0;e<h.length;e++){const t=h[e],n=t.getAttribute("src");if(n){const e=new Image;e.onload=()=>o(t),e.onerror=(e,n,r,s,i)=>o(t,["Error loading <img>",t,"Error",i]),e.src=n}else o(t,['Found an <img> tag with an empty "src" attribute. This prevents pre-loading it. The <img> is:',t])}for(let e=0;e<m.length;e++){const t=m[e];t.preload="auto";const n=t.getAttribute("poster");if(n){const e=new Image;e.onload=()=>o(t),e.onerror=(e,r,s,i,l)=>o(t,["Error loading video poster",n,"for video",t,"Error:",l]),e.src=n}else t.readyState>=2?o(t):(t.onloadeddata=()=>o(t),t.onerror=(e,n,r,s,i)=>o(t,["Error loading video",t,"Error",i]),t.onstalled=()=>o(t,["Loading video stalled, skipping",t]))}const p="input",A=u.querySelectorAll(p),S=E.querySelectorAll(p);for(let e=0;e<A.length;e++)S[e].value=A[e].value;const T="input[type=checkbox],input[type=radio]",x=u.querySelectorAll(T),k=E.querySelectorAll(T);for(let e=0;e<x.length;e++)k[e].checked=x[e].checked;const C="select",P=u.querySelectorAll(C),N=E.querySelectorAll(C);for(let e=0;e<P.length;e++)N[e].value=P[e].value;if(!b){const e=document.querySelectorAll("style, link[rel~='stylesheet'], link[as='style']");for(let n=0,r=e.length;n<r;++n){const r=e[n];if("style"===r.tagName.toLowerCase()){const e=E.createElement(r.tagName),o=r.sheet;if(o){let s="";try{const e=o.cssRules.length;for(let t=0;t<e;++t)"string"==typeof o.cssRules[t].cssText&&(s+=`${o.cssRules[t].cssText}\r\n`)}catch(e){t({messages:["A stylesheet could not be accessed. This is likely due to the stylesheet having cross-origin imports, and many browsers block script access to cross-origin stylesheets. See https://github.com/MatthewHerbst/react-to-print/issues/429 for details. You may be able to load the sheet by both marking the stylesheet with the cross `crossorigin` attribute, and setting the `Access-Control-Allow-Origin` header on the server serving the stylesheet. Alternatively, host the stylesheet on your domain to avoid this issue entirely.",r],level:"warning"})}e.setAttribute("id",`react-to-print-${n}`),v&&e.setAttribute("nonce",v),e.appendChild(E.createTextNode(s)),E.head.appendChild(e)}}else if(r.getAttribute("href"))if(r.hasAttribute("disabled"))t({messages:["`react-to-print` encountered a <link> tag with a `disabled` attribute and will ignore it. Note that the `disabled` attribute is deprecated, and some browsers ignore it. You should stop using it. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#attr-disabled. The <link> is:",r],level:"warning"}),o(r);else{const e=E.createElement(r.tagName);for(let t=0,o=r.attributes.length;t<o;++t){const o=r.attributes[t];o&&e.setAttribute(o.nodeName,o.nodeValue||"")}e.onload=()=>o(e),e.onerror=(t,n,r,s,i)=>o(e,["Failed to load",e,"Error:",i]),v&&e.setAttribute("nonce",v),E.head.appendChild(e)}else t({messages:["`react-to-print` encountered a <link> tag with an empty `href` attribute. In addition to being invalid HTML, this can cause problems in many browsers, and so the <link> was not loaded. The <link> is:",r],level:"warning"}),o(r)}}}0===p&&s(e,r)}(w,E,{clonedContentNode:p,contentNode:u,numResourcesToLoad:b,renderComponentImgNodes:m,renderComponentVideoNodes:g},n),document.body.appendChild(w)}),[n]);return u}}(),r}()}));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("lib",["react"],t):"object"==typeof exports?exports.lib=t(require("react")):e.lib=t(e.react)}("undefined"!=typeof self?self:this,(function(e){return function(){"use strict";var t={496:function(t){t.exports=e}},o={};function n(e){var r=o[e];if(void 0!==r)return r.exports;var s=o[e]={exports:{}};return t[e](s,s.exports,n),s.exports}n.d=function(e,t){for(var o in t)n.o(t,o)&&!n.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var r={};return function(){n.r(r),n.d(r,{useReactToPrint:function(){return a}});var e=n(496);function t({level:e="error",messages:t,suppressErrors:o=!1}){o||("error"===e?console.error(t):"warning"===e?console.warn(t):"debug"===e&&console.debug(t))}function o(e,t){if(t||!e){const e=document.getElementById("printWindow");e&&document.body.removeChild(e)}}function s(e,n){const{documentTitle:r,onAfterPrint:s,onPrintError:i,preserveAfterPrint:l,print:a,suppressErrors:c}=n;setTimeout((()=>{var n,d;if(e.contentWindow)if(e.contentWindow.focus(),a)a(e).then((()=>null==s?void 0:s())).then((()=>o(l))).catch((e=>{i?i("print",e):t({messages:["An error was thrown by the specified `print` function"],suppressErrors:c})}));else{if(e.contentWindow.print){const t=null!==(d=null===(n=e.contentDocument)||void 0===n?void 0:n.title)&&void 0!==d?d:"",o=e.ownerDocument.title;r&&(e.ownerDocument.title=r,e.contentDocument&&(e.contentDocument.title=r)),e.contentWindow.print(),r&&(e.ownerDocument.title=o,e.contentDocument&&(e.contentDocument.title=t))}else t({messages:["Printing for this browser is not currently possible: the browser does not have a `print` method available for iframes."],suppressErrors:c});null==s||s(),o(l)}else t({messages:["Printing failed because the `contentWindow` of the print iframe did not load. This is possibly an error with `react-to-print`. Please file an issue: https://github.com/MatthewHerbst/react-to-print/issues/"],suppressErrors:c})}),500)}const i='\n    @page {\n        /* Remove browser default header (title) and footer (url) */\n        margin: 0;\n    }\n    @media print {\n        body {\n            /* Tell browsers to print background colors */\n            color-adjust: exact; /* Firefox. This is an older version of "print-color-adjust" */\n            print-color-adjust: exact; /* Firefox/Safari */\n            -webkit-print-color-adjust: exact; /* Chrome/Safari/Edge/Opera */\n        }\n    }\n';function l(e,o,n,r){e.onload=()=>function(e,o,n,r){var l,a,c;const{clonedContentNode:d,clonedImgNodes:u,clonedVideoNodes:p,numResourcesToLoad:h,originalCanvasNodes:g}=n,{bodyClass:m,fonts:f,ignoreGlobalStyles:b,pageStyle:y,nonce:v,suppressErrors:w}=r;e.onload=null;const E=e.contentDocument||(null===(l=e.contentWindow)||void 0===l?void 0:l.document);if(E){E.body.appendChild(d),f&&((null===(a=e.contentDocument)||void 0===a?void 0:a.fonts)&&(null===(c=e.contentWindow)||void 0===c?void 0:c.FontFace)?f.forEach((t=>{const n=new FontFace(t.family,t.source,{weight:t.weight,style:t.style});e.contentDocument.fonts.add(n),n.loaded.then((()=>{o(n)})).catch((e=>{o(n,["Failed loading the font:",n,"Load error:",e])}))})):(f.forEach((e=>o(e))),t({messages:['"react-to-print" is not able to load custom fonts because the browser does not support the FontFace API but will continue attempting to print the page'],suppressErrors:w})));const n=null!=y?y:i,r=E.createElement("style");v&&(r.setAttribute("nonce",v),E.head.setAttribute("nonce",v)),r.appendChild(E.createTextNode(n)),E.head.appendChild(r),m&&E.body.classList.add(...m.split(" "));const s=E.querySelectorAll("canvas");for(let e=0;e<g.length;++e){const o=g[e],n=s[e];if(void 0===n){t({messages:["A canvas element could not be copied for printing, has it loaded? `onBeforePrint` likely resolved too early.",o],suppressErrors:w});continue}const r=n.getContext("2d");r&&r.drawImage(o,0,0)}for(let e=0;e<u.length;e++){const t=u[e],n=t.getAttribute("src");if(n){const e=new Image;e.onload=()=>o(t),e.onerror=(e,n,r,s,i)=>o(t,["Error loading <img>",t,"Error",i]),e.src=n}else o(t,['Found an <img> tag with an empty "src" attribute. This prevents pre-loading it.',t])}for(let e=0;e<p.length;e++){const t=p[e];t.preload="auto";const n=t.getAttribute("poster");if(n){const e=new Image;e.onload=()=>o(t),e.onerror=(e,r,s,i,l)=>o(t,["Error loading video poster",n,"for video",t,"Error:",l]),e.src=n}else t.readyState>=2?o(t):(t.onloadeddata=()=>o(t),t.onerror=(e,n,r,s,i)=>o(t,["Error loading video",t,"Error",i]),t.onstalled=()=>o(t,["Loading video stalled, skipping",t]))}if(!b){const e=document.querySelectorAll("style, link[rel~='stylesheet'], link[as='style']");for(let n=0,r=e.length;n<r;++n){const r=e[n];if("style"===r.tagName.toLowerCase()){const e=E.createElement(r.tagName),o=r.sheet;if(o){let s="";try{const e=o.cssRules.length;for(let t=0;t<e;++t)"string"==typeof o.cssRules[t].cssText&&(s+=`${o.cssRules[t].cssText}\r\n`)}catch(e){t({messages:["A stylesheet could not be accessed. This is likely due to the stylesheet having cross-origin imports, and many browsers block script access to cross-origin stylesheets. See https://github.com/MatthewHerbst/react-to-print/issues/429 for details. You may be able to load the sheet by both marking the stylesheet with the cross `crossorigin` attribute, and setting the `Access-Control-Allow-Origin` header on the server serving the stylesheet. Alternatively, host the stylesheet on your domain to avoid this issue entirely.",r],level:"warning"})}e.setAttribute("id",`react-to-print-${n}`),v&&e.setAttribute("nonce",v),e.appendChild(E.createTextNode(s)),E.head.appendChild(e)}}else if(r.getAttribute("href"))if(r.hasAttribute("disabled"))t({messages:["`react-to-print` encountered a <link> tag with a `disabled` attribute and will ignore it. Note that the `disabled` attribute is deprecated, and some browsers ignore it. You should stop using it. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#attr-disabled. The <link> is:",r],level:"warning"}),o(r);else{const e=E.createElement(r.tagName);for(let t=0,o=r.attributes.length;t<o;++t){const o=r.attributes[t];o&&e.setAttribute(o.nodeName,o.nodeValue||"")}e.onload=()=>o(e),e.onerror=(t,n,r,s,i)=>o(e,["Failed to load",e,"Error:",i]),v&&e.setAttribute("nonce",v),E.head.appendChild(e)}else t({messages:["`react-to-print` encountered a <link> tag with an empty `href` attribute. In addition to being invalid HTML, this can cause problems in many browsers, and so the <link> was not loaded. The <link> is:",r],level:"warning"}),o(r)}}}0===h&&s(e,r)}(e,o,n,r),document.body.appendChild(e)}function a(n){const{contentRef:r,fonts:i,ignoreGlobalStyles:a,onBeforePrint:c,onPrintError:d,preserveAfterPrint:u,suppressErrors:p}=n,h=(0,e.useCallback)((e=>{o(u,!0);const h=function({contentRef:e,optionalContent:o,suppressErrors:n}){return o?(e&&t({level:"warning",messages:['"react-to-print" received a `contentRef` option and a optional-content param passed to its callback. The `contentRef` option will be ignored.']}),o()):e?e.current:void t({messages:['"react-to-print" did not receive a `contentRef` option or a optional-content param pass to its callback.'],suppressErrors:n})}({contentRef:r,optionalContent:e,suppressErrors:p});if(!h)return void t({messages:["There is nothing to print"],suppressErrors:p});if(!h)return void t({messages:['"react-to-print" could not locate the DOM node corresponding with the `content` prop'],suppressErrors:p});const g=h.cloneNode(!0),m=document.querySelectorAll("link[rel~='stylesheet'], link[as='style']"),f=g.querySelectorAll("img"),b=g.querySelectorAll("video"),y=i?i.length:0,v=(a?0:m.length)+f.length+b.length+y,w=[],E=[],A=function(){const e=document.createElement("iframe");return e.width=`${document.documentElement.clientWidth}px`,e.height=`${document.documentElement.clientHeight}px`,e.style.position="absolute",e.style.top=`-${document.documentElement.clientHeight+100}px`,e.style.left=`-${document.documentElement.clientWidth+100}px`,e.id="printWindow",e.srcdoc="<!DOCTYPE html>",e}(),T=(e,o)=>{w.includes(e)?t({level:"debug",messages:["Tried to mark a resource that has already been handled",e],suppressErrors:p}):(o?(t({messages:['"react-to-print" was unable to load a resource but will continue attempting to print the page',...o],suppressErrors:p}),E.push(e)):w.push(e),w.length+E.length===v&&s(A,n))},x={clonedContentNode:g,clonedImgNodes:f,clonedVideoNodes:b,numResourcesToLoad:v,originalCanvasNodes:h.querySelectorAll("canvas")};c?c().then((()=>l(A,T,x,n))).catch((e=>{null==d||d("onBeforePrint",e)})):l(A,T,x,n)}),[n]);return h}}(),r}()}));

lib/utils/handlePrintWindowOnLoad.d.ts

 import { Font } from "../types/Font";
 import type { UseReactToPrintOptions } from "../types/UseReactToPrintOptions";
-type HandlePrintWindowOnLoadData = {
+export type HandlePrintWindowOnLoadData = {
     clonedContentNode: Node;
-    contentNode: Node;
+    clonedImgNodes: never[] | NodeListOf<HTMLImageElement>;
+    clonedVideoNodes: never[] | NodeListOf<HTMLVideoElement>;
     numResourcesToLoad: number;
-    renderComponentImgNodes: never[] | NodeListOf<HTMLImageElement>;
-    renderComponentVideoNodes: never[] | NodeListOf<HTMLVideoElement>;
+    originalCanvasNodes: never[] | NodeListOf<HTMLCanvasElement>;
 };
@@ -10,0 +10,0 @@ type MarkLoaded = (resource: Element | Font | FontFace, errorMessages?: unknown[]) => void;

package.json

 {
   "name": "react-to-print",
-  "version": "3.0.0-beta-1",
+  "version": "3.0.0-beta-2",
   "description": "Print React components in the browser",
@@ -12,3 +12,3 @@ "main": "lib/index.js",
     "build": "NODE_ENV=production webpack --progress",
-    "lint": "eslint src/**/*.{ts,tsx}",
+    "lint": "eslint ./src",
     "prepare": "npm run build && husky install",
@@ -15,0 +15,0 @@ "start": "NODE_ENV=development webpack serve"

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

36951

increased by0.05%

Lines of code

72

increased by2.86%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes