diff --git a/README.md b/README.md index 09f8e84..8885a0f 100644 --- a/README.md +++ b/README.md @@ -94,6 +94,7 @@ The notification object has the following properties: |------------ |--------------- |--------- |------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | title | string | null | Title of the notification | | message | string | null | Message of the notification | +| getContentComponent | function | null | Return a React component to display in the notification (override other settings) | | 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 | diff --git a/src/NotificationItem.jsx b/src/NotificationItem.jsx index eba803d..b09b71a 100644 --- a/src/NotificationItem.jsx +++ b/src/NotificationItem.jsx @@ -241,6 +241,8 @@ var NotificationItem = React.createClass({ var actionButton = null; var title = null; var message = null; + var content; + var getContentComponent = notification.getContentComponent; if (this.state.visible) { className = className + ' notification-visible'; @@ -304,12 +306,20 @@ var NotificationItem = React.createClass({ ); } + if (getContentComponent) { + content = getContentComponent(notification.uid); + } else { + content = [ + title, + message, + dismiss, + actionButton + ]; + } + return (
- { title } - { message } - { dismiss } - { actionButton } + { content }
); } diff --git a/src/constants.js b/src/constants.js index 59538d5..db67b0d 100644 --- a/src/constants.js +++ b/src/constants.js @@ -26,7 +26,8 @@ var CONSTANTS = { position: 'tr', autoDismiss: 5, dismissible: true, - action: null + action: null, + getContentComponent: null } };