rmc-notification

rmc-notification

React Notification UI Component
!NPM versionnpm-imagenpm-url !build statustravis-imagetravis-url !Test coveragecoveralls-imagecoveralls-url !gemnasium depsgemnasium-imagegemnasium-url !node versionnode-imagenode-url !npm downloaddownload-imagedownload-url

Development

npm install
npm start

Example

http://localhost:8000/examples/
online example: http://react-component.github.io/m-notification/examples/

Feature

• support ie8,ie8+,chrome,firefox,safari

install

Usage

var Notification = require('rmc-notification');
Notification.newInstance({}, notification => {
  notification.notice({
    content: 'content'
  });
});

API

Notification.newInstance(props, (notification) => void) => void

props details:

<thead>
<tr>
    <th style="width: 100px;">name</th>
    <th style="width: 50px;">type</th>
    <th style="width: 50px;">default</th>
    <th>description</th>
</tr>
</thead>
<tbody>
    <tr>
      <td>prefixCls</td>
      <td>String</td>
      <td></td>
      <td>prefix class name for notification container</td>
    </tr>
    <tr>
      <td>style</td>
      <td>Object</td>
      <td>{'top': 65, left: '50%'}</td>
      <td>additional style for notification container.</td>
    </tr>
    <tr>
      <td>getContainer</td>
      <td>getContainer(): HTMLElement</td>
      <td></td>
      <td>function returning html node which will act as notification container</td>
    </tr>
</tbody>

notification.notice(props)

props details:

<thead>
<tr>
    <th style="width: 100px;">name</th>
    <th style="width: 50px;">type</th>
    <th style="width: 50px;">default</th>
    <th>description</th>
</tr>
</thead>
<tbody>
    <tr>
      <td>content</td>
      <td>React.Element</td>
      <td></td>
      <td>content of notice</td>
    </tr>
    <tr>
      <td>key</td>
      <td>String</td>
      <td></td>
      <td>id of this notice</td>
    </tr>
    <tr>
      <td>closable</td>
      <td>Boolean</td>
      <td></td>
      <td>whether show close button</td>
    </tr>
    <tr>
      <td>onClose</td>
      <td>Function</td>
      <td></td>
      <td>called when notice close</td>
    </tr>
    <tr>
      <td>duration</td>
      <td>number</td>
      <td>1.5</td>
      <td>after duration of time, this notice will disappear.(seconds)</td>
    </tr>
    <tr>
      <td>style</td>
      <td>Object</td>
      <td> { right: '50%' } </td>
      <td>additional style for single notice node.</td>
    </tr>
</tbody>

notification.removeNotice(key:string)

remove single notice with specified key

notification.destroy()

destroy current notification

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rmc-notification is released under the MIT license.