From 68ff625d1c49d1921ae6824684e53637255e26dc Mon Sep 17 00:00:00 2001 From: Josh Goldberg Date: Fri, 19 Jan 2018 09:28:30 -0800 Subject: [PATCH 1/3] Added TypeScript typings Fixes #2. I noticed the `copyStyles` prop is missing in README.md, so added it in to match the TS typings. --- README.md | 1 + src/NewWindow.d.ts | 72 ++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 73 insertions(+) create mode 100644 src/NewWindow.d.ts diff --git a/README.md b/README.md index 470e3cd..239aadc 100644 --- a/README.md +++ b/README.md @@ -52,6 +52,7 @@ The `children` contents is what will be rendered into the new popup window. In t | `onUnload` | `Function` | `undefined` | A function to be triggered before the new window unload. | | `onBlock` | `Function` | `undefined` | A function to be triggered when the new window could not be opened. | | `center` | `String` | `parent` | Indicate how to center the new window. Valid values are: `parent` or `screen`. `parent` will center the new window according to its _parent_ window. `screen` will center the new window according to the _screen_. | + | `copyStyles` | `Boolean` | `true` | If specified, copy styles from parent window's document. | ## Tests diff --git a/src/NewWindow.d.ts b/src/NewWindow.d.ts new file mode 100644 index 0000000..d3fc098 --- /dev/null +++ b/src/NewWindow.d.ts @@ -0,0 +1,72 @@ +import React from 'react' +import ReactDOM from 'react-dom' + +/** + * Base features common to all window features. + * + * @remarks These will be concatenated into a string for window.open. + */ +export interface IWindowFeatures { + height: number + width: number + [i: string]: boolean | number | string +} + +/** + * Props for opening a new window. + * + * @see https://developer.mozilla.org/en-US/docs/Web/API/Window/open + */ +declare export interface INewWindowProps { + /** + * The URL to open, if specified any children will be overriden. + */ + url?: string + + /** + * The name of the window. + */ + name?: string + + /** + * The title of the new window document. + */ + title?: string + + /** + * The set of window features. + */ + features?: IWindowFeatures + + /** + * A function to be triggered before the new window unload. + */ + onBlock?: IOnBlock | null + + /** + * A function to be triggered when the new window could not be opened. + */ + onUnload?: IOnUnload | null + + /** + * Indicate how to center the new window. + */ + center?: 'parent' | 'screen' + + /** + * If specified, copy styles from parent window's document. + */ + copyStyles?: boolean +} + +declare export default class NewWindow extends React.PureComponent { + private readonly container: HTMLDivElement + private window: Window | null + private windowCheckerInterval: number | null + private released: boolean + + /** + * Release the new window and anything that was bound to it. + */ + public release(): void +} From 7453093c37d11e81597b0a55ff87690049b63d52 Mon Sep 17 00:00:00 2001 From: Rubens Mariuzzo Date: Tue, 20 Mar 2018 22:08:30 -0400 Subject: [PATCH 2/3] Updated: dependencies to latest. --- dist/react-new-window.esm.js | 2 +- dist/react-new-window.esm.js.map | 2 +- dist/react-new-window.js | 2 +- dist/react-new-window.js.map | 2 +- dist/react-new-window.umd.js | 2 +- dist/react-new-window.umd.js.map | 2 +- package-lock.json | 14173 +++++++++++++++++++++++++++++ package.json | 8 +- rollup.config.js | 10 +- 9 files changed, 14188 insertions(+), 15 deletions(-) create mode 100644 package-lock.json diff --git a/dist/react-new-window.esm.js b/dist/react-new-window.esm.js index 103f471..19872c0 100644 --- a/dist/react-new-window.esm.js +++ b/dist/react-new-window.esm.js @@ -1,2 +1,2 @@ -function copyStyles(e,t){Array.from(e.styleSheets).forEach(function(n){if(n.cssRules){var o=e.createElement("style");Array.from(n.cssRules).forEach(function(t){o.appendChild(e.createTextNode(t.cssText))}),t.head.appendChild(o)}else if(n.href){var r=e.createElement("link");r.rel="stylesheet",r.href=n.href,t.head.appendChild(r)}})}function toWindowFeatures(e){return Object.keys(e).reduce(function(t,n){var o=e[n];return"boolean"==typeof o?t.push(n+"="+(o?"yes":"no")):t.push(n+"="+o),t},[]).join(",")}import React from"react";import ReactDOM from"react-dom";var 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 {\n if (!this.window || this.window.closed) {\n this.release()\n }\n }, 50)\n\n // Check if the new window was succesfully opened.\n if (this.window) {\n this.window.document.title = title\n this.window.document.body.appendChild(this.container)\n\n // If specified, copy styles from parent window's document.\n if (this.props.copyStyles) {\n copyStyles(document, this.window.document)\n }\n\n // Release anything bound to this component before the new window unload.\n this.window.addEventListener('beforeunload', () => this.release())\n } else {\n\n // Handle error on opening of new window.\n if (typeof onBlock === 'function') {\n onBlock.call(null)\n } else {\n console.warn('A new window could not be opened. Maybe it was blocked.')\n }\n }\n }\n\n /**\n * Close the opened window (if any) when NewWindow will unmount.\n */\n componentWillUnmount() {\n if (this.window) {\n this.window.close()\n }\n }\n\n /**\n * Release the new window and anything that was bound to it.\n */\n release() {\n // This method can be called once.\n if (this.released) {\n return\n }\n this.released = true\n\n // Remove checker interval.\n clearInterval(this.windowCheckerInterval)\n\n // Call any function bound to the `onUnload` prop.\n const { onUnload } = this.props\n\n if (typeof onUnload === 'function') {\n onUnload.call(null)\n }\n }\n}\n\n/**\n * Utility functions.\n * @private\n */\n\n/**\n * Copy styles from a source document to a target.\n * @param {Object} source\n * @param {Object} target\n * @private\n */\n\nfunction copyStyles(source, target) {\n Array.from(source.styleSheets).forEach(styleSheet => {\n\n // For