react-to-print - npm Package Compare versions

Comparing version 2.0.0-alpha-4 to 2.0.0-alpha-5

lib/index.js

@@ -1,2 +0,2 @@
-"use strict";function _interopDefault(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var React=_interopDefault(require("react")),reactDom=require("react-dom"),propTypes=_interopDefault(require("prop-types")),classCallCheck=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")},createClass=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),inherits=function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)},possibleConstructorReturn=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t},toConsumableArray=function(e){if(Array.isArray(e)){for(var t=0,n=Array(e.length);t<e.length;t++)n[t]=e[t];return n}return Array.from(e)},ReactToPrint=function(e){function t(){var e,n,r,o;classCallCheck(this,t);for(var a=arguments.length,i=Array(a),l=0;l<a;l++)i[l]=arguments[l];return n=r=possibleConstructorReturn(this,(e=t.__proto__||Object.getPrototypeOf(t)).call.apply(e,[this].concat(i))),r.handlePrint=function(){var e=r.props,t=e.bodyClass,n=e.content,o=e.copyStyles,a=e.pageStyle,i=(e.onAfterPrint,n());if(void 0===i)return console.error("Refs are not available for stateless components. For 'react-to-print' to work only Class based components can be printed"),!1;var l=document.createElement("iframe");l.style.position="absolute",l.style.top="-1000px",l.style.left="-1000px";var c=reactDom.findDOMNode(i),s=document.querySelectorAll('link[rel="stylesheet"]');r.linkTotal=s.length||0,r.linkLoaded=0;var u=function(e){r.linkLoaded++,r.linkLoaded===r.linkTotal&&r.triggerPrint(l)};l.onload=function(){window.navigator&&window.navigator.userAgent.indexOf("Trident/7.0")>-1&&(l.onload=null);var e=l.contentDocument||l.contentWindow.document,n=[].concat(toConsumableArray(c.querySelectorAll("canvas")));e.open(),e.write(c.outerHTML),e.close();var i=void 0===a?"@page { size: auto;  margin: 0mm; } @media print { body { -webkit-print-color-adjust: exact; } }":a,s=e.createElement("style");s.appendChild(e.createTextNode(i)),e.head.appendChild(s),t.length&&e.body.classList.add(t);var f=e.querySelectorAll("canvas");if([].concat(toConsumableArray(f)).forEach(function(e,t){e.getContext("2d").drawImage(n[t],0,0)}),!1!==o){var p=document.querySelectorAll('style, link[rel="stylesheet"]');[].concat(toConsumableArray(p)).forEach(function(t,n){var r=e.createElement(t.tagName),o="";if("STYLE"===t.tagName){if(t.sheet){for(var a=0;a<t.sheet.cssRules.length;a++)o+=t.sheet.cssRules[a].cssText+"\r\n";r.setAttribute("id","react-to-print-"+n),r.appendChild(e.createTextNode(o))}}else{[].concat(toConsumableArray(t.attributes)).forEach(function(e){r.setAttribute(e.nodeName,e.nodeValue)}),r.onload=u.bind(null,"link"),r.onerror=u.bind(null,"link")}e.head.appendChild(r)})}0!==r.linkTotal&&!1!==o||r.triggerPrint(l)},document.body.appendChild(l)},o=n,possibleConstructorReturn(r,o)}return inherits(t,e),createClass(t,[{key:"triggerPrint",value:function(e){var t=this,n=this.props,r=n.onBeforePrint,o=n.onAfterPrint;r&&r(),setTimeout(function(){e.contentWindow.focus(),e.contentWindow.print(),t.removeWindow(e),o&&o()},500)}},{key:"removeWindow",value:function(e){setTimeout(function(){e.parentNode.removeChild(e)},500)}},{key:"render",value:function(){var e=this;return React.cloneElement(this.props.trigger(),{ref:function(t){return e.triggerRef=t},onClick:this.handlePrint})}}]),t}(React.Component);ReactToPrint.defaultProps={copyStyles:!0,closeAfterPrint:!0,bodyClass:""},module.exports=ReactToPrint;
+"use strict";function _interopDefault(e){return e&&"object"==typeof e&&"default"in e?e.default:e}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _defineProperties(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function _createClass(e,t,r){return t&&_defineProperties(e.prototype,t),r&&_defineProperties(e,r),e}function _defineProperty(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function _inherits(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&_setPrototypeOf(e,t)}function _getPrototypeOf(e){return(_getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function _setPrototypeOf(e,t){return(_setPrototypeOf=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function _assertThisInitialized(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function _possibleConstructorReturn(e,t){return!t||"object"!=typeof t&&"function"!=typeof t?_assertThisInitialized(e):t}function _toConsumableArray(e){return _arrayWithoutHoles(e)||_iterableToArray(e)||_nonIterableSpread()}function _arrayWithoutHoles(e){if(Array.isArray(e)){for(var t=0,r=new Array(e.length);t<e.length;t++)r[t]=e[t];return r}}function _iterableToArray(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance")}var React=_interopDefault(require("react")),reactDom=require("react-dom"),propTypes=_interopDefault(require("prop-types")),ReactToPrint=function(e){function t(){var e,r;_classCallCheck(this,t);for(var n=arguments.length,o=new Array(n),i=0;i<n;i++)o[i]=arguments[i];return r=_possibleConstructorReturn(this,(e=_getPrototypeOf(t)).call.apply(e,[this].concat(o))),_defineProperty(_assertThisInitialized(_assertThisInitialized(r)),"removeWindow",function(e){setTimeout(function(){e.parentNode.removeChild(e)},500)}),_defineProperty(_assertThisInitialized(_assertThisInitialized(r)),"triggerPrint",function(e){var t=r.props,n=t.onBeforePrint,o=t.onAfterPrint;n&&n(),setTimeout(function(){e.contentWindow.focus(),e.contentWindow.print(),r.removeWindow(e),o&&o()},500)}),_defineProperty(_assertThisInitialized(_assertThisInitialized(r)),"handlePrint",function(){var e=r.props,t=e.bodyClass,n=e.content,o=e.copyStyles,i=e.pageStyle,a=n();if(void 0!==a){var l=document.createElement("iframe");l.style.position="absolute",l.style.top="-1000px",l.style.left="-1000px";var s=reactDom.findDOMNode(a),c=document.querySelectorAll('link[rel="stylesheet"]');r.linkTotal=c.length||0,r.linksLoaded=[],r.linksErrored=[];var u=function(e,t){t?r.linksLoaded.push(e):(console.error("'react-to-print' was unable to load a link. It may be invalid. 'react-to-print' will continue attempting to print the page. The link the errored was:",e),r.linksErrored.push(e)),r.linksLoaded.length+r.linksErrored.length===r.linkTotal&&r.triggerPrint(l)};l.onload=function(){window.navigator&&window.navigator.userAgent.indexOf("Trident/7.0")>-1&&(l.onload=null);var e=l.contentDocument||l.contentWindow.document,n=_toConsumableArray(s.querySelectorAll("canvas"));e.open(),e.write(s.outerHTML),e.close();var a=void 0===i?"@page { size: auto;  margin: 0mm; } @media print { body { -webkit-print-color-adjust: exact; } }":i,c=e.createElement("style");c.appendChild(e.createTextNode(a)),e.head.appendChild(c),t.length&&e.body.classList.add(t);if(_toConsumableArray(e.querySelectorAll("canvas")).forEach(function(e,t){e.getContext("2d").drawImage(n[t],0,0)}),!1!==o){_toConsumableArray(document.querySelectorAll('style, link[rel="stylesheet"]')).forEach(function(t,r){if("STYLE"===t.tagName){var n=e.createElement(t.tagName);if(t.sheet){for(var o="",i=0;i<t.sheet.cssRules.length;i++)o+="".concat(t.sheet.cssRules[i].cssText,"\r\n");n.setAttribute("id","react-to-print-".concat(r)),n.appendChild(e.createTextNode(o)),e.head.appendChild(n)}}else{var a=_toConsumableArray(t.attributes),l=a.filter(function(e){return"href"===e.nodeName});if(!!l.length&&!!l[0].nodeValue){var s=e.createElement(t.tagName);a.forEach(function(e){s.setAttribute(e.nodeName,e.nodeValue)}),s.onload=u.bind(null,s,!0),s.onerror=u.bind(null,s,!1),e.head.appendChild(s)}else console.warn("'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:",t),u(t,!0)}})}0!==r.linkTotal&&!1!==o||r.triggerPrint(l)},document.body.appendChild(l)}else console.error("Refs are not available for stateless components. For 'react-to-print' to work only Class based components can be printed")}),_defineProperty(_assertThisInitialized(_assertThisInitialized(r)),"setRef",function(e){r.triggerRef=e}),r}return _inherits(t,React.Component),_createClass(t,[{key:"render",value:function(){var e=this.props.trigger;return React.cloneElement(e(),{onClick:this.handlePrint,ref:this.setRef})}}]),t}();_defineProperty(ReactToPrint,"defaultProps",{bodyClass:"",copyStyles:!0,onAfterPrint:!1,onBeforePrint:!1,pageStyle:void 0}),module.exports=ReactToPrint;
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "react-to-print",
-  "version": "2.0.0-alpha-4",
+  "version": "2.0.0-alpha-5",
   "description": "Print React components in the browser",
@@ -11,2 +11,3 @@ "main": "lib/index.js",
     "build": "rollup -c",
+    "lint": "eslint . --color",
     "webpack": "webpack --progress",
@@ -31,22 +32,30 @@ "webpack-dev-server": "webpack-dev-server --colors --progress"
   "homepage": "https://github.com/gregnb/react-to-print#readme",
+  "peerDependencies": {
+    "react": "^15.0.0 || ^16.0.0",
+    "react-dom": "^15.0.0 || ^16.0.0"
+  },
   "dependencies": {
-    "prop-types": "^15.6.0",
-    "react": "^16.2.0"
+    "prop-types": "^15.6.2"
   },
   "devDependencies": {
-    "babel-cli": "^6.26.0",
-    "babel-core": "^6.26.0",
-    "babel-loader": "^7.1.2",
-    "babel-plugin-external-helpers": "^6.22.0",
-    "babel-plugin-transform-class-properties": "^6.24.1",
-    "babel-plugin-transform-object-rest-spread": "^6.26.0",
-    "babel-plugin-transform-react-remove-prop-types": "^0.4.13",
-    "babel-preset-env": "^1.6.1",
-    "babel-preset-react": "^6.24.1",
-    "eslint": "^4.12.1",
-    "react-dom": "^16.2.0",
+    "@babel/cli": "^7.2.0",
+    "@babel/core": "^7.2.2",
+    "@babel/plugin-proposal-class-properties": "^7.2.1",
+    "@babel/plugin-proposal-object-rest-spread": "^7.2.0",
+    "@babel/preset-env": "^7.2.0",
+    "@babel/preset-react": "^7.0.0",
+    "babel-eslint": "^10.0.1",
+    "babel-loader": "^8.0.4",
+    "babel-plugin-transform-react-remove-prop-types": "^0.4.21",
+    "eslint": "^5.10.0",
+    "eslint-config-airbnb": "^17.1.0",
+    "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-jsx-a11y": "^6.1.2",
+    "eslint-plugin-react": "^7.11.1",
+    "react": "^16.6.3",
+    "react-dom": "^16.6.3",
     "rollup": "^0.52.0",
-    "rollup-plugin-babel": "^3.0.2",
+    "rollup-plugin-babel": "^4.1.0",
     "rollup-plugin-commonjs": "^8.2.6",
-    "rollup-plugin-replace": "^2.0.0",
+    "rollup-plugin-replace": "^2.1.0",
     "rollup-plugin-uglify": "^2.0.1",
@@ -53,0 +62,0 @@ "webpack": "^3.9.1",

README.md

@@ -11,3 +11,3 @@ <div align="center">
 
-So you've created a React component but would love to give end users the ability to print out the contents of that component. This package aims to solve that by popping up a new print window with CSS styles copied over as well.  
+So you've created a React component but would love to give end users the ability to print out the contents of that component. This package aims to solve that by popping up a new print window with CSS styles copied over as well.
 
@@ -93,3 +93,8 @@ ## Install
 |**`closeAfterPrint`**|boolean|Close the print window after action
-|**`pageStyle`**|string|Override default print window styling 
+|**`pageStyle`**|string|Override default print window styling
 |**`bodyClass`**|string|Optional class to pass to the print window body
+
+## FAQ
+
+**Why does `react-to-print` skip `<link rel="stylesheet" href="">` tags?**
+`<link>`s with empty `href` attributes are [INVALID HTML](https://www.w3.org/TR/html50/document-metadata.html#attr-link-href). In addition, they can cause all sorts of [undesirable behavior](https://gtmetrix.com/avoid-empty-src-or-href.html). For example, many browsers - including modern ones, when presented with `<link href="">` will attempt to load the current page. Some even attempt to load the current page's parent directory.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

21845

increased by28.21%

Lines of code

23

increased by35.29%

Number of lines in readme file

99

increased by5.32%

Worsened metrics

Dependency count

3

increased by50%

Dev dependency count

23

increased by27.78%

Dependency changes

• + Addedreact-dom@16.14.0(transitive)

• + Addedscheduler@0.19.1(transitive)

• - Removedreact@^16.2.0

• Updatedprop-types@^15.6.2