Merge pull request #28 from wordbots/master

Use prop-types package instead of accessing PropTypes via main React package (deprecated)

Author: georgeOsdDev

README.md

@@ -23,18 +23,18 @@ React component which wrap web-notification.
 
 ```javascript
 Notification.propTypes = {
-  ignore: React.PropTypes.bool,
-  disableActiveWindow: React.PropTypes.bool,
-  notSupported: React.PropTypes.func,
-  onPermissionGranted: React.PropTypes.func,
-  onPermissionDenied: React.PropTypes.func,
-  onShow: React.PropTypes.func,
-  onClick: React.PropTypes.func,
-  onClose: React.PropTypes.func,
-  onError: React.PropTypes.func,
-  timeout: React.PropTypes.number,
-  title: React.PropTypes.string.isRequired,
-  options: React.PropTypes.object
+  ignore: bool,
+  disableActiveWindow: bool,
+  notSupported: func,
+  onPermissionGranted: func,
+  onPermissionDenied: func,
+  onShow: func,
+  onClick: func,
+  onClose: func,
+  onError: func,
+  timeout: number,
+  title: string.isRequired,
+  options: object
 };
 
 ```

lib/components/Notification.js

@@ -1,15 +1,17 @@
 'use strict';
 
-var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
 var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
+var _propTypes = require('prop-types');
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -29,13 +31,13 @@ var seqGen = function seqGen() {
 };
 var seq = seqGen();
 
-var Notification = (function (_React$Component) {
+var Notification = function (_React$Component) {
   _inherits(Notification, _React$Component);
 
   function Notification(props) {
     _classCallCheck(this, Notification);
 
-    var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Notification).call(this, props));
+    var _this = _possibleConstructorReturn(this, (Notification.__proto__ || Object.getPrototypeOf(Notification)).call(this, props));
 
     var supported = false;
     var granted = false;
@@ -44,8 +46,6 @@ var Notification = (function (_React$Component) {
       if (window.Notification.permission === PERMISSION_GRANTED) {
         granted = true;
       }
-    } else {
-      supported = false;
     }
 
     _this.state = {
@@ -137,34 +137,32 @@ var Notification = (function (_React$Component) {
 
       var doNotShowOnActiveWindow = this.props.disableActiveWindow && this.windowFocus;
       if (!this.props.ignore && this.props.title && this.state.supported && this.state.granted && !doNotShowOnActiveWindow) {
-        (function () {
 
-          var opt = _this3.props.options;
-          if (typeof opt.tag !== 'string') {
-            opt.tag = 'web-notification-' + seq();
-          }
+        var opt = this.props.options;
+        if (typeof opt.tag !== 'string') {
+          opt.tag = 'web-notification-' + seq();
+        }
 
-          if (!_this3.notifications[opt.tag]) {
-            var n = new window.Notification(_this3.props.title, opt);
-            n.onshow = function (e) {
-              _this3.props.onShow(e, opt.tag);
-              setTimeout(function () {
-                _this3.close(opt.tag);
-              }, _this3.props.timeout);
-            };
-            n.onclick = function (e) {
-              _this3.props.onClick(e, opt.tag);
-            };
-            n.onclose = function (e) {
-              _this3.props.onClose(e, opt.tag);
-            };
-            n.onerror = function (e) {
-              _this3.props.onError(e, opt.tag);
-            };
-
-            _this3.notifications[opt.tag] = n;
-          }
-        })();
+        if (!this.notifications[opt.tag]) {
+          var n = new window.Notification(this.props.title, opt);
+          n.onshow = function (e) {
+            _this3.props.onShow(e, opt.tag);
+            setTimeout(function () {
+              _this3.close(n);
+            }, _this3.props.timeout);
+          };
+          n.onclick = function (e) {
+            _this3.props.onClick(e, opt.tag);
+          };
+          n.onclose = function (e) {
+            _this3.props.onClose(e, opt.tag);
+          };
+          n.onerror = function (e) {
+            _this3.props.onError(e, opt.tag);
+          };
+
+          this.notifications[opt.tag] = n;
+        }
       }
 
       // return null cause
@@ -173,9 +171,9 @@ var Notification = (function (_React$Component) {
     }
   }, {
     key: 'close',
-    value: function close(tag) {
-      if (this.notifications[tag] && typeof this.notifications[tag].close === 'function') {
-        this.notifications[tag].close();
+    value: function close(n) {
+      if (n && typeof n.close === 'function') {
+        n.close();
       }
     }
 
@@ -189,22 +187,22 @@ var Notification = (function (_React$Component) {
   }]);
 
   return Notification;
-})(_react2.default.Component);
+}(_react2.default.Component);
 
 Notification.propTypes = {
-  ignore: _react2.default.PropTypes.bool,
-  disableActiveWindow: _react2.default.PropTypes.bool,
-  askAgain: _react2.default.PropTypes.bool,
-  notSupported: _react2.default.PropTypes.func,
-  onPermissionGranted: _react2.default.PropTypes.func,
-  onPermissionDenied: _react2.default.PropTypes.func,
-  onShow: _react2.default.PropTypes.func,
-  onClick: _react2.default.PropTypes.func,
-  onClose: _react2.default.PropTypes.func,
-  onError: _react2.default.PropTypes.func,
-  timeout: _react2.default.PropTypes.number,
-  title: _react2.default.PropTypes.string.isRequired,
-  options: _react2.default.PropTypes.object
+  ignore: _propTypes.bool,
+  disableActiveWindow: _propTypes.bool,
+  askAgain: _propTypes.bool,
+  notSupported: _propTypes.func,
+  onPermissionGranted: _propTypes.func,
+  onPermissionDenied: _propTypes.func,
+  onShow: _propTypes.func,
+  onClick: _propTypes.func,
+  onClose: _propTypes.func,
+  onError: _propTypes.func,
+  timeout: _propTypes.number,
+  title: _propTypes.string.isRequired,
+  options: _propTypes.object
 };
 
 Notification.defaultProps = {

package.json

@@ -50,6 +50,7 @@
     "karma-safari-launcher": "^0.1.1",
     "karma-spec-reporter": "0.0.23",
     "mocha": "^2.3.4",
+    "prop-types": "^15.5.8",
     "react-addons-test-utils": "^0.14.3 || ^15.0.1",
     "react-dom": "^0.14.3 || ^15.0.1",
     "rimraf": "^2.4.4",

src/components/Notification.js

@@ -1,6 +1,7 @@
 'use strict';
 
 import React from 'react';
+import { bool, func, number, object, string } from 'prop-types';
 
 const PERMISSION_GRANTED = 'granted';
 const PERMISSION_DENIED = 'denied';
@@ -147,19 +148,19 @@ class Notification extends React.Component {
 }
 
 Notification.propTypes = {
-  ignore: React.PropTypes.bool,
-  disableActiveWindow: React.PropTypes.bool,
-  askAgain: React.PropTypes.bool,
-  notSupported: React.PropTypes.func,
-  onPermissionGranted: React.PropTypes.func,
-  onPermissionDenied: React.PropTypes.func,
-  onShow: React.PropTypes.func,
-  onClick: React.PropTypes.func,
-  onClose: React.PropTypes.func,
-  onError: React.PropTypes.func,
-  timeout: React.PropTypes.number,
-  title: React.PropTypes.string.isRequired,
-  options: React.PropTypes.object
+  ignore: bool,
+  disableActiveWindow: bool,
+  askAgain: bool,
+  notSupported: func,
+  onPermissionGranted: func,
+  onPermissionDenied: func,
+  onShow: func,
+  onClick: func,
+  onClose: func,
+  onError: func,
+  timeout: number,
+  title: string.isRequired,
+  options: object
 };
 
 Notification.defaultProps = {