Nerds Pledge Magnanimously

    @sweetalert/with-react

    0.1.1 • Public • Published

    SweetAlert for React

    Easily render React components within your SweetAlert modals.

    Why?

    Many other framework-specific versions of SweetAlert shy away from its JavaScript-based API and abstract it into a template-based system. This one instead embraces it (because JavaScript is awesome!) and lets you pass in components as options!

    This lets you continue to use features like Promises, but makes building advanced modal UIs much simpler.

    Install

    npm install @sweetalert/with-react

    Usage

    When passing JSX as the only parameter, it will replace SweetAlert's content option.

    import React from 'react';
    import swal from '@sweetalert/with-react';
    
    class App extends React.Component {
      componentDidMount() {
        swal(
          <div>
            <h1>Hello!</h1>        
            <p>I am a React component inside a SweetAlert modal.</p>
          </div>
        )
      }
    }

    You can also explicitly set the content option, if you want to set other options as well:

    swal({
      content: <div>Hello world!</div>,
      buttons: true,
    });

    Or use a combination of both:

    swal(<div>Hello world</div>, {
      buttons: true, 
    });

    Keywords

    none

    Install

    npm i @sweetalert/with-react

    DownloadsWeekly Downloads

    4,454

    Version

    0.1.1

    License

    MIT

    Unpacked Size

    3.72 kB

    Total Files

    5

    Last publish

    Collaborators

    • t4t5