react-notification - npm Package Compare versions

Comparing version 2.3.0 to 3.0.0

dist/notification.js

@@ -57,2 +57,3 @@ 'use strict';
           transition: '.5s cubic-bezier(0.89, 0.01, 0.5, 1.1)',
+
           // Trigger GPU acceleration
@@ -128,7 +129,8 @@ WebkitTransform: 'translatez(0)',
       event.preventDefault();
+
       if (_this.props.onClick && typeof _this.props.onClick === 'function') {
-        _this.props.onClick();
-      } else {
-        return;
+        return _this.props.onClick(event);
       }
+
+      return event;
     };
@@ -162,3 +164,6 @@ }
           'span',
-          { className: 'notification-bar-message' },
+          {
+            ref: 'message',
+            className: 'notification-bar-message'
+          },
           this.props.message
@@ -168,3 +173,7 @@ ),
           'span',
-          { className: 'notification-bar-action', style: this.getActionStyle() },
+          {
+            ref: 'action',
+            className: 'notification-bar-action',
+            style: this.getActionStyle()
+          },
           this.props.action
@@ -184,3 +193,3 @@ ) : null
       dismissAfter: _react.PropTypes.number,
-      onDismis: _react.PropTypes.func,
+      onDismiss: _react.PropTypes.func,
       className: _react.PropTypes.string,
@@ -187,0 +196,0 @@ activeClassName: _react.PropTypes.string

examples/es2015/index.js

 import React, { Component } from 'react';
+import { render } from 'react-dom';
 import Notification from 'notification';
@@ -108,2 +109,2 @@
 
-React.render(<Example />, document.body);
+render(<Example />, document.querySelector('#mount'));

package.json

 {
   "name": "react-notification",
-  "version": "2.3.0",
+  "version": "3.0.0",
   "description": "Snackbar style notification component for React.",
@@ -13,3 +13,3 @@ "main": "dist/notification.js",
     "type": "git",
-    "url": "http://github.com/pburtchaell/react-notification"
+    "url": "https+git://github.com/pburtchaell/react-notification"
   },
@@ -32,14 +32,16 @@ "keywords": [
   "homepage": "https://github.com/pburtchaell/react-notification",
+  "peerDependencies": {
+    "react": "0.14.x"
+  },
   "dependencies": {
-    "object-assign": "^2.0.0",
-    "react": "^0.13.3"
+    "object-assign": "^3.0.0"
   },
   "devDependencies": {
-    "babel": "^5.5.8",
-    "babel-core": "^5.5.8",
-    "babel-eslint": "^3.1.23",
-    "babel-loader": "^5.1.4",
-    "eslint": "^0.24.0",
-    "eslint-config-airbnb": "0.0.6",
-    "eslint-plugin-react": "^2.6.4",
+    "babel": "^5.8.21",
+    "babel-core": "^5.8.22",
+    "babel-eslint": "^4.0.10",
+    "babel-loader": "^5.3.2",
+    "eslint": "^1.2.0",
+    "eslint-config-airbnb": "^0.0.7",
+    "eslint-plugin-react": "^3.2.3",
     "expect": "^1.6.0",
@@ -51,6 +53,9 @@ "html-webpack-plugin": "^1.6.0",
     "node-libs-browser": "^0.5.2",
-    "react-hot-loader": "^1.2.7",
-    "webpack": "^1.7.3",
-    "webpack-dev-server": "^1.9.0"
+    "react": "^0.14.2",
+    "react-addons-test-utils": "^0.14.2",
+    "react-dom": "^0.14.2",
+    "react-hot-loader": "^1.2.8",
+    "webpack": "^1.11.0",
+    "webpack-dev-server": "^1.10.1"
   }
 }

README.md

@@ -7,8 +7,4 @@ # react-notification [![npm version](https://badge.fury.io/js/react-notification.svg)](http://badge.fury.io/js/react-notification) [![Dependency Status](https://david-dm.org/pburtchaell/react-classes.svg)](https://david-dm.org/pburtchaell/react-notification)
 
-**NOTICE: If you are using the React 0.14.0 beta, you can install the compatible version of this component with `npm i react-notification@2.2.0-beta -S`.**
-
 This is a component designed to provide "[snackbar](http://www.google.com/design/spec/components/snackbars-toasts.html#snackbars-toasts-usage)" notification messages. I would suggest reading the usage guidelines for [snackbars](http://www.google.com/design/spec/components/snackbars-toasts.html#).
 
-Please read the [contributing guide](/CONTRUBUTING.md) if you are interested in contributing. If you are coming from version 1.0.0, there is an [upgrade guide](/UPGRADING.md) to help you make the switch. If you have questions, please feel free to create an issue on GitHub or message me (@pburtchaell) on the [Reactiflux Slack community](http://www.reactiflux.com/).
-
 ## Getting Started
@@ -18,2 +14,6 @@
 
+If you are using the React 0.13.x or lower, you can install the previously compatible version of this component with `npm i react-notification@2.3.0 -S`. The current version only works with React 0.14.x.
+
+Please read the [contributing guide](/CONTRUBUTING.md) if you are interested in contributing. If you are coming from version 1.0.0, there is an [upgrade guide](/UPGRADING.md) to help you make the switch. If you have questions, please feel free to create an issue on GitHub or message me (@pburtchaell) on the [Reactiflux Slack community](http://www.reactiflux.com/).
+
 ## Usage
@@ -20,0 +20,0 @@

test/notification.js

@@ -1,3 +0,3 @@
-import React from 'react/addons';
-import ExecutionEnvironment from 'react/lib/ExecutionEnvironment';
+import React from 'react';
+import TestUtils from 'react-addons-test-utils';
 import jsdom from 'mocha-jsdom';
@@ -7,4 +7,2 @@ import expect from 'expect';
 
-let TestUtils = React.addons.TestUtils;
-
 const MOCK = {
@@ -31,5 +29,16 @@ message: 'Test',
   jsdom();
-  ExecutionEnvironment.canUseDOM = true;
 
-  it('should render message and action text', done => {
+  it('should be a valid element', done => {
+    const component = (
+      <Notification
+        message={MOCK.message}
+        action={MOCK.action}
+        onClick={MOCK.onClick}
+      />
+    );
+
+    if (TestUtils.isElement(component)) done();
+  });
+
+  it('should render correct message and action text', done => {
     const tree = TestUtils.renderIntoDocument(
@@ -43,8 +52,7 @@ <Notification
 
-    let message = TestUtils.findRenderedDOMComponentWithClass(tree, 'notification-bar-message');
+    let { message, action } = tree.refs;
 
-    let action = TestUtils.findRenderedDOMComponentWithClass(tree, 'notification-bar-action');
+    expect(message.innerHTML).toBe(MOCK.message);
+    expect(action.innerHTML).toBe(MOCK.action);
 
-    expect(message.props.children).toBe(MOCK.message);
-    expect(action.props.children).toBe(MOCK.action);
     done();
@@ -51,0 +59,0 @@ });

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

125425

increased by0.27%

Lines of code

379

increased by3.84%

Worsened metrics

Dev dependency count

19

increased by18.75%

Dependency changes

• + Addedasap@2.0.6(transitive)

• + Addedcore-js@1.2.7(transitive)

• + Addedfbjs@0.6.1(transitive)

• + Addedjs-tokens@4.0.0(transitive)

• + Addedloose-envify@1.4.0(transitive)

• + Addedobject-assign@3.0.0(transitive)

• + Addedpromise@7.3.1(transitive)

• + Addedreact@0.14.10(transitive)

• + Addedua-parser-js@0.7.39(transitive)

• + Addedwhatwg-fetch@0.9.0(transitive)

• - Removedreact@^0.13.3

• - Removedreact@0.13.3(transitive)

• Updatedobject-assign@^3.0.0