facilitate server side rendering

Author: mohsinulhaq

.size-snapshot.json

@@ -1,25 +1,25 @@
 {
   "dist/index.js": {
-    "bundled": 6414,
-    "minified": 6414,
-    "gzipped": 2026
+    "bundled": 6537,
+    "minified": 6537,
+    "gzipped": 2070
   },
   "lib/cjs/index.js": {
-    "bundled": 12375,
-    "minified": 6670,
-    "gzipped": 1957
+    "bundled": 12566,
+    "minified": 6825,
+    "gzipped": 2015
   },
   "lib/esm/index.js": {
-    "bundled": 12333,
-    "minified": 6652,
-    "gzipped": 1957,
+    "bundled": 12524,
+    "minified": 6807,
+    "gzipped": 2017,
     "treeshaked": {
       "rollup": {
-        "code": 6162,
+        "code": 6285,
         "import_statements": 361
       },
       "webpack": {
-        "code": 7467
+        "code": 7592
       }
     }
   }

README.md

@@ -1,7 +1,6 @@
 # React Tooltip
 [![npm version](https://img.shields.io/npm/v/react-popper-tooltip.svg?style=flat-square)](https://www.npmjs.com/package/react-popper-tooltip)
-[![npm downloads](https://img.shields.io/npm/dt/react-popper-tooltip.svg?style=flat-square)](https://www.npmjs.com/package/react-popper-tooltip)
-[![gzip size](https://img.badgesize.io/https://unpkg.com/react-popper-tooltip?compression=gzip&style=flat-square)](https://unpkg.com/react-popper-tooltip)
+[![npm downloads](https://img.shields.io/npm/dm/react-popper-tooltip.svg?style=flat-square)](https://www.npmjs.com/package/react-popper-tooltip)
 [![Dependency Status](https://img.shields.io/david/mohsinulhaq/react-popper-tooltip.svg?style=flat-square)](https://david-dm.org/mohsinulhaq/react-popper-tooltip)
 [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
 ![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)

src/TooltipTrigger.js

@@ -6,7 +6,7 @@ import { createPortal } from 'react-dom';
 import T from 'prop-types';
 import { Manager, Reference, Popper } from 'react-popper';
 import Tooltip from './Tooltip';
-import { TooltipContext, callAll, noop } from './utils';
+import { TooltipContext, callAll, noop, canUseDOM } from './utils';
 
 const DEFAULT_MODIFIERS = {
   preventOverflow: {
@@ -72,7 +72,7 @@ export default class TooltipTrigger extends PureComponent {
     /**
      * element to be used as portal container
      */
-    portalContainer: T.instanceOf(HTMLElement),
+    portalContainer: canUseDOM() ? T.instanceOf(HTMLElement) : T.object,
     /**
      * modifiers passed directly to the underlying popper.js instance
      * For more information, refer to Popper.js’ modifier docs:
@@ -89,8 +89,8 @@ export default class TooltipTrigger extends PureComponent {
     trigger: 'hover',
     closeOnOutOfBoundaries: true,
     onVisibilityChange: noop,
-    usePortal: true,
-    portalContainer: document.body
+    usePortal: canUseDOM(),
+    portalContainer: canUseDOM() ? document.body : null
   };
 
   state = {

src/utils.js

@@ -6,3 +6,10 @@ export const callAll = (...fns) => (...args) =>
   fns.forEach(fn => fn && fn(...args));
 
 export const noop = () => {};
+
+export const canUseDOM = () =>
+  !!(
+    typeof window !== 'undefined' &&
+    window.document &&
+    window.document.createElement
+  );

typings/react-popper-tooltip.d.ts

@@ -115,7 +115,7 @@ declare module 'react-popper-tooltip' {
      * Element to be used as portal container
      * Defaults to document.body.
      */
-    portalContainer?: HTMLElement;
+    portalContainer?: any;
     /**
      * Modifiers passed directly to the underlying popper.js instance. For more
      * information, refer to Popper.js’ [modifier docs](https://popper.js.org/popper-documentation.html#modifiers).