react-typescript-notify v1.0.0

React Typescript Notify

Requirements

• React
• Typescript

Installation

import '../react-typescript-notify/style.css';
import Notify from '../react-typescript-notify';

Example

export default class App extends React.Component<Props, State>{

    public notifyRef:any;

    constructor() {
        super();
    }

    notifyShow = () => {
        this.notifyRef.show(); 
    }

    render() {
        return (
            <div>
                <Notify 
                    ref={instance => { this.notifyRef = instance; }}
                    appearance="success"
                    text="Hello World !"
                    autoDismiss={true}
                    bgColor='rgb(241, 52, 52)'
                    iconBgColor='rgb(204, 6, 6)'
                    textColor='rgb(255, 255, 255)'
                    closeButtonColor='rgb(255, 255, 255)'
                ></Notify>
                <button onClick={() => { this.notifyShow() }}>Show Notify</button>
            </div>
        );
    }
}

Setting

• text: Notify display text
• appearance: Notify type (eg: success, warning, error)
• autoDismiss: Automatic hiding (eg: true/false)
• autoDismissTimeOut: Automatic hiding time (milisecond)
• bgColor: Notify background color (hex/rgb)
• iconBgColor: Notify icon background color (hex/rgb)
• textColor: Notify display text color (hex/rgb)
• closeButtonColor: Notify close button color (hex/rgb)

Notice

Appearance variable works when bgColor, iconBgColor, textColor and closeButtonColor are empty.

Atakan Yasin Uludag https://www.atknuludag.com