Skip to content

Commit

Permalink
Merge branch 'release/0.2.17'
Browse files Browse the repository at this point in the history
  • Loading branch information
igorprado committed Feb 22, 2018

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
2 parents d37db94 + 380ce74 commit edca510
Showing 11 changed files with 6,611 additions and 78 deletions.
2 changes: 1 addition & 1 deletion .eslintignore
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
node_modeules/
node_modules/
dist/
4 changes: 4 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
# CHANGELOG

## 0.2.17 - Feb 21, 2018

* Dismissible enhancements (thanks to @marudor)

## 0.2.16 - Oct 19, 2017

* Support for React 16 (thanks to @marudor)
4 changes: 2 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
@@ -107,7 +107,7 @@ The notification object has the following properties:
| level | string | null | Level of the notification. Available: **success**, **error**, **warning** and **info** |
| 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) |
| dismissible | string | both | Settings controlling how the user can dismiss the notification and whether the dismiss button is visible. Available: **both (The disable button is visible and the user can click anywhere on the notification to dismiss)**, **click (The disable button is NOT visible and the user can click anywhere on the notification to dismiss)**, **button (The user can click on the disable button to dismiss the notifiction)**, **none (None [See more](#dismissible))** |
| action | object | null | Add a button with label and callback function (callback is optional). [See more](#action) |
| children | element,string | null | Adds custom content, and overrides `action` (if defined) [See more](#children) |
| 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'); }` |
@@ -117,7 +117,7 @@ The notification object has the following properties:

### Dismissible

If set to false, the notification will not display the dismiss ('x') button and will only be dismissible programmatically or after autoDismiss timeout. [See more](#removenotificationnotification)
If set to 'none', the button will only be dismissible programmatically or after autoDismiss timeout. [See more](#removenotificationnotification)

### Action

20 changes: 18 additions & 2 deletions example/src/scripts/App.jsx
Original file line number Diff line number Diff line change
@@ -54,6 +54,14 @@ NotificationSystemExample = createReactClass({
position: 'tr',
autoDismiss: 0
},
{
title: 'I don\'t have a dismiss button...',
message: 'But you can still click to get rid of me.',
autoDismiss: 0,
level: 'success',
position: 'tr',
dismissible: 'click'
},
{
title: 'Bad things can happen too!',
message: 'Four notification types: `success`, `error`, `warning` and `info`',
@@ -87,6 +95,14 @@ NotificationSystemExample = createReactClass({
autoDismiss: 0,
level: 'error',
position: 'br'
},
{
title: 'I\'m here forever...',
message: 'Until you click the dismiss button.',
autoDismiss: 0,
level: 'error',
position: 'br',
dismissible: 'button'
}
],

@@ -143,8 +159,8 @@ NotificationSystemExample = createReactClass({
<small className="more-magic">Click twice for more awesomeness!</small>
</div>
<div className="github-buttons">
<a className="github-button" href="https://github.com/igorprado/react-notification-system" data-style="mega" data-icon="octicon-star" data-count-href="/igorprado/react-notification-system/stargazers" data-count-api="/repos/igorprado/react-notification-system#stargazers_count" data-count-aria-label="# stargazers on GitHub" aria-label="Star igorprado/react-notification-system on GitHub">Star</a>
<a className="github-button" href="https://github.com/igorprado/react-notification-system/fork" data-style="mega" data-icon="octicon-repo-forked" data-count-href="/igorprado/react-notification-system/network" data-count-api="/repos/igorprado/react-notification-system#forks_count" data-count-aria-label="# forks on GitHub" aria-label="Fork igorprado/react-notification-system on GitHub">Fork</a>
<a className="github-button" href="https://github.com/igorprado/react-notification-system" data-size="large" data-icon="octicon-star" data-count-href="/igorprado/react-notification-system/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star igorprado/react-notification-system on GitHub">Star</a>
<a className="github-button" href="https://github.com/igorprado/react-notification-system/fork" data-size="large" data-icon="octicon-repo-forked" data-count-href="/igorprado/react-notification-system/network" data-show-count="true" data-count-aria-label="# forks on GitHub" aria-label="Fork igorprado/react-notification-system on GitHub">Fork</a>
</div>
</div>
</header>
29 changes: 11 additions & 18 deletions example/src/scripts/NotificationGenerator.jsx
Original file line number Diff line number Diff line change
@@ -62,15 +62,6 @@ module.exports = createReactClass({
console.log('%cNotification ' + notification.uid + ' was removed.', 'font-weight: bold; color: #eb4d00');
},

_changedDismissible: function() {
var notification = this.state.notification;
notification.dismissible = !notification.dismissible;

this.setState({
notification: notification
});
},

_changedAllowHTML: function() {
var state = this.state;
var allowHTML = !this.state.allowHTML;
@@ -124,7 +115,7 @@ module.exports = createReactClass({
level: 'error',
position: 'tr',
autoDismiss: 5,
dismissible: true,
dismissible: 'both',
action: null,
actionState: false
},
@@ -228,20 +219,22 @@ module.exports = createReactClass({
<small className={ error.level }>Open console to see the error after creating a notification.</small>
</div>

<div className="form-group">
<label>Dismissible:</label>
<select className="form-control" name="dismissible" onChange={ this._changed } value={ notification.dismissible }>
<option value="both">Both (both)</option>
<option value="click">Click (no dismiss button) (click)</option>
<option value="button">Dismiss button only (button)</option>
<option value="none">None (none)</option>
</select>
</div>

<div className="form-group">
<label>Auto Dismiss:</label>
<input className="form-control" name="autoDismiss" onChange={ this._changed } type="text" value={ notification.autoDismiss }/>
<small>secs (0 means infinite)</small>
</div>

<div className="form-group">
<div className="checkbox">
<label>
<input checked={ notification.dismissible } onChange={ this._changedDismissible } type="checkbox"/> Can user dismiss?
</label>
</div>
</div>

<div className="form-group">
<div className="checkbox">
<label>
Loading

0 comments on commit edca510

Please sign in to comment.