7283.540d4462778b4454.js

"use strict";(self.webpackChunknp_ui_lib_app=self.webpackChunknp_ui_lib_app||[]).push([[7283],{7283:(q,_,r)=>{r.r(_),r.d(_,{NpRadioButtonDemoModule:()=>i});var c=r(6895),p=r(8379),t=r(4650),u=r(433),a=r(5499);const T=["gender8Group"];function A(s,g){if(1&s){const e=t.EpF();t.TgZ(0,"fieldset")(1,"legend"),t._uU(2,"Radio group horizontal"),t.qZA(),t.TgZ(3,"np-radio-group",6),t.NdJ("ngModelChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.gender1=n)}),t._UZ(4,"np-radio-button",7)(5,"np-radio-button",8),t.qZA(),t.TgZ(6,"div"),t._uU(7),t.qZA()(),t.TgZ(8,"fieldset")(9,"legend"),t._uU(10,"Radio group vertical"),t.qZA(),t.TgZ(11,"np-radio-group",9),t.NdJ("ngModelChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.gender2=n)}),t._UZ(12,"np-radio-button",10)(13,"np-radio-button",11),t.qZA(),t.TgZ(14,"div"),t._uU(15),t.qZA()(),t.TgZ(16,"fieldset")(17,"legend"),t._uU(18,"disabled and readonly"),t.qZA(),t.TgZ(19,"np-radio-group",12),t.NdJ("ngModelChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.gender3=n)}),t._UZ(20,"np-radio-button",10)(21,"np-radio-button",11),t.qZA(),t.TgZ(22,"np-radio-group",13),t.NdJ("ngModelChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.gender4=n)}),t._UZ(23,"np-radio-button",10)(24,"np-radio-button",11),t.qZA()(),t.TgZ(25,"fieldset")(26,"legend"),t._uU(27,"required"),t.qZA(),t.TgZ(28,"np-radio-group",14),t.NdJ("ngModelChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.gender5=n)}),t._UZ(29,"np-radio-button",10)(30,"np-radio-button",11),t.qZA(),t.TgZ(31,"button",15),t.NdJ("click",function(){t.CHM(e);const n=t.oxw();return t.KtG(n.gender5=null)}),t._uU(32,"Set null"),t.qZA()(),t.TgZ(33,"fieldset")(34,"legend"),t._uU(35,"styleClass"),t.qZA(),t.TgZ(36,"np-radio-group",16),t.NdJ("ngModelChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.gender6=n)}),t._UZ(37,"np-radio-button",10)(38,"np-radio-button",11),t.qZA()(),t.TgZ(39,"fieldset")(40,"legend"),t._uU(41,"onChange"),t.qZA(),t.TgZ(42,"np-radio-group",17),t.NdJ("ngModelChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.gender7=n)})("onChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.onChange(n))}),t._UZ(43,"np-radio-button",10)(44,"np-radio-button",11),t.qZA()(),t.TgZ(45,"fieldset")(46,"legend"),t._uU(47,"focus()"),t.qZA(),t.TgZ(48,"np-radio-group",18,19),t.NdJ("ngModelChange",function(n){t.CHM(e);const o=t.oxw();return t.KtG(o.gender8=n)}),t._UZ(50,"np-radio-button",10)(51,"np-radio-button",11),t.qZA(),t.TgZ(52,"div",20)(53,"div",15),t.NdJ("click",function(){t.CHM(e);const n=t.oxw();return t.KtG(n.setFocus())}),t._uU(54,"Set focus"),t.qZA()()()}if(2&s){const e=t.oxw();t.xp6(3),t.Q6J("ngModel",e.gender1)("tabIndex",1)("autoFocus",!0),t.xp6(4),t.hij("Selected: ",e.gender1,""),t.xp6(4),t.Q6J("ngModel",e.gender2)("tabIndex",2),t.xp6(4),t.hij("Selected: ",e.gender2,""),t.xp6(4),t.Q6J("ngModel",e.gender3)("disabled",!0),t.xp6(3),t.Q6J("ngModel",e.gender4)("readOnly",!0),t.xp6(6),t.Q6J("ngModel",e.gender5),t.xp6(8),t.Q6J("ngModel",e.gender6)("styleClass","myClass"),t.xp6(6),t.Q6J("ngModel",e.gender7),t.xp6(6),t.Q6J("ngModel",e.gender8)}}class l{constructor(){this.importText="import { NpRadioButtonModule } from 'np-ui-lib';",this.htmlText='<np-radio-button label="Male" value="Male"></np-radio-button>',this.groupHtmlText='<np-radio-group orientation="vertical" [(ngModel)]="gender" name="rgbGender">\n  <np-radio-button label="Male" value="1"></np-radio-button>\n  <np-radio-button label="Female" value="2"></np-radio-button>\n</np-radio-group>',this.gender2="1",this.gender3="1",this.gender4="1"}ngOnInit(){}onChange(g){alert(g)}setFocus(){this.gender8Group.focus()}static#t=this.\u0275fac=function(e){return new(e||l)};static#e=this.\u0275cmp=t.Xpm({type:l,selectors:[["app-np-radio-button-demo"]],viewQuery:function(e,d){if(1&e&&t.Gf(T,5),2&e){let n;t.iGM(n=t.CRH())&&(d.gender8Group=n.first)}},decls:213,vars:3,consts:[[1,"page-header"],["title","Documentation"],[3,"innerText"],[1,"np-table"],["title","Examples"],["npTabContent",""],["name","gender1",3,"ngModel","tabIndex","autoFocus","ngModelChange"],["label","Male","value","Male"],["label","Female","value","Female"],["orientation","vertical","name","gender2",3,"ngModel","tabIndex","ngModelChange"],["label","Male","value","1"],["label","Female","value","2"],["name","gender3",3,"ngModel","disabled","ngModelChange"],["name","gender4",3,"ngModel","readOnly","ngModelChange"],["name","gender5","required","",3,"ngModel","ngModelChange"],[1,"np-btn",3,"click"],["name","gender6",3,"ngModel","styleClass","ngModelChange"],["name","gender7",3,"ngModel","ngModelChange","onChange"],["name","gender8",3,"ngModel","ngModelChange"],["gender8Group",""],[1,"np-btn-group"]],template:function(e,d){1&e&&(t.TgZ(0,"h2",0),t._uU(1,"Radio Button"),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,"HTML"),t.qZA(),t.TgZ(15,"div")(16,"pre"),t._UZ(17,"code",2),t.qZA()(),t.TgZ(18,"b"),t._uU(19,"Radio Group"),t.qZA(),t.TgZ(20,"div")(21,"pre"),t._UZ(22,"code",2),t.qZA()()()(),t.TgZ(23,"np-card")(24,"np-card-body")(25,"b"),t._uU(26,"<np-radio-button>"),t.qZA(),t.TgZ(27,"table",3)(28,"tr")(29,"th"),t._uU(30,"Property"),t.qZA(),t.TgZ(31,"th"),t._uU(32,"Description"),t.qZA(),t.TgZ(33,"th"),t._uU(34,"Type"),t.qZA(),t.TgZ(35,"th"),t._uU(36,"Default"),t.qZA()(),t.TgZ(37,"tr")(38,"td"),t._uU(39,"label"),t.qZA(),t.TgZ(40,"td"),t._uU(41,"Set display label"),t.qZA(),t.TgZ(42,"td"),t._uU(43,"plain text | html string"),t.qZA(),t._UZ(44,"td"),t.qZA(),t.TgZ(45,"tr")(46,"td"),t._uU(47,"value"),t.qZA(),t.TgZ(48,"td"),t._uU(49,"Set value for that radio button"),t.qZA(),t.TgZ(50,"td"),t._uU(51,"any"),t.qZA(),t._UZ(52,"td"),t.qZA(),t.TgZ(53,"tr")(54,"td"),t._uU(55,"inputId"),t.qZA(),t.TgZ(56,"td"),t._uU(57,"Set id attribute"),t.qZA(),t.TgZ(58,"td"),t._uU(59,"string"),t.qZA(),t._UZ(60,"td"),t.qZA()()()(),t.TgZ(61,"np-card")(62,"np-card-body")(63,"b"),t._uU(64,"<np-radio-group>"),t.qZA(),t.TgZ(65,"table",3)(66,"tr")(67,"th"),t._uU(68,"Property"),t.qZA(),t.TgZ(69,"th"),t._uU(70,"Description"),t.qZA(),t.TgZ(71,"th"),t._uU(72,"Type"),t.qZA(),t.TgZ(73,"th"),t._uU(74,"Default"),t.qZA()(),t.TgZ(75,"tr")(76,"td"),t._uU(77,"ngModel"),t.qZA(),t.TgZ(78,"td"),t._uU(79,"Selected value"),t.qZA(),t.TgZ(80,"td"),t._uU(81,"any"),t.qZA(),t._UZ(82,"td"),t.qZA(),t.TgZ(83,"tr")(84,"td"),t._uU(85,"orientation"),t.qZA(),t.TgZ(86,"td"),t._uU(87,"Set orientation of group as 'horizontal' | 'vertical'"),t.qZA(),t.TgZ(88,"td"),t._uU(89,"string"),t.qZA(),t.TgZ(90,"td"),t._uU(91,"horizontal"),t.qZA()(),t.TgZ(92,"tr")(93,"td"),t._uU(94,"name"),t.qZA(),t.TgZ(95,"td"),t._uU(96,"Set name attribute"),t.qZA(),t.TgZ(97,"td"),t._uU(98,"string"),t.qZA(),t._UZ(99,"td"),t.qZA(),t.TgZ(100,"tr")(101,"td"),t._uU(102,"disabled"),t.qZA(),t.TgZ(103,"td"),t._uU(104,"Set disabled"),t.qZA(),t.TgZ(105,"td"),t._uU(106,"boolean"),t.qZA(),t.TgZ(107,"td"),t._uU(108,"false"),t.qZA()(),t.TgZ(109,"tr")(110,"td"),t._uU(111,"required"),t.qZA(),t.TgZ(112,"td"),t._uU(113,"Set required"),t.qZA(),t.TgZ(114,"td"),t._uU(115,"boolean"),t.qZA(),t.TgZ(116,"td"),t._uU(117,"false"),t.qZA()(),t.TgZ(118,"tr")(119,"td"),t._uU(120,"readOnly"),t.qZA(),t.TgZ(121,"td"),t._uU(122,"Set readonly"),t.qZA(),t.TgZ(123,"td"),t._uU(124,"boolean"),t.qZA(),t.TgZ(125,"td"),t._uU(126,"false"),t.qZA()(),t.TgZ(127,"tr")(128,"td"),t._uU(129,"autoFocus"),t.qZA(),t.TgZ(130,"td"),t._uU(131,"Set autofocus"),t.qZA(),t.TgZ(132,"td"),t._uU(133,"boolean"),t.qZA(),t.TgZ(134,"td"),t._uU(135,"false"),t.qZA()(),t.TgZ(136,"tr")(137,"td"),t._uU(138,"tabIndex"),t.qZA(),t.TgZ(139,"td"),t._uU(140,"Set tabindex attribute"),t.qZA(),t.TgZ(141,"td"),t._uU(142,"number"),t.qZA(),t._UZ(143,"td"),t.qZA(),t.TgZ(144,"tr")(145,"td"),t._uU(146,"styleClass"),t.qZA(),t.TgZ(147,"td"),t._uU(148,"Set extra class on component"),t.qZA(),t.TgZ(149,"td"),t._uU(150,"string"),t.qZA(),t._UZ(151,"td"),t.qZA(),t.TgZ(152,"tr")(153,"td"),t._uU(154,"inputId"),t.qZA(),t.TgZ(155,"td"),t._uU(156,"Set id attribute"),t.qZA(),t.TgZ(157,"td"),t._uU(158,"string"),t.qZA(),t._UZ(159,"td"),t.qZA()()()(),t.TgZ(160,"np-card")(161,"np-card-body")(162,"b"),t._uU(163,"<np-radio-group>"),t.qZA(),t.TgZ(164,"table",3)(165,"tr")(166,"th"),t._uU(167,"Method"),t.qZA(),t.TgZ(168,"th"),t._uU(169,"Description"),t.qZA(),t.TgZ(170,"th"),t._uU(171,"Parameters"),t.qZA()(),t.TgZ(172,"tr")(173,"td"),t._uU(174,"onChange(v: any)"),t.qZA(),t.TgZ(175,"td"),t._uU(176,"Callback event on value change."),t.qZA(),t.TgZ(177,"td"),t._uU(178,"Value"),t.qZA()(),t.TgZ(179,"tr")(180,"td"),t._uU(181,"onFocus($event)"),t.qZA(),t.TgZ(182,"td"),t._uU(183,"Callback event on input focus."),t.qZA(),t.TgZ(184,"td"),t._uU(185,"Browser event"),t.qZA()(),t.TgZ(186,"tr")(187,"td"),t._uU(188,"onBlur($event)"),t.qZA(),t.TgZ(189,"td"),t._uU(190,"Callback event on input blur."),t.qZA(),t.TgZ(191,"td"),t._uU(192,"Browser event"),t.qZA()()()()(),t.TgZ(193,"np-card")(194,"np-card-body")(195,"b"),t._uU(196,"<np-radio-group>"),t.qZA(),t.TgZ(197,"table",3)(198,"tr")(199,"th"),t._uU(200,"Api"),t.qZA(),t.TgZ(201,"th"),t._uU(202,"Description"),t.qZA(),t.TgZ(203,"th"),t._uU(204,"Parameters"),t.qZA()(),t.TgZ(205,"tr")(206,"td"),t._uU(207,"focus()"),t.qZA(),t.TgZ(208,"td"),t._uU(209," Set focus on control. If not setting focus properly then use timeout of 500ms. "),t.qZA(),t._UZ(210,"td"),t.qZA()()()()(),t.TgZ(211,"np-tab",4),t.YNc(212,A,55,16,"ng-template",5),t.qZA()()),2&e&&(t.xp6(10),t.Q6J("innerText",d.importText),t.xp6(7),t.Q6J("innerText",d.htmlText),t.xp6(5),t.Q6J("innerText",d.groupHtmlText))},dependencies:[u.JJ,u.Q7,u.On,a.Ic,a.C9,a.KA,a.Qk,a.Bl,a.c0,a.El],encapsulation:2})}const U=[{path:"",component:l}];class Z{static#t=this.\u0275fac=function(e){return new(e||Z)};static#e=this.\u0275mod=t.oAB({type:Z});static#n=this.\u0275inj=t.cJS({imports:[p.Bz.forChild(U),p.Bz]})}class i{static#t=this.\u0275fac=function(e){return new(e||i)};static#e=this.\u0275mod=t.oAB({type:i});static#n=this.\u0275inj=t.cJS({imports:[c.ez,Z,u.u5,a.zF,a.i7,a.Tk]})}}}]);