Input Popup

Input Popup is an angular component that allows you to create a popup with a input for the user to enter something in and get the data that they input.

Installation

npm install input-popup

Usage

import { InputValueComponent } from 'input-popup';
import { MatDialog } from '@angular/material/dialog';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss']
})
export class AppComponent {
    constructor(private dialog: MatDialog) { }

    async someFunction() {
        // the color property is the color of the title, default is black
        const config: MatDialogConfig<any> = {data: {title: "What is your name?", name: "Name", color: "#324ea8"}};
        const data: null | string = await this.dialog.open(InputValueComponent, config).afterClosed().toPromise();
        // data will either be null or the string value of the input
        if (data == null) {
            return; // the user closed the dialog or did not provide any value
        }
        else {
            console.log(data); // the value the user inputted
        }
    }
    
}

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

MIT