Socket
Socket
Sign inDemoInstall

react-redux-toastr

Package Overview
Dependencies
Maintainers
1
Versions
134
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-redux-toastr - npm Package Compare versions

Comparing version 3.0.0 to 3.0.1

src/largetext.js

6

CHANGELOG.md
#3.0.0
Remove dangerouslysetinnerhtml and implment component option.
Remove `dangerouslysetinnerhtml` and implment `component` `option`.
instead of use `dangerouslysetinnerhtml` you can pass on react component in the `toastr` `options` so is up to you what and how you wanna display your `toastr`
instead of using the `dangerouslysetinnerhtml` now you can pass a react component in the `toastr` `options` so is up to you what and how you wanna display your `toastr`
If you wanna contribute just fork the repo run `npm i`, `npm start` and you're ready
#2.1.0

@@ -9,0 +7,0 @@ change ReduxToastr props name from `confirm` to `confirmOptions`

{
"name": "react-redux-toastr",
"version": "3.0.0",
"version": "3.0.1",
"description": "react-redux-toastr is a React toastr message implemented with Redux",

@@ -5,0 +5,0 @@ "main": "lib/index.js",

@@ -100,3 +100,3 @@ ##`react-redux-toastr` [demo](http://diegoddox.github.io/react-redux-toastr/)

onHideComplete: () => console.log('HIDE: animation is done'),
component: React.Component({...})
component: React.Component
}

@@ -118,3 +118,3 @@

onHideComplete: () => console.log('HIDE: animation is done'),
component: React.Component({...})
component: React.Component
};

@@ -121,0 +121,0 @@ toastr.message('Title', toastrMessageOptions)

@@ -5,3 +5,3 @@ 'use strict';

import './toastr/less/index.less';
import React, {Component, PropTypes} from 'react';
import React, {Component, PropTypes, dangerouslySetInnerHTML} from 'react'; // eslint-disable-line no-unused-vars
import {Provider} from 'react-redux';

@@ -12,2 +12,3 @@ import ReduxToastr, {toastr} from './toastr/';

import LongText from './largetext';
import loremIpsum from 'lorem-ipsum';

@@ -24,2 +25,9 @@

class messageComp extends Component {
static displayName = 'MMCmessageComp';
render() {
return <div dangerouslySetInnerHTML={{__html: LongText}} />;
}
}
export default class App extends Component {

@@ -54,6 +62,6 @@ static displayName = 'ReduxModalDev';

<button type="button" onClick={this.add.bind(this)}>success</button>
<button type="button" onClick={() => toastr.info('## Success', loremIpsum())}>info</button>
<button type="button" onClick={() => toastr.info('## Info', loremIpsum())}>info</button>
<button type="button" onClick={() => toastr.error('## Error', {timeOut: 4000, component: comp})}>error</button>
<button type="button" onClick={() => toastr.warning('## Warning', loremIpsum())}>warning</button>
<button type="button" onClick={() => toastr.message('## message', loremIpsum())}>message</button>
<button type="button" onClick={() => toastr.message('## Message', {component: messageComp})}>message</button>
</div>

@@ -60,0 +68,0 @@ {this.renderDev()}

@@ -124,3 +124,7 @@ 'use strict';

{this.props.item.message && <div className="message">{this.props.item.message}</div>}
{this.props.item.options.component && <this.props.item.options.component />}
{this.props.item.options.component &&
<div className="message">
<this.props.item.options.component />
</div>
}
</div>

@@ -127,0 +131,0 @@ </div>

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc