Brewer Map Dialog

Dynamic dialog component for Angular

npm i @brewermap/dialog

Setup

Be sure your app.module (or the module you wish to use the package) includes the DialogModule

import { DialogModule } from '@brewermap/dialog';

@NgModule({
  imports: [
    CommonModule,
    DialogModule
  ]
})

Usage

Simply import the DialogService and the DialogOverlayRef in the calling component (AppComponent for example):

import { DialogOverlayRef } from '@brewermap/dialog/lib/dialog.reference';
import { DialogService } from '@brewermap/dialog';

Then create an instance in the controller:

constructor( private myDialog: DialogService) {}

And finally inside a trigger function generate the reference to the dialog:

public openThemeDialog(): void {
    const myDialogRef: DialogOverlayRef = this.myDialog.open(
        string | TemplateRef<any> | Type<any>, // Could be a simple text, a component or a template reference
        'Title',
        null, // Data send
        'left' | 'right' | 'bottom' | 'center', // Position of the dialog
        boolean | string // Choose to show close button or the label for it
    );
}