Merge branch 'release/0.2.5'

.npmignore

@@ -11,5 +11,4 @@ devServer.js
 tests.webpack.js
 .travis.yml
 .editorconfig
-.eslintignore
-.eslintrc
+*.log

CHANGELOG.md

@@ -1,5 +1,11 @@
 # CHANGELOG
 
+## 0.2.5 - Oct 15, 2015
+
+**Implemented enhancements:**
+
+* Action property no longer needs a callback, just a label.
+
 ## 0.2.4 - Oct 12, 2015
 
 **Implemented enhancements:**

README.md

@@ -102,7 +102,7 @@ The notification object has the following properties:
 | position     | string          | tr        | Position of the notification. Available: **tr (top right)**, **tl (top left)**, **tc (top center)**, **br (bottom right)**, **bl (bottom left)**, **bc (bottom center)**  |
 | autoDismiss  | integer         | 5         | Delay in seconds for the notification go away. Set this to **0** to not auto-dismiss the notification                                                                      |
 | dismissible  | bool            | true      | Set if notification is dismissible by the user. [See more](#dismissible)                                                                                                  |
-| action       | object          | null      | Add a button with label and callback function. [See more](#action)                                                                                                        |
+| action       | object          | null      | Add a button with label and callback function (callback is optional). [See more](#action)                                                                                                        |
 | onAdd | function | null | A callback function that will be called when the notification is successfully added. The first argument is the original notification e.g. `function (notification) { console.log(notification.title + 'was added'); }` |
 | onRemove     | function        | null      | A callback function that will be called when the notification is about to be removed. The first argument is the original notification e.g. `function (notification) { console.log(notification.title + 'was removed'); }` |
 | uid          | integer/string           | null      | Overrides the internal `uid`. Useful if you are managing your notifications id. Notifications with same `uid` won't be displayed. |
@@ -114,7 +114,7 @@ If set to false, the notification will not display the dismiss ('x') button and
 
 ### Action
 
-Add a button and a callback function to the notification. If this button is clicked, the callback function is called and the notification is dismissed.
+Add a button and a callback function to the notification. If this button is clicked, the callback function is called (if provided) and the notification is dismissed.
 
 ```js
 notification = {

example/src/scripts/App.jsx

@@ -123,9 +123,10 @@ NotificationSystemExample = React.createClass({
         <div className="wrapper">
           <NotificationGenerator notifications={ this._notificationSystemInstance } allowHTML={ this._allowHTML } />
         </div>
-        <footer className="footer fractal">
+        <footer className="footer gradient">
+          <div className="overlay"></div>
           <div className="wrapper">
-            <p>Made in Brasília/Brazil by <a href="http://igorprado.com">Igor Prado</a>. <a href="https://github.com/igorprado/react-notification-system">See at Github</a>.</p>
+            <p>Made in Brasília, Brazil by <a href="http://igorprado.com" target="_blank">Igor Prado</a>.</p>
           </div>
         </footer>
         <NotificationSystem ref="notificationSystem" allowHTML={ this.state.allowHTML } />

example/src/styles/base.sass

@@ -21,6 +21,8 @@ html, body
   padding: 150px 0 0
   text-align: center
   border-bottom: 6px solid $blue-green
+  position: relative
+  height: auto
 
 .overlay
   background: url(../images/congruent_pentagon.png) top left repeat
@@ -30,13 +32,11 @@ html, body
   width: 100%
   height: 100%
   opacity: 0.3
+  background-attachment: fixed
 
 .content
   position: relative
 
-.fractal
-  background: url(../images/footer_lodyas.png) top left repeat;
-
 .gradient
   background: #00b7ea; /* Old browsers */
   background: -moz-linear-gradient(-45deg,  #00b7ea 0%, #8ca246 100%); /* FF3.6+ */
@@ -46,6 +46,7 @@ html, body
   background: -ms-linear-gradient(-45deg,  #00b7ea 0%,#8ca246 100%); /* IE10+ */
   background: linear-gradient(135deg,  #00b7ea 0%,#8ca246 100%); /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#8ca246',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
+  background-attachment: fixed
 
 .title
   color: #FFF
@@ -94,12 +95,14 @@ html, body
 .wrapper
   max-width: 520px
   margin: 40px auto 0
+  position: relative
 
 h2
   color: $blue-green
 
 a
-  color: #ffde00
+  color: $blue-green
+  font-weight: bold
 
 .hide
   display: none !important
@@ -108,3 +111,4 @@ a
   color: #FFF
   text-align: center
   padding: 20px 0
+  position: relative

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-notification-system",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "description": "A React Notification System fully customized",
   "main": "dist/NotificationSystem.js",
   "scripts": {

test/notification-system.test.js

@@ -228,6 +228,19 @@ describe('Notification Component', function() {
     done();
   });
 
+  it('should accept an action without callback function defined', done => {
+    notificationObj.action = {
+      label: 'Click me'
+    };
+
+    component.addNotification(notificationObj);
+    let button = TestUtils.findRenderedDOMComponentWithClass(instance, 'notification-action-button');
+    TestUtils.Simulate.click(button);
+    let notification = TestUtils.scryRenderedDOMComponentsWithClass(instance, 'notification');
+    expect(notification.length).toEqual(0);
+    done();
+  });
+
   it('should execute a callback function on add a notification', done => {
     let testThis = false;
     notificationObj.onAdd = function() {