7848.3e42f75a97d0d039.js

"use strict";(self.webpackChunknp_ui_lib_app=self.webpackChunknp_ui_lib_app||[]).push([[7848],{7848:(_,r,s)=>{s.r(r),s.d(r,{NpDialogDemoModule:()=>p});var d=s(6895),c=s(8379),o=s(5499),t=s(4650);function g(T,i){1&T&&t._uU(0," Are you sure to delete? This message is from template\n")}class a{constructor(i){this.dialogService=i,this.importText="import { NpDialogModule } from 'np-ui-lib';",this.serviceInjectText="constructor(private dialogService: NpDialogService) { }",this.dialogOpenText="this.dialogService.open('Dialog text', config, null);",this.configText='const config = new NpDialogConfig({ type:"alert" });',this.stringDialogText="this.dialogService.open('Basic dialog with string content', null, null);",this.templateDialogText="@ViewChild('dialogTemplate', { static: true }) dialogTemplate: TemplateRef<any>;\nthis.dialogService.open(this.dialogTemplate, null, null);",this.componentText='<span class="np-text-success">// ----For alert dialog, pass type="alert"</span>\nvar alert = this.dialogService.open("Message Text", config, null);\nalert.onClose.subscribe(() => {\n  <span class="np-text-success">// ----Continue with alert close"</span>\n});\n\n<span class="np-text-success">// ----For prompt dialog, pass type="prompt"</span>\nconst prompt = this.dialogService.open("Message Text", config, null);\nprompt.onClose.subscribe((data) => {\n  <span class="np-text-success">// if Ok button is clicked then returns input value as string</span>\n  <span class="np-text-success">// if Cancel button is clicked then returns input value as null</span>\n  if (data != undefined && data != null) {\n    alert(\'Ok button is clicked and input value is: \' + data);\n  } else {\n    alert(\'Cancel button is clicked\');\n  }\n});\n\n<span class="np-text-success">// ----For confirm dialog, pass type="confirm"</span>\nconst confirm = this.dialogService.open("Message Text", config, null, null);\nconfirm.onClose.subscribe((data) => {\n  <span class="np-text-success">// if Ok button is clicked then returns true</span>\n  <span class="np-text-success">// if Cancel button is clicked then returns false</span>\n  if (data) {\n    alert(\'Ok button is clicked\');\n  } else {\n    alert(\'Cancel button is clicked\');\n  }\n});'}ngOnInit(){}openAlert(){this.dialogService.open("Saved successfully.",new o.aj({type:"alert"}),null)}openPrompt(){this.dialogService.open("Enter your name",new o.aj({type:"prompt"}),null).onClose.subscribe(e=>{null!=e&&null!=e?alert("Ok button is clicked, input value is: "+e):alert("Cancel button is clicked")})}openConfirm(i){this.dialogService.open(i,new o.aj({type:"confirm",hasBackDrop:!1,styleClass:"myClass",inputId:"confirm1"}),null).onClose.subscribe(n=>{alert(n?"Ok button is clicked":"Cancel button is clicked")})}static#t=this.\u0275fac=function(e){return new(e||a)(t.Y36(o.rD))};static#e=this.\u0275cmp=t.Xpm({type:a,selectors:[["app-np-dialog-demo"]],decls:144,vars:7,consts:[[1,"page-header"],["title","Documentation"],[3,"innerText"],[1,"np-table"],[3,"innerHTML"],["title","Examples"],[1,"np-btn-group"],[1,"np-btn",3,"click"],["confirmMessage",""]],template:function(e,n){if(1&e){const m=t.EpF();t.TgZ(0,"h2",0),t._uU(1,"Dialog"),t.qZA(),t.TgZ(2,"np-tabs")(3,"np-tab",1)(4,"np-card")(5,"np-card-body")(6,"b"),t._uU(7,"Module to import"),t.qZA(),t.TgZ(8,"div")(9,"pre"),t._UZ(10,"code",2),t.qZA()()()(),t.TgZ(11,"np-card")(12,"np-card-body")(13,"b"),t._uU(14,"NpDialogService"),t.qZA(),t.TgZ(15,"p"),t._uU(16,"Inject NpDialogService into constructor of component"),t.qZA(),t.TgZ(17,"div")(18,"pre"),t._UZ(19,"code",2),t.qZA()()()(),t.TgZ(20,"np-card")(21,"np-card-body")(22,"b"),t._uU(23,"How to open dialog?"),t.qZA(),t.TgZ(24,"div")(25,"pre"),t._UZ(26,"code",2),t.qZA()(),t.TgZ(27,"b"),t._uU(28,"open(content: string | TemplateRef<any>, config: NpDialogConfig): NpDialogRef;"),t.qZA(),t.TgZ(29,"p"),t._uU(30," Here open method has 3 parameters, and this method return the overlay reference object of class "),t.TgZ(31,"b"),t._uU(32,"NpDialogRef"),t.qZA()(),t.TgZ(33,"table",3)(34,"tr")(35,"th"),t._uU(36,"Parameter"),t.qZA(),t.TgZ(37,"th"),t._uU(38,"Description"),t.qZA(),t.TgZ(39,"th"),t._uU(40,"Type"),t.qZA()(),t.TgZ(41,"tr")(42,"td"),t._uU(43,"content"),t.qZA(),t.TgZ(44,"td"),t._uU(45," Pass content of dialog "),t.TgZ(46,"pre"),t._UZ(47,"code",2),t.qZA(),t.TgZ(48,"pre"),t._UZ(49,"code",2),t.qZA(),t._uU(50," Here for dialogTemplate, let-data is available, where data is value passed in open method. "),t.qZA(),t.TgZ(51,"td"),t._uU(52,"string | TemplateRef<any>"),t.qZA()(),t.TgZ(53,"tr")(54,"td"),t._uU(55,"config"),t.qZA(),t.TgZ(56,"td"),t._uU(57," Pass dialog config with below properties. "),t.TgZ(58,"table",3)(59,"tr")(60,"th"),t._uU(61,"Property"),t.qZA(),t.TgZ(62,"th"),t._uU(63,"Description"),t.qZA(),t.TgZ(64,"th"),t._uU(65,"Type"),t.qZA(),t.TgZ(66,"th"),t._uU(67,"Default"),t.qZA()(),t.TgZ(68,"tr")(69,"td"),t._uU(70,"type"),t.qZA(),t.TgZ(71,"td"),t._uU(72,'Pass any of "alert" | "confirm" | "prompt"'),t.qZA(),t.TgZ(73,"td"),t._uU(74,"string"),t.qZA(),t.TgZ(75,"td"),t._uU(76,'"alert"'),t.qZA()(),t.TgZ(77,"tr")(78,"td"),t._uU(79,"hasBackDrop"),t.qZA(),t.TgZ(80,"td"),t._uU(81,"Has backdrop or not"),t.qZA(),t.TgZ(82,"td"),t._uU(83,"boolean"),t.qZA(),t.TgZ(84,"td"),t._uU(85,"true"),t.qZA()(),t.TgZ(86,"tr")(87,"td"),t._uU(88,"backDropClass"),t.qZA(),t.TgZ(89,"td"),t._uU(90,"Backdrop class name"),t.qZA(),t.TgZ(91,"td"),t._uU(92,"string"),t.qZA(),t.TgZ(93,"td"),t._uU(94,"np-dialog-backdrop"),t.qZA()(),t.TgZ(95,"tr")(96,"td"),t._uU(97,"styleClass"),t.qZA(),t.TgZ(98,"td"),t._uU(99,"Set extra class on component"),t.qZA(),t.TgZ(100,"td"),t._uU(101,"string"),t.qZA(),t._UZ(102,"td"),t.qZA(),t.TgZ(103,"tr")(104,"td"),t._uU(105,"inputId"),t.qZA(),t.TgZ(106,"td"),t._uU(107,"Set id attribute"),t.qZA(),t.TgZ(108,"td"),t._uU(109,"string"),t.qZA(),t._UZ(110,"td"),t.qZA()(),t.TgZ(111,"pre"),t._UZ(112,"code",4),t.qZA()(),t.TgZ(113,"td"),t._uU(114,"NpDialogConfig"),t.qZA()(),t.TgZ(115,"tr")(116,"td"),t._uU(117,"data"),t.qZA(),t.TgZ(118,"td"),t._uU(119," Pass data to dialog, for template this data is available as context. "),t.qZA(),t.TgZ(120,"td"),t._uU(121,"any"),t.qZA()()()()(),t.TgZ(122,"np-card")(123,"np-card-body")(124,"b"),t._uU(125,"How to subscribe onClose method of dialog?"),t.qZA(),t.TgZ(126,"p")(127,"b"),t._uU(128,"open"),t.qZA(),t._uU(129," method returns overlay reference object, which has property "),t.TgZ(130,"b"),t._uU(131,"onClose: Subject<any>"),t.qZA()(),t.TgZ(132,"pre"),t._UZ(133,"code",4),t.qZA()()()(),t.TgZ(134,"np-tab",5)(135,"div",6)(136,"button",7),t.NdJ("click",function(){return n.openAlert()}),t._uU(137,"Open Alert"),t.qZA(),t.TgZ(138,"button",7),t.NdJ("click",function(){return n.openPrompt()}),t._uU(139,"Open Prompt"),t.qZA(),t.TgZ(140,"button",7),t.NdJ("click",function(){t.CHM(m);const f=t.MAs(143);return t.KtG(n.openConfirm(f))}),t._uU(141," Open Confirm "),t.qZA()()()(),t.YNc(142,g,1,0,"ng-template",null,8,t.W1O)}2&e&&(t.xp6(10),t.Q6J("innerText",n.importText),t.xp6(9),t.Q6J("innerText",n.serviceInjectText),t.xp6(7),t.Q6J("innerText",n.dialogOpenText),t.xp6(21),t.Q6J("innerText",n.stringDialogText),t.xp6(2),t.Q6J("innerText",n.templateDialogText),t.xp6(63),t.Q6J("innerHTML",n.configText,t.oJD),t.xp6(21),t.Q6J("innerHTML",n.componentText,t.oJD))},dependencies:[o.KA,o.Qk,o.c0,o.El],encapsulation:2})}const Z=[{path:"",component:a}];class l{static#t=this.\u0275fac=function(e){return new(e||l)};static#e=this.\u0275mod=t.oAB({type:l});static#n=this.\u0275inj=t.cJS({imports:[c.Bz.forChild(Z),c.Bz]})}class p{static#t=this.\u0275fac=function(e){return new(e||p)};static#e=this.\u0275mod=t.oAB({type:p});static#n=this.\u0275inj=t.cJS({imports:[d.ez,l,o.pe,o.i7,o.Tk]})}}}]);