@syncfusion/ej2-buttons - npm Package Compare versions

Comparing version 15.4.21 to 15.4.22

dist/ej2-buttons.umd.min.js

 /*!
 *  filename: ej2-buttons.umd.min.js
-*  version : 15.4.21
+*  version : 15.4.22
 *  Copyright Syncfusion Inc. 2001 - 2017. All rights reserved.
@@ -11,3 +11,3 @@ *  Use of this code is subject to the terms of our license.
 
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@syncfusion/ej2-base"));else if("function"==typeof define&&define.amd)define(["@syncfusion/ej2-base"],t);else{var s=t("object"==typeof exports?require("@syncfusion/ej2-base"):e["@syncfusion/ej2-base"]);for(var n in s)("object"==typeof exports?exports:e)[n]=s[n]}}(this,function(e){return function(e){function t(n){if(s[n])return s[n].exports;var i=s[n]={exports:{},id:n,loaded:!1};return e[n].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var s={};return t.m=e,t.c=s,t.p="",t(0)}([function(e,t,s){var n,i;n=[s,t,s(1),s(4),s(6),s(8)],void 0!==(i=function(e,t,s,n,i,r){"use strict";function a(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}Object.defineProperty(t,"__esModule",{value:!0}),a(s),a(n),a(i),a(r)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i;n=[s,t,s(2)],void 0!==(i=function(e,t,s){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),function(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}(s)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i;n=[s,t,s(3),s(3)],void 0!==(i=function(e,t,s,n){"use strict";function i(e,t,i,r){if(i.tagName===e){for(var a=n.getValue("ej2_instances",i),o=s.createElement("input",{attrs:{type:t}}),l=["change","cssClass","label","labelPosition"],c=s.createElement(e,{className:r,attrs:{role:t,"aria-checked":"false"}}),d=0,p=i.attributes.length;d<p;d++)-1===l.indexOf(i.attributes[d].nodeName)&&o.setAttribute(i.attributes[d].nodeName,i.attributes[d].nodeValue);i.parentNode.insertBefore(o,i),s.detach(i),i=o,i.parentNode.insertBefore(c,i),c.appendChild(i),n.setValue("ej2_instances",a,i)}return i}function r(e){for(var t,s=e.childNodes,n=0;n<s.length;n++)if(t=s[n],3===t.nodeType)return t;return null}function a(e,t){void 0===e&&(e=!1),void 0===t&&(t={});var n=s.createElement("div",{className:"e-checkbox-wrapper"});if(t.enableRtl&&n.classList.add("e-rtl"),e){var i=s.createElement("span",{className:"e-ripple-container"});s.rippleEffect(i,{isCenterRipple:!0,duration:400}),n.appendChild(i)}var r=s.createElement("span",{className:"e-frame e-icons"});if(t.checked&&r.classList.add("e-check"),n.appendChild(r),t.label){var a=s.createElement("span",{className:"e-label",innerHTML:t.label});n.appendChild(a)}return n}Object.defineProperty(t,"__esModule",{value:!0}),t.wrapperInitialize=i,t.getTextNode=r,t.createCheckBox=a}.apply(t,n))&&(e.exports=i)},function(t,s){t.exports=e},function(e,t,s){var n,i;n=[s,t,s(5)],void 0!==(i=function(e,t,s){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),function(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}(s)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i,r=this&&this.__extends||function(){var e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var s in t)t.hasOwnProperty(s)&&(e[s]=t[s])};return function(t,s){function n(){this.constructor=t}e(t,s),t.prototype=null===s?Object.create(s):(n.prototype=s.prototype,new n)}}(),a=this&&this.__decorate||function(e,t,s,n){var i,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,s):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,s,n);else for(var o=e.length-1;o>=0;o--)(i=e[o])&&(a=(r<3?i(a):r>3?i(t,s,a):i(t,s))||a);return r>3&&a&&Object.defineProperty(t,s,a),a};n=[s,t,s(3),s(3),s(3),s(2)],void 0!==(i=function(e,t,s,n,i,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var l={RTL:"e-rtl",BUTTON:"e-btn",PRIMARY:"e-primary",ICONBTN:"e-icon-btn"},c=function(e){function t(t,s){return e.call(this,t,s)||this}return r(t,e),t.prototype.preRender=function(){},t.prototype.render=function(){this.initialize()},t.prototype.initialize=function(){this.cssClass&&i.addClass([this.element],this.cssClass.split(" ")),this.isPrimary&&this.element.classList.add(l.PRIMARY),this.content&&(this.element.innerHTML=this.content),this.setIconCss(),this.enableRtl&&this.element.classList.add(l.RTL),this.disabled&&this.controlStatus(this.disabled),n.rippleEffect(this.element,{selector:"."+l.BUTTON}),this.wireEvents()},t.prototype.controlStatus=function(e){this.element.disabled=e},t.prototype.setIconCss=function(){if(this.iconCss){this.element.textContent||this.element.classList.add(l.ICONBTN);var e=i.createElement("span",{className:"e-btn-icon "+this.iconCss}),t=this.element.childNodes[0];t&&"left"===this.iconPosition?(this.element.insertBefore(e,t),e.classList.add("e-icon-left")):(this.element.appendChild(e),"right"===this.iconPosition&&e.classList.add("e-icon-right"))}},t.prototype.wireEvents=function(){this.isToggle&&n.EventHandler.add(this.element,"click",this.btnClickHandler,this)},t.prototype.unWireEvents=function(){this.isToggle&&n.EventHandler.remove(this.element,"click",this.btnClickHandler)},t.prototype.btnClickHandler=function(){this.element.classList.contains("e-active")?this.element.classList.remove("e-active"):this.element.classList.add("e-active")},t.prototype.destroy=function(){var t,s=this.element;e.prototype.destroy.call(this),i.removeClass([this.element],[l.PRIMARY,l.RTL,l.ICONBTN,"e-success","e-info","e-danger","e-warning","e-flat","e-outline","e-small","e-bigger","e-active","e-round"]),["e-ripple","disabled"].forEach(function(e){s.removeAttribute(e)}),this.content&&(s.innerHTML=s.innerHTML.replace(this.content,"")),t=s.querySelector("span.e-btn-icon"),t&&i.detach(t),this.unWireEvents()},t.prototype.getModuleName=function(){return"btn"},t.prototype.getPersistData=function(){return this.addOnPersist([])},t.prototype.onPropertyChanged=function(e,t){for(var s=0,r=Object.keys(e);s<r.length;s++){switch(r[s]){case"isPrimary":e.isPrimary?this.element.classList.add(l.PRIMARY):this.element.classList.remove(l.PRIMARY);break;case"disabled":this.controlStatus(this.disabled);break;case"iconCss":var a=this.element.querySelector("span.e-btn-icon");a?(a.className="e-btn-icon "+this.iconCss,this.element.textContent&&("left"===this.iconPosition?a.classList.add("e-icon-left"):a.classList.add("e-icon-right"))):this.setIconCss();break;case"iconPosition":a=this.element.querySelector("span.e-btn-icon"),a&&i.detach(a),this.setIconCss();break;case"cssClass":t.cssClass&&i.removeClass([this.element],t.cssClass.split(" ")),i.addClass([this.element],e.cssClass.split(" "));break;case"enableRtl":e.enableRtl?this.element.classList.add(l.RTL):this.element.classList.remove(l.RTL);break;case"content":var c=o.getTextNode(this.element);c?c.textContent=e.content:(this.element.innerHTML=e.content,this.element.classList.remove(l.ICONBTN),this.setIconCss());break;case"isToggle":e.isToggle?n.EventHandler.add(this.element,"click",this.btnClickHandler,this):(n.EventHandler.remove(this.element,"click",this.btnClickHandler),i.removeClass([this.element],["e-active"]))}}},a([s.Property("left")],t.prototype,"iconPosition",void 0),a([s.Property("")],t.prototype,"iconCss",void 0),a([s.Property(!1)],t.prototype,"disabled",void 0),a([s.Property(!1)],t.prototype,"isPrimary",void 0),a([s.Property("")],t.prototype,"cssClass",void 0),a([s.Property("")],t.prototype,"content",void 0),a([s.Property(!1)],t.prototype,"isToggle",void 0),t=a([s.NotifyPropertyChanges],t)}(s.Component);t.Button=c,t.buttonBuilder=n.CreateBuilder(c)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i;n=[s,t,s(7)],void 0!==(i=function(e,t,s){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),function(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}(s)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i,r=this&&this.__extends||function(){var e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var s in t)t.hasOwnProperty(s)&&(e[s]=t[s])};return function(t,s){function n(){this.constructor=t}e(t,s),t.prototype=null===s?Object.create(s):(n.prototype=s.prototype,new n)}}(),a=this&&this.__decorate||function(e,t,s,n){var i,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,s):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,s,n);else for(var o=e.length-1;o>=0;o--)(i=e[o])&&(a=(r<3?i(a):r>3?i(t,s,a):i(t,s))||a);return r>3&&a&&Object.defineProperty(t,s,a),a};n=[s,t,s(3),s(3),s(3),s(3)],void 0!==(i=function(e,t,s,n,i,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var l="e-ripple-container",c="e-checkbox-wrapper",d=function(e){function t(t,s){var n=e.call(this,t,s)||this;return n.isKeyPressed=!1,n}return r(t,e),t.prototype.changeState=function(e){var t,s,n=this.getWrapper().getElementsByClassName("e-frame")[0];i.isRippleEnabled&&(s=this.getWrapper().getElementsByClassName(l)[0]),"check"===e?(n.classList.remove("e-stop"),n.classList.add("e-check"),s&&(s.classList.remove("e-ripple-stop"),s.classList.add("e-ripple-check")),t="true",this.element.checked=!0):"uncheck"===e?(i.removeClass([n],["e-check","e-stop"]),s&&i.removeClass([s],["e-ripple-check","e-ripple-stop"]),t="false",this.element.checked=!1):(n.classList.remove("e-check"),n.classList.add("e-stop"),s&&(s.classList.remove("e-ripple-check"),s.classList.add("e-ripple-stop")),t="mixed",this.element.indeterminate=!0),this.getWrapper().setAttribute("aria-checked",t)},t.prototype.clickHandler=function(e){this.focusOutHandler(),this.indeterminate?(this.changeState(this.checked?"check":"uncheck"),this.indeterminate=!1,this.element.indeterminate=!1):this.checked?(this.changeState("uncheck"),this.checked=!1):(this.changeState("check"),this.checked=!0);var t={checked:this.element.checked,event:e};this.trigger("change",t)},t.prototype.destroy=function(){var t=this.getWrapper();e.prototype.destroy.call(this),this.disabled||this.unWireEvents(),t.parentNode.insertBefore(this.element,t),i.detach(t),this.element.checked=!1,this.indeterminate&&(this.element.indeterminate=!1),this.name&&this.element.removeAttribute("name"),this.value&&this.element.removeAttribute("value"),this.disabled&&this.element.removeAttribute("disabled")},t.prototype.focusHandler=function(){this.isKeyPressed&&this.getWrapper().classList.add("e-focus")},t.prototype.focusOutHandler=function(){this.getWrapper().classList.remove("e-focus")},t.prototype.getModuleName=function(){return"checkbox"},t.prototype.getPersistData=function(){return this.addOnPersist(["checked","indeterminate"])},t.prototype.getWrapper=function(){return this.element.parentElement.parentElement},t.prototype.initialize=function(){this.name&&this.element.setAttribute("name",this.name),this.value&&this.element.setAttribute("value",this.value),this.checked&&this.changeState("check"),this.indeterminate&&this.changeState(),this.disabled&&this.setDisabled()},t.prototype.initWrapper=function(){var e=this.element.parentElement;e.classList.contains(c)||(e=i.createElement("div",{className:c,attrs:{role:"checkbox","aria-checked":"false"}}),this.element.parentNode.insertBefore(e,this.element));var t=i.createElement("label",{attrs:{for:this.element.id}}),s=i.createElement("span",{className:"e-icons e-frame"});if(this.enableRtl&&e.classList.add("e-rtl"),this.cssClass&&i.addClass([e],this.cssClass.split(" ")),e.appendChild(t),t.appendChild(this.element),t.appendChild(s),i.isRippleEnabled){var n=i.createElement("span",{className:l});"before"===this.labelPosition?t.appendChild(n):t.insertBefore(n,s),i.rippleEffect(n,{duration:400,isCenterRipple:!0})}this.label&&this.setText(this.label)},t.prototype.keyActionHandler=function(e){"space"===e.action&&(e.preventDefault(),this.clickHandler(e),this.focusHandler())},t.prototype.keyDownHandler=function(){this.isKeyPressed=!0},t.prototype.labelMouseHandler=function(e){var t=this.getWrapper().getElementsByClassName(l)[0];if(t){var s=document.createEvent("MouseEvents");s.initEvent(e.type,!1,!0),t.dispatchEvent(s)}},t.prototype.mouseDownHandler=function(){this.isKeyPressed=!1},t.prototype.onPropertyChanged=function(e,t){for(var s=this.getWrapper(),n=0,r=Object.keys(e);n<r.length;n++){switch(r[n]){case"checked":this.indeterminate=!1,this.element.indeterminate=!1,this.changeState(e.checked?"check":"uncheck");break;case"indeterminate":e.indeterminate?this.changeState():(this.element.indeterminate=!1,this.changeState(this.checked?"check":"uncheck"));break;case"disabled":e.disabled?(this.setDisabled(),this.unWireEvents()):(this.element.disabled=!1,s.classList.remove("e-checkbox-disabled"),s.setAttribute("aria-disabled","false"),this.wireEvents());break;case"cssClass":t.cssClass&&s.classList.remove(t.cssClass),s.classList.add(e.cssClass);break;case"enableRtl":e.enableRtl?s.classList.add("e-rtl"):s.classList.remove("e-rtl");break;case"label":this.setText(e.label);break;case"labelPosition":var a=s.getElementsByClassName("e-label")[0],o=s.getElementsByTagName("label")[0];i.detach(a),"after"===e.labelPosition?o.appendChild(a):o.insertBefore(a,s.getElementsByClassName("e-frame")[0]);break;case"name":this.element.setAttribute("name",e.name);break;case"value":this.element.setAttribute("value",e.value)}}},t.prototype.preRender=function(){if("EJ-CHECKBOX"===this.element.tagName){for(var e=o.getValue("ej2_instances",this.element),t=i.createElement("input",{attrs:{type:"checkbox"}}),s=["change","cssClass","indeterminate","label","labelPosition"],n=i.createElement("EJ-CHECKBOX",{className:c,attrs:{role:"checkbox","aria-checked":"false"}}),r=0,a=this.element.attributes.length;r<a;r++)-1===s.indexOf(this.element.attributes[r].nodeName)&&t.setAttribute(this.element.attributes[r].nodeName,this.element.attributes[r].nodeValue);this.element.parentNode.insertBefore(t,this.element),i.detach(this.element),this.element=t,this.element.parentNode.insertBefore(n,this.element),n.appendChild(this.element),o.setValue("ej2_instances",e,this.element)}"checkbox"!==this.element.getAttribute("type")&&this.element.setAttribute("type","checkbox"),this.element.id||(this.element.id=o.getUniqueID("e-"+this.getModuleName()))},t.prototype.render=function(){this.initWrapper(),this.initialize(),this.disabled||this.wireEvents()},t.prototype.setDisabled=function(){var e=this.getWrapper();this.element.disabled=!0,e.classList.add("e-checkbox-disabled"),e.setAttribute("aria-disabled","true")},t.prototype.setText=function(e){var t=this.getWrapper().getElementsByClassName("e-label")[0];if(t)t.textContent=e;else{t=i.createElement("span",{className:"e-label",innerHTML:e});var s=this.getWrapper().getElementsByTagName("label")[0];"before"===this.labelPosition?s.insertBefore(t,this.getWrapper().getElementsByClassName("e-frame")[0]):s.appendChild(t)}},t.prototype.unWireEvents=function(){var e=this.getWrapper();n.EventHandler.remove(this.element,"click",this.clickHandler),this.keyboardModule.destroy(),n.EventHandler.remove(document,"keydown",this.keyDownHandler),n.EventHandler.remove(e,"mousedown",this.mouseDownHandler),n.EventHandler.remove(this.element,"focus",this.focusHandler),n.EventHandler.remove(this.element,"focusout",this.focusOutHandler);var t=e.getElementsByTagName("label")[0];n.EventHandler.remove(t,"mousedown",this.labelMouseHandler),n.EventHandler.remove(t,"mouseup",this.labelMouseHandler)},t.prototype.wireEvents=function(){var e=this.getWrapper();n.EventHandler.add(this.element,"click",this.clickHandler,this),this.keyboardModule=new n.KeyboardEvents(e,{eventName:"keyup",keyAction:this.keyActionHandler.bind(this),keyConfigs:{space:"space"}}),n.EventHandler.add(document,"keydown",this.keyDownHandler,this),n.EventHandler.add(e,"mousedown",this.mouseDownHandler,this),n.EventHandler.add(this.element,"focus",this.focusHandler,this),n.EventHandler.add(this.element,"focusout",this.focusOutHandler,this);var t=e.getElementsByTagName("label")[0];n.EventHandler.add(t,"mousedown",this.labelMouseHandler,this),n.EventHandler.add(t,"mouseup",this.labelMouseHandler,this)},a([n.Event()],t.prototype,"change",void 0),a([s.Property(!1)],t.prototype,"checked",void 0),a([s.Property("")],t.prototype,"cssClass",void 0),a([s.Property(!1)],t.prototype,"disabled",void 0),a([s.Property(!1)],t.prototype,"indeterminate",void 0),a([s.Property("")],t.prototype,"label",void 0),a([s.Property("after")],t.prototype,"labelPosition",void 0),a([s.Property("")],t.prototype,"name",void 0),a([s.Property("")],t.prototype,"value",void 0),t=a([s.NotifyPropertyChanges],t)}(s.Component);t.CheckBox=d,t.checkBoxBuilder=s.CreateBuilder(d)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i;n=[s,t,s(9)],void 0!==(i=function(e,t,s){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),function(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}(s)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i,r=this&&this.__extends||function(){var e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var s in t)t.hasOwnProperty(s)&&(e[s]=t[s])};return function(t,s){function n(){this.constructor=t}e(t,s),t.prototype=null===s?Object.create(s):(n.prototype=s.prototype,new n)}}(),a=this&&this.__decorate||function(e,t,s,n){var i,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,s):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,s,n);else for(var o=e.length-1;o>=0;o--)(i=e[o])&&(a=(r<3?i(a):r>3?i(t,s,a):i(t,s))||a);return r>3&&a&&Object.defineProperty(t,s,a),a};n=[s,t,s(3),s(3),s(3),s(3),s(2)],void 0!==(i=function(e,t,s,n,i,o,l){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var c="e-radio-wrapper",d=function(e){function t(t,s){var n=e.call(this,t,s)||this;return n.isKeyPressed=!1,n}return r(t,e),t.prototype.changeHandler=function(e){this.checked=!0,this.dataBind();var t={checked:!0,event:e};this.trigger("change",t)},t.prototype.updateChange=function(e){for(var t,s=this.element.getAttribute("name"),n=document.querySelectorAll('input.e-radio[name="'+s+'"]'),i=0;i<n.length;i++)(t=n[i])!==this.element&&(t.ej2_instances[0].checked=!1)},t.prototype.destroy=function(){var t=this.getLabel();e.prototype.destroy.call(this),this.disabled||this.unWireEvents(),i.detach(t),this.element.checked=!1,this.name&&this.element.removeAttribute("name"),this.value&&this.element.removeAttribute("value"),this.disabled&&this.element.removeAttribute("disabled")},t.prototype.focusHandler=function(){this.isKeyPressed&&this.getLabel().classList.add("e-focus")},t.prototype.focusOutHandler=function(){this.getLabel().classList.remove("e-focus")},t.prototype.getModuleName=function(){return"radio"},t.prototype.getPersistData=function(){return this.addOnPersist(["checked"])},t.prototype.getLabel=function(){return this.element.nextElementSibling},t.prototype.initialize=function(){this.initWrapper(),this.name&&this.element.setAttribute("name",this.name),this.value&&this.element.setAttribute("value",this.value),this.checked&&(this.element.checked=!0),this.disabled&&this.setDisabled()},t.prototype.initWrapper=function(){var e,t=this.element.parentElement;t.classList.contains(c)||(t=i.createElement("div",{className:c}),this.element.parentNode.insertBefore(t,this.element));var n=i.createElement("label",{attrs:{for:this.element.id}});t.appendChild(this.element),t.appendChild(n),i.isRippleEnabled&&(e=i.createElement("span",{className:"e-ripple-container"}),n.appendChild(e),s.rippleEffect(e,{duration:400,isCenterRipple:!0})),this.enableRtl&&n.classList.add("e-rtl"),this.cssClass&&i.addClass([n],this.cssClass.split(" ")),this.label&&this.setText(this.label)},t.prototype.keyDownHandler=function(){this.isKeyPressed=!0},t.prototype.labelRippleHandler=function(e){var t=this.getLabel().getElementsByClassName("e-ripple-container")[0];if(t){var s=document.createEvent("MouseEvents");s.initEvent(e.type,!0,!0),t.dispatchEvent(s)}},t.prototype.mouseDownHandler=function(){this.isKeyPressed=!1},t.prototype.onPropertyChanged=function(e,t){for(var s=this.getLabel(),n=0,i=Object.keys(e);n<i.length;n++){switch(i[n]){case"checked":e.checked&&this.updateChange(e.checked),this.element.checked=e.checked;break;case"disabled":e.disabled?(this.setDisabled(),this.unWireEvents()):(this.element.disabled=!1,this.wireEvents());break;case"cssClass":t.cssClass&&s.classList.remove(t.cssClass),s.classList.add(e.cssClass);break;case"enableRtl":e.enableRtl?s.classList.add("e-rtl"):s.classList.remove("e-rtl");break;case"label":this.setText(e.label);break;case"labelPosition":"before"===e.labelPosition?s.classList.add("e-right"):s.classList.remove("e-right");break;case"name":this.element.setAttribute("name",e.name);break;case"value":this.element.setAttribute("value",e.value)}}},t.prototype.preRender=function(){var e=this.element;e=l.wrapperInitialize("EJ-RADIOBUTTON","radio",e,c),this.element=e,"radio"!==this.element.getAttribute("type")&&this.element.setAttribute("type","radio"),this.element.id||(this.element.id=o.getUniqueID("e-"+this.getModuleName()))},t.prototype.render=function(){this.initialize(),this.disabled||this.wireEvents()},t.prototype.setDisabled=function(){this.element.disabled=!0},t.prototype.setText=function(e){var t=this.getLabel(),s=t.getElementsByClassName("e-label")[0];s?s.textContent=e:(s=i.createElement("span",{className:"e-label",innerHTML:e}),t.appendChild(s)),"before"===this.labelPosition?this.getLabel().classList.add("e-right"):this.getLabel().classList.remove("e-right")},t.prototype.unWireEvents=function(){var e=this.getLabel();n.EventHandler.remove(this.element,"change",this.changeHandler),n.EventHandler.remove(document,"keydown",this.keyDownHandler),n.EventHandler.remove(e,"mousedown",this.mouseDownHandler),n.EventHandler.remove(this.element,"focus",this.focusHandler),n.EventHandler.remove(this.element,"focusout",this.focusOutHandler);var t=e.getElementsByClassName("e-label")[0];t&&(n.EventHandler.remove(t,"mousedown",this.labelRippleHandler),n.EventHandler.remove(t,"mouseup",this.labelRippleHandler))},t.prototype.wireEvents=function(){var e=this.getLabel();n.EventHandler.add(this.element,"change",this.changeHandler,this),n.EventHandler.add(document,"keydown",this.keyDownHandler,this),n.EventHandler.add(e,"mousedown",this.mouseDownHandler,this),n.EventHandler.add(this.element,"focus",this.focusHandler,this),n.EventHandler.add(this.element,"focusout",this.focusOutHandler,this);var t=e.getElementsByClassName("e-label")[0];t&&(n.EventHandler.add(t,"mousedown",this.labelRippleHandler,this),n.EventHandler.add(t,"mouseup",this.labelRippleHandler,this))},a([n.Event()],t.prototype,"change",void 0),a([s.Property(!1)],t.prototype,"checked",void 0),a([s.Property("")],t.prototype,"cssClass",void 0),a([s.Property(!1)],t.prototype,"disabled",void 0),a([s.Property("")],t.prototype,"label",void 0),a([s.Property("after")],t.prototype,"labelPosition",void 0),a([s.Property("")],t.prototype,"name",void 0),a([s.Property("")],t.prototype,"value",void 0),t=a([s.NotifyPropertyChanges],t)}(s.Component);t.RadioButton=d,t.radioButtonBuilder=s.CreateBuilder(d)}.apply(t,n))&&(e.exports=i)}])});
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@syncfusion/ej2-base"));else if("function"==typeof define&&define.amd)define(["@syncfusion/ej2-base"],t);else{var s=t("object"==typeof exports?require("@syncfusion/ej2-base"):e["@syncfusion/ej2-base"]);for(var n in s)("object"==typeof exports?exports:e)[n]=s[n]}}(this,function(e){return function(e){function t(n){if(s[n])return s[n].exports;var i=s[n]={exports:{},id:n,loaded:!1};return e[n].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var s={};return t.m=e,t.c=s,t.p="",t(0)}([function(e,t,s){var n,i;n=[s,t,s(1),s(4),s(6),s(8)],void 0!==(i=function(e,t,s,n,i,r){"use strict";function a(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}Object.defineProperty(t,"__esModule",{value:!0}),a(s),a(n),a(i),a(r)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i;n=[s,t,s(2)],void 0!==(i=function(e,t,s){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),function(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}(s)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i;n=[s,t,s(3),s(3)],void 0!==(i=function(e,t,s,n){"use strict";function i(e,t,i,r){if(i.tagName===e){for(var a=n.getValue("ej2_instances",i),o=s.createElement("input",{attrs:{type:t}}),l=["change","cssClass","label","labelPosition"],c=s.createElement(e,{className:r,attrs:{role:t,"aria-checked":"false"}}),d=0,p=i.attributes.length;d<p;d++)-1===l.indexOf(i.attributes[d].nodeName)&&o.setAttribute(i.attributes[d].nodeName,i.attributes[d].nodeValue);i.parentNode.insertBefore(o,i),s.detach(i),i=o,i.parentNode.insertBefore(c,i),c.appendChild(i),s.setValue("ej2_instances",a,i)}return i}function r(e){for(var t,s=e.childNodes,n=0;n<s.length;n++)if(t=s[n],3===t.nodeType)return t;return null}function a(e,t){void 0===e&&(e=!1),void 0===t&&(t={});var i=s.createElement("div",{className:"e-checkbox-wrapper"});if(t.cssClass&&n.addClass([i],t.cssClass.split(" ")),t.enableRtl&&i.classList.add("e-rtl"),e){var r=s.createElement("span",{className:"e-ripple-container"});s.rippleEffect(r,{isCenterRipple:!0,duration:400}),i.appendChild(r)}var a=s.createElement("span",{className:"e-frame e-icons"});if(t.checked&&a.classList.add("e-check"),i.appendChild(a),t.label){var o=s.createElement("span",{className:"e-label",innerHTML:t.label});i.appendChild(o)}return i}function o(e,t){if(t){var s=document.createEvent("MouseEvents");s.initEvent(e.type,!1,!0),t.dispatchEvent(s)}}Object.defineProperty(t,"__esModule",{value:!0}),t.wrapperInitialize=i,t.getTextNode=r,t.createCheckBox=a,t.rippleMouseHandler=o}.apply(t,n))&&(e.exports=i)},function(t,s){t.exports=e},function(e,t,s){var n,i;n=[s,t,s(5)],void 0!==(i=function(e,t,s){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),function(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}(s)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i,r=this&&this.__extends||function(){var e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var s in t)t.hasOwnProperty(s)&&(e[s]=t[s])};return function(t,s){function n(){this.constructor=t}e(t,s),t.prototype=null===s?Object.create(s):(n.prototype=s.prototype,new n)}}(),a=this&&this.__decorate||function(e,t,s,n){var i,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,s):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,s,n);else for(var o=e.length-1;o>=0;o--)(i=e[o])&&(a=(r<3?i(a):r>3?i(t,s,a):i(t,s))||a);return r>3&&a&&Object.defineProperty(t,s,a),a};n=[s,t,s(3),s(3),s(3),s(2)],void 0!==(i=function(e,t,s,n,i,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var l={RTL:"e-rtl",BUTTON:"e-btn",PRIMARY:"e-primary",ICONBTN:"e-icon-btn"},c=function(e){function t(t,s){return e.call(this,t,s)||this}return r(t,e),t.prototype.preRender=function(){},t.prototype.render=function(){this.initialize()},t.prototype.initialize=function(){this.cssClass&&i.addClass([this.element],this.cssClass.split(" ")),this.isPrimary&&this.element.classList.add(l.PRIMARY),this.content&&(this.element.innerHTML=this.content),this.setIconCss(),this.enableRtl&&this.element.classList.add(l.RTL),this.disabled&&this.controlStatus(this.disabled),n.rippleEffect(this.element,{selector:"."+l.BUTTON}),this.wireEvents()},t.prototype.controlStatus=function(e){this.element.disabled=e},t.prototype.setIconCss=function(){if(this.iconCss){this.element.textContent||this.element.classList.add(l.ICONBTN);var e=i.createElement("span",{className:"e-btn-icon "+this.iconCss}),t=this.element.childNodes[0];t&&"left"===this.iconPosition?(this.element.insertBefore(e,t),e.classList.add("e-icon-left")):(this.element.appendChild(e),"right"===this.iconPosition&&e.classList.add("e-icon-right"))}},t.prototype.wireEvents=function(){this.isToggle&&n.EventHandler.add(this.element,"click",this.btnClickHandler,this)},t.prototype.unWireEvents=function(){this.isToggle&&n.EventHandler.remove(this.element,"click",this.btnClickHandler)},t.prototype.btnClickHandler=function(){this.element.classList.contains("e-active")?this.element.classList.remove("e-active"):this.element.classList.add("e-active")},t.prototype.destroy=function(){var t,s=this.element;e.prototype.destroy.call(this),i.removeClass([this.element],[l.PRIMARY,l.RTL,l.ICONBTN,"e-success","e-info","e-danger","e-warning","e-flat","e-outline","e-small","e-bigger","e-active","e-round"]),["e-ripple","disabled"].forEach(function(e){s.removeAttribute(e)}),this.content&&(s.innerHTML=s.innerHTML.replace(this.content,"")),t=s.querySelector("span.e-btn-icon"),t&&i.detach(t),this.unWireEvents()},t.prototype.getModuleName=function(){return"btn"},t.prototype.getPersistData=function(){return this.addOnPersist([])},t.prototype.onPropertyChanged=function(e,t){for(var s=0,r=Object.keys(e);s<r.length;s++){switch(r[s]){case"isPrimary":e.isPrimary?this.element.classList.add(l.PRIMARY):this.element.classList.remove(l.PRIMARY);break;case"disabled":this.controlStatus(this.disabled);break;case"iconCss":var a=this.element.querySelector("span.e-btn-icon");a?(a.className="e-btn-icon "+this.iconCss,this.element.textContent&&("left"===this.iconPosition?a.classList.add("e-icon-left"):a.classList.add("e-icon-right"))):this.setIconCss();break;case"iconPosition":a=this.element.querySelector("span.e-btn-icon"),a&&i.detach(a),this.setIconCss();break;case"cssClass":t.cssClass&&i.removeClass([this.element],t.cssClass.split(" ")),i.addClass([this.element],e.cssClass.split(" "));break;case"enableRtl":e.enableRtl?this.element.classList.add(l.RTL):this.element.classList.remove(l.RTL);break;case"content":var c=o.getTextNode(this.element);c?c.textContent=e.content:(this.element.innerHTML=e.content,this.element.classList.remove(l.ICONBTN),this.setIconCss());break;case"isToggle":e.isToggle?n.EventHandler.add(this.element,"click",this.btnClickHandler,this):(n.EventHandler.remove(this.element,"click",this.btnClickHandler),i.removeClass([this.element],["e-active"]))}}},a([s.Property("left")],t.prototype,"iconPosition",void 0),a([s.Property("")],t.prototype,"iconCss",void 0),a([s.Property(!1)],t.prototype,"disabled",void 0),a([s.Property(!1)],t.prototype,"isPrimary",void 0),a([s.Property("")],t.prototype,"cssClass",void 0),a([s.Property("")],t.prototype,"content",void 0),a([s.Property(!1)],t.prototype,"isToggle",void 0),t=a([s.NotifyPropertyChanges],t)}(s.Component);t.Button=c}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i;n=[s,t,s(7)],void 0!==(i=function(e,t,s){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),function(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}(s)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i,r=this&&this.__extends||function(){var e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var s in t)t.hasOwnProperty(s)&&(e[s]=t[s])};return function(t,s){function n(){this.constructor=t}e(t,s),t.prototype=null===s?Object.create(s):(n.prototype=s.prototype,new n)}}(),a=this&&this.__decorate||function(e,t,s,n){var i,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,s):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,s,n);else for(var o=e.length-1;o>=0;o--)(i=e[o])&&(a=(r<3?i(a):r>3?i(t,s,a):i(t,s))||a);return r>3&&a&&Object.defineProperty(t,s,a),a};n=[s,t,s(3),s(3),s(3),s(2)],void 0!==(i=function(e,t,s,n,i,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var l="e-ripple-container",c="e-checkbox-wrapper",d=function(e){function t(t,s){var n=e.call(this,t,s)||this;return n.isKeyPressed=!1,n}return r(t,e),t.prototype.changeState=function(e){var t,s,n=this.getWrapper().getElementsByClassName("e-frame")[0];i.isRippleEnabled&&(s=this.getWrapper().getElementsByClassName(l)[0]),"check"===e?(n.classList.remove("e-stop"),n.classList.add("e-check"),s&&(s.classList.remove("e-ripple-stop"),s.classList.add("e-ripple-check")),t="true",this.element.checked=!0):"uncheck"===e?(i.removeClass([n],["e-check","e-stop"]),s&&i.removeClass([s],["e-ripple-check","e-ripple-stop"]),t="false",this.element.checked=!1):(n.classList.remove("e-check"),n.classList.add("e-stop"),s&&(s.classList.remove("e-ripple-check"),s.classList.add("e-ripple-stop")),t="mixed",this.element.indeterminate=!0),this.getWrapper().setAttribute("aria-checked",t)},t.prototype.clickHandler=function(e){this.focusOutHandler(),this.indeterminate?(this.changeState(this.checked?"check":"uncheck"),this.indeterminate=!1,this.element.indeterminate=!1):this.checked?(this.changeState("uncheck"),this.checked=!1):(this.changeState("check"),this.checked=!0);var t={checked:this.element.checked,event:e};this.trigger("change",t)},t.prototype.destroy=function(){var t=this,s=this.getWrapper();e.prototype.destroy.call(this),this.disabled||this.unWireEvents(),"INPUT"===this.tagName?(s.parentNode.insertBefore(this.element,s),i.detach(s),this.element.checked=!1,this.indeterminate&&(this.element.indeterminate=!1),["name","value","disabled"].forEach(function(e){t.element.removeAttribute(e)})):(["role","aria-checked","class"].forEach(function(e){s.removeAttribute(e)}),this.element.id&&s.setAttribute("id",this.element.id),s.innerHTML="")},t.prototype.focusHandler=function(){this.isKeyPressed&&this.getWrapper().classList.add("e-focus")},t.prototype.focusOutHandler=function(){this.getWrapper().classList.remove("e-focus")},t.prototype.getModuleName=function(){return"checkbox"},t.prototype.getPersistData=function(){return this.addOnPersist(["checked","indeterminate"])},t.prototype.getWrapper=function(){return this.element.parentElement.parentElement},t.prototype.initialize=function(){this.name&&this.element.setAttribute("name",this.name),this.value&&this.element.setAttribute("value",this.value),this.checked&&this.changeState("check"),this.indeterminate&&this.changeState(),this.disabled&&this.setDisabled()},t.prototype.initWrapper=function(){var e=this.element.parentElement;e.classList.contains(c)||(e=i.createElement("div",{className:c,attrs:{role:"checkbox","aria-checked":"false"}}),this.element.parentNode.insertBefore(e,this.element));var t=i.createElement("label",{attrs:{for:this.element.id}}),s=i.createElement("span",{className:"e-icons e-frame"});if(this.enableRtl&&e.classList.add("e-rtl"),this.cssClass&&i.addClass([e],this.cssClass.split(" ")),e.appendChild(t),t.appendChild(this.element),t.appendChild(s),i.isRippleEnabled){var n=i.createElement("span",{className:l});"before"===this.labelPosition?t.appendChild(n):t.insertBefore(n,s),i.rippleEffect(n,{duration:400,isCenterRipple:!0})}this.label&&this.setText(this.label)},t.prototype.keyActionHandler=function(e){"space"===e.action&&(e.preventDefault(),this.clickHandler(e),this.focusHandler())},t.prototype.keyDownHandler=function(){this.isKeyPressed=!0},t.prototype.labelMouseHandler=function(e){var t=this.getWrapper().getElementsByClassName(l)[0];o.rippleMouseHandler(e,t)},t.prototype.mouseDownHandler=function(){this.isKeyPressed=!1},t.prototype.onPropertyChanged=function(e,t){for(var s=this.getWrapper(),n=0,r=Object.keys(e);n<r.length;n++){switch(r[n]){case"checked":this.indeterminate=!1,this.element.indeterminate=!1,this.changeState(e.checked?"check":"uncheck");break;case"indeterminate":e.indeterminate?this.changeState():(this.element.indeterminate=!1,this.changeState(this.checked?"check":"uncheck"));break;case"disabled":e.disabled?(this.setDisabled(),this.unWireEvents()):(this.element.disabled=!1,s.classList.remove("e-checkbox-disabled"),s.setAttribute("aria-disabled","false"),this.wireEvents());break;case"cssClass":t.cssClass&&s.classList.remove(t.cssClass),s.classList.add(e.cssClass);break;case"enableRtl":e.enableRtl?s.classList.add("e-rtl"):s.classList.remove("e-rtl");break;case"label":this.setText(e.label);break;case"labelPosition":var a=s.getElementsByClassName("e-label")[0],o=s.getElementsByTagName("label")[0];i.detach(a),"after"===e.labelPosition?o.appendChild(a):o.insertBefore(a,s.getElementsByClassName("e-frame")[0]);break;case"name":this.element.setAttribute("name",e.name);break;case"value":this.element.setAttribute("value",e.value)}}},t.prototype.preRender=function(){var e=this.element;this.tagName=this.element.tagName,e=o.wrapperInitialize("EJ-CHECKBOX","checkbox",e,c),this.element=e,"checkbox"!==this.element.getAttribute("type")&&this.element.setAttribute("type","checkbox"),this.element.id||(this.element.id=i.getUniqueID("e-"+this.getModuleName()))},t.prototype.render=function(){this.initWrapper(),this.initialize(),this.disabled||this.wireEvents()},t.prototype.setDisabled=function(){var e=this.getWrapper();this.element.disabled=!0,e.classList.add("e-checkbox-disabled"),e.setAttribute("aria-disabled","true")},t.prototype.setText=function(e){var t=this.getWrapper().getElementsByClassName("e-label")[0];if(t)t.textContent=e;else{t=i.createElement("span",{className:"e-label",innerHTML:e});var s=this.getWrapper().getElementsByTagName("label")[0];"before"===this.labelPosition?s.insertBefore(t,this.getWrapper().getElementsByClassName("e-frame")[0]):s.appendChild(t)}},t.prototype.unWireEvents=function(){var e=this.getWrapper();n.EventHandler.remove(this.element,"click",this.clickHandler),this.keyboardModule.destroy(),n.EventHandler.remove(document,"keydown",this.keyDownHandler),n.EventHandler.remove(e,"mousedown",this.mouseDownHandler),n.EventHandler.remove(this.element,"focus",this.focusHandler),n.EventHandler.remove(this.element,"focusout",this.focusOutHandler);var t=e.getElementsByTagName("label")[0];n.EventHandler.remove(t,"mousedown",this.labelMouseHandler),n.EventHandler.remove(t,"mouseup",this.labelMouseHandler)},t.prototype.wireEvents=function(){var e=this.getWrapper();n.EventHandler.add(this.element,"click",this.clickHandler,this),this.keyboardModule=new n.KeyboardEvents(e,{eventName:"keyup",keyAction:this.keyActionHandler.bind(this),keyConfigs:{space:"space"}}),n.EventHandler.add(document,"keydown",this.keyDownHandler,this),n.EventHandler.add(e,"mousedown",this.mouseDownHandler,this),n.EventHandler.add(this.element,"focus",this.focusHandler,this),n.EventHandler.add(this.element,"focusout",this.focusOutHandler,this);var t=e.getElementsByTagName("label")[0];n.EventHandler.add(t,"mousedown",this.labelMouseHandler,this),n.EventHandler.add(t,"mouseup",this.labelMouseHandler,this)},a([n.Event()],t.prototype,"change",void 0),a([s.Property(!1)],t.prototype,"checked",void 0),a([s.Property("")],t.prototype,"cssClass",void 0),a([s.Property(!1)],t.prototype,"disabled",void 0),a([s.Property(!1)],t.prototype,"indeterminate",void 0),a([s.Property("")],t.prototype,"label",void 0),a([s.Property("after")],t.prototype,"labelPosition",void 0),a([s.Property("")],t.prototype,"name",void 0),a([s.Property("")],t.prototype,"value",void 0),t=a([s.NotifyPropertyChanges],t)}(s.Component);t.CheckBox=d}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i;n=[s,t,s(9)],void 0!==(i=function(e,t,s){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),function(e){for(var s in e)t.hasOwnProperty(s)||(t[s]=e[s])}(s)}.apply(t,n))&&(e.exports=i)},function(e,t,s){var n,i,r=this&&this.__extends||function(){var e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var s in t)t.hasOwnProperty(s)&&(e[s]=t[s])};return function(t,s){function n(){this.constructor=t}e(t,s),t.prototype=null===s?Object.create(s):(n.prototype=s.prototype,new n)}}(),a=this&&this.__decorate||function(e,t,s,n){var i,r=arguments.length,a=r<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,s):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,s,n);else for(var o=e.length-1;o>=0;o--)(i=e[o])&&(a=(r<3?i(a):r>3?i(t,s,a):i(t,s))||a);return r>3&&a&&Object.defineProperty(t,s,a),a};n=[s,t,s(3),s(3),s(3),s(2)],void 0!==(i=function(e,t,s,n,i,o){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var l="e-radio-wrapper",c=function(e){function t(t,s){var n=e.call(this,t,s)||this;return n.isKeyPressed=!1,n}return r(t,e),c=t,t.prototype.changeHandler=function(e){this.checked=!0,this.dataBind();var t={value:this.value,event:e};this.trigger("change",t)},t.prototype.updateChange=function(e){for(var t,s=this.element.getAttribute("name"),n=document.querySelectorAll('input.e-radio[name="'+s+'"]'),r=0;r<n.length;r++)(t=n[r])!==this.element&&(i.getInstance(t,c).checked=!1)},t.prototype.destroy=function(){var t=this,s=this.element.parentElement;e.prototype.destroy.call(this),this.disabled||this.unWireEvents(),"INPUT"===this.tagName?(s.parentNode.insertBefore(this.element,s),i.detach(s),this.element.checked=!1,["name","value","disabled"].forEach(function(e){t.element.removeAttribute(e)})):(["role","aria-checked","class"].forEach(function(e){s.removeAttribute(e)}),this.element.id&&s.setAttribute("id",this.element.id),s.innerHTML="")},t.prototype.focusHandler=function(){this.isKeyPressed&&this.getLabel().classList.add("e-focus")},t.prototype.focusOutHandler=function(){this.getLabel().classList.remove("e-focus")},t.prototype.getModuleName=function(){return"radio"},t.prototype.getPersistData=function(){return this.addOnPersist(["checked"])},t.prototype.getLabel=function(){return this.element.nextElementSibling},t.prototype.initialize=function(){this.initWrapper(),this.name&&this.element.setAttribute("name",this.name),this.value&&this.element.setAttribute("value",this.value),this.checked&&(this.element.checked=!0),this.disabled&&this.setDisabled()},t.prototype.initWrapper=function(){var e,t=this.element.parentElement;t.classList.contains(l)||(t=i.createElement("div",{className:l}),this.element.parentNode.insertBefore(t,this.element));var n=i.createElement("label",{attrs:{for:this.element.id}});t.appendChild(this.element),t.appendChild(n),i.isRippleEnabled&&(e=i.createElement("span",{className:"e-ripple-container"}),n.appendChild(e),s.rippleEffect(e,{duration:400,isCenterRipple:!0})),this.enableRtl&&n.classList.add("e-rtl"),this.cssClass&&i.addClass([n],this.cssClass.split(" ")),this.label&&this.setText(this.label)},t.prototype.keyDownHandler=function(){this.isKeyPressed=!0},t.prototype.labelRippleHandler=function(e){var t=this.getLabel().getElementsByClassName("e-ripple-container")[0];o.rippleMouseHandler(e,t)},t.prototype.mouseDownHandler=function(){this.isKeyPressed=!1},t.prototype.onPropertyChanged=function(e,t){for(var s=this.getLabel(),n=0,i=Object.keys(e);n<i.length;n++){switch(i[n]){case"checked":e.checked&&this.updateChange(e.checked),this.element.checked=e.checked;break;case"disabled":e.disabled?(this.setDisabled(),this.unWireEvents()):(this.element.disabled=!1,this.wireEvents());break;case"cssClass":t.cssClass&&s.classList.remove(t.cssClass),s.classList.add(e.cssClass);break;case"enableRtl":e.enableRtl?s.classList.add("e-rtl"):s.classList.remove("e-rtl");break;case"label":this.setText(e.label);break;case"labelPosition":"before"===e.labelPosition?s.classList.add("e-right"):s.classList.remove("e-right");break;case"name":this.element.setAttribute("name",e.name);break;case"value":this.element.setAttribute("value",e.value)}}},t.prototype.preRender=function(){var e=this.element;this.tagName=this.element.tagName,e=o.wrapperInitialize("EJ-RADIOBUTTON","radio",e,l),this.element=e,"radio"!==this.element.getAttribute("type")&&this.element.setAttribute("type","radio"),this.element.id||(this.element.id=i.getUniqueID("e-"+this.getModuleName()))},t.prototype.render=function(){this.initialize(),this.disabled||this.wireEvents()},t.prototype.setDisabled=function(){this.element.disabled=!0},t.prototype.setText=function(e){var t=this.getLabel(),s=t.getElementsByClassName("e-label")[0];s?s.textContent=e:(s=i.createElement("span",{className:"e-label",innerHTML:e}),t.appendChild(s)),"before"===this.labelPosition?this.getLabel().classList.add("e-right"):this.getLabel().classList.remove("e-right")},t.prototype.unWireEvents=function(){var e=this.getLabel();n.EventHandler.remove(this.element,"change",this.changeHandler),n.EventHandler.remove(document,"keydown",this.keyDownHandler),n.EventHandler.remove(e,"mousedown",this.mouseDownHandler),n.EventHandler.remove(this.element,"focus",this.focusHandler),n.EventHandler.remove(this.element,"focusout",this.focusOutHandler);var t=e.getElementsByClassName("e-label")[0];t&&(n.EventHandler.remove(t,"mousedown",this.labelRippleHandler),n.EventHandler.remove(t,"mouseup",this.labelRippleHandler))},t.prototype.wireEvents=function(){var e=this.getLabel();n.EventHandler.add(this.element,"change",this.changeHandler,this),n.EventHandler.add(document,"keydown",this.keyDownHandler,this),n.EventHandler.add(e,"mousedown",this.mouseDownHandler,this),n.EventHandler.add(this.element,"focus",this.focusHandler,this),n.EventHandler.add(this.element,"focusout",this.focusOutHandler,this);var t=e.getElementsByClassName("e-label")[0];t&&(n.EventHandler.add(t,"mousedown",this.labelRippleHandler,this),n.EventHandler.add(t,"mouseup",this.labelRippleHandler,this))},a([n.Event()],t.prototype,"change",void 0),a([s.Property(!1)],t.prototype,"checked",void 0),a([s.Property("")],t.prototype,"cssClass",void 0),a([s.Property(!1)],t.prototype,"disabled",void 0),a([s.Property("")],t.prototype,"label",void 0),a([s.Property("after")],t.prototype,"labelPosition",void 0),a([s.Property("")],t.prototype,"name",void 0),a([s.Property("")],t.prototype,"value",void 0),t=c=a([s.NotifyPropertyChanges],t);var c}(s.Component);t.RadioButton=c}.apply(t,n))&&(e.exports=i)}])});
 //# sourceMappingURL=ej2-buttons.umd.min.js.map

dist/es6/button/button.js

@@ -18,3 +18,3 @@ var __extends = (this && this.__extends) || (function () {
 import { Property, NotifyPropertyChanges, Component } from '@syncfusion/ej2-base';
-import { CreateBuilder, rippleEffect, EventHandler } from '@syncfusion/ej2-base';
+import { rippleEffect, EventHandler } from '@syncfusion/ej2-base';
 import { createElement, addClass, removeClass, detach } from '@syncfusion/ej2-base';
@@ -29,3 +29,3 @@ import { getTextNode } from '../common/common';
 /**
- * Button is a graphical user interface element that triggers an event on its click action. It can contain a text, an image, or both.
+ * The Button is a graphical user interface element that triggers an event on its click action. It can contain a text, an image, or both.
  * ```html
@@ -123,3 +123,3 @@ * <button id="button">Button</button>
     /**
-     * To destroy the widget.
+     * Destroys the widget.
      * @returns void
@@ -270,5 +270,1 @@ */
 export { Button };
-/**
- * builder for button
- */
-export var buttonBuilder = CreateBuilder(Button);

dist/es6/check-box/check-box.js

@@ -17,6 +17,6 @@ var __extends = (this && this.__extends) || (function () {
 };
-import { Component, CreateBuilder, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';
+import { Component, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';
 import { Event, EventHandler, KeyboardEvents } from '@syncfusion/ej2-base';
-import { addClass, createElement, detach, removeClass, rippleEffect, isRippleEnabled } from '@syncfusion/ej2-base';
-import { getUniqueID, getValue, setValue } from '@syncfusion/ej2-base';
+import { addClass, createElement, detach, getUniqueID, isRippleEnabled, removeClass, rippleEffect } from '@syncfusion/ej2-base';
+import { wrapperInitialize, rippleMouseHandler } from './../common/common';
 var CHECK = 'e-check';
@@ -33,4 +33,4 @@ var DISABLED = 'e-checkbox-disabled';
 /**
- * CheckBox is a graphical user interface element that allows you to select one or more options from the choices.
- * It contains checked, unchecked and indeterminate states.
+ * The CheckBox is a graphical user interface element that allows you to select one or more options from the choices.
+ * It contains checked, unchecked, and indeterminate states.
  * ```html
@@ -111,6 +111,7 @@ * <input type="checkbox" id="checkbox"/>
     /**
-     * To destroy the widget.
+     * Destroys the widget.
      * @returns void
      */
     CheckBox.prototype.destroy = function () {
+        var _this = this;
         var wrapper = this.getWrapper();
@@ -121,17 +122,22 @@ _super.prototype.destroy.call(this);
         }
-        wrapper.parentNode.insertBefore(this.element, wrapper);
-        detach(wrapper);
-        this.element.checked = false;
-        if (this.indeterminate) {
-            this.element.indeterminate = false;
+        if (this.tagName === 'INPUT') {
+            wrapper.parentNode.insertBefore(this.element, wrapper);
+            detach(wrapper);
+            this.element.checked = false;
+            if (this.indeterminate) {
+                this.element.indeterminate = false;
+            }
+            ['name', 'value', 'disabled'].forEach(function (key) {
+                _this.element.removeAttribute(key);
+            });
         }
-        if (this.name) {
-            this.element.removeAttribute('name');
+        else {
+            ['role', 'aria-checked', 'class'].forEach(function (key) {
+                wrapper.removeAttribute(key);
+            });
+            if (this.element.id) {
+                wrapper.setAttribute('id', this.element.id);
+            }
+            wrapper.innerHTML = '';
         }
-        if (this.value) {
-            this.element.removeAttribute('value');
-        }
-        if (this.disabled) {
-            this.element.removeAttribute('disabled');
-        }
     };
@@ -225,7 +231,3 @@ CheckBox.prototype.focusHandler = function () {
         var rippleSpan = this.getWrapper().getElementsByClassName(RIPPLE)[0];
-        if (rippleSpan) {
-            var event_1 = document.createEvent('MouseEvents');
-            event_1.initEvent(e.type, false, true);
-            rippleSpan.dispatchEvent(event_1);
-        }
+        rippleMouseHandler(e, rippleSpan);
     };
@@ -312,21 +314,6 @@ CheckBox.prototype.mouseDownHandler = function () {
     CheckBox.prototype.preRender = function () {
-        if (this.element.tagName === 'EJ-CHECKBOX') {
-            var ejInst = getValue('ej2_instances', this.element);
-            var input = createElement('input', { attrs: { 'type': 'checkbox' } });
-            var props = ['change', 'cssClass', 'indeterminate', 'label', 'labelPosition'];
-            var wrapper = createElement('EJ-CHECKBOX', {
-                className: WRAPPER, attrs: { 'role': 'checkbox', 'aria-checked': 'false' }
-            });
-            for (var index = 0, len = this.element.attributes.length; index < len; index++) {
-                if (props.indexOf(this.element.attributes[index].nodeName) === -1) {
-                    input.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);
-                }
-            }
-            this.element.parentNode.insertBefore(input, this.element);
-            detach(this.element);
-            this.element = input;
-            this.element.parentNode.insertBefore(wrapper, this.element);
-            wrapper.appendChild(this.element);
-            setValue('ej2_instances', ejInst, this.element);
-        }
+        var element = this.element;
+        this.tagName = this.element.tagName;
+        element = wrapperInitialize('EJ-CHECKBOX', 'checkbox', element, WRAPPER);
+        this.element = element;
         if (this.element.getAttribute('type') !== 'checkbox') {
@@ -433,5 +420,1 @@ this.element.setAttribute('type', 'checkbox');
 export { CheckBox };
-/**
- * Builder for CheckBox
- */
-export var checkBoxBuilder = CreateBuilder(CheckBox);

dist/es6/common/common.js

@@ -1,3 +0,3 @@
-import { createElement, detach, rippleEffect } from '@syncfusion/ej2-base';
-import { getValue, setValue } from '@syncfusion/ej2-base';
+import { createElement, detach, rippleEffect, setValue } from '@syncfusion/ej2-base';
+import { getValue, addClass } from '@syncfusion/ej2-base';
 /**
@@ -48,2 +48,5 @@ * Initialize wrapper element for angular.
     var wrapper = createElement('div', { className: 'e-checkbox-wrapper' });
+    if (options.cssClass) {
+        addClass([wrapper], options.cssClass.split(' '));
+    }
     if (options.enableRtl) {
@@ -68,1 +71,8 @@ wrapper.classList.add('e-rtl');
 }
+export function rippleMouseHandler(e, rippleSpan) {
+    if (rippleSpan) {
+        var event_1 = document.createEvent('MouseEvents');
+        event_1.initEvent(e.type, false, true);
+        rippleSpan.dispatchEvent(event_1);
+    }
+}

dist/es6/radio-button/radio-button.js

@@ -17,7 +17,6 @@ var __extends = (this && this.__extends) || (function () {
 };
-import { Component, CreateBuilder, rippleEffect, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';
+import { Component, rippleEffect, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';
 import { Event, EventHandler } from '@syncfusion/ej2-base';
-import { addClass, createElement, detach, isRippleEnabled } from '@syncfusion/ej2-base';
-import { getUniqueID } from '@syncfusion/ej2-base';
-import { wrapperInitialize } from './../common/common';
+import { addClass, createElement, detach, getInstance, getUniqueID, isRippleEnabled } from '@syncfusion/ej2-base';
+import { wrapperInitialize, rippleMouseHandler } from './../common/common';
 var LABEL = 'e-label';
@@ -28,3 +27,3 @@ var RIPPLE = 'e-ripple-container';
 /**
- * RadioButton is a graphical user interface element that allows you to select one option from the choices.
+ * The RadioButton is a graphical user interface element that allows you to select one option from the choices.
  * It contains checked and unchecked states.
@@ -50,6 +49,7 @@ * ```html
     }
+    RadioButton_1 = RadioButton;
     RadioButton.prototype.changeHandler = function (event) {
         this.checked = true;
         this.dataBind();
-        var changeEventArgs = { checked: true, event: event };
+        var changeEventArgs = { value: this.value, event: event };
         this.trigger('change', changeEventArgs);
@@ -64,3 +64,3 @@ };
             if (input !== this.element) {
-                input.ej2_instances[0].checked = false;
+                getInstance(input, RadioButton_1).checked = false;
             }
@@ -70,7 +70,8 @@ }
     /**
-     * To destroy the widget.
+     * Destroys the widget.
      * @returns void
      */
     RadioButton.prototype.destroy = function () {
-        var label = this.getLabel();
+        var _this = this;
+        var radioWrap = this.element.parentElement;
         _super.prototype.destroy.call(this);
@@ -80,13 +81,19 @@ if (!this.disabled) {
         }
-        detach(label);
-        this.element.checked = false;
-        if (this.name) {
-            this.element.removeAttribute('name');
+        if (this.tagName === 'INPUT') {
+            radioWrap.parentNode.insertBefore(this.element, radioWrap);
+            detach(radioWrap);
+            this.element.checked = false;
+            ['name', 'value', 'disabled'].forEach(function (key) {
+                _this.element.removeAttribute(key);
+            });
         }
-        if (this.value) {
-            this.element.removeAttribute('value');
+        else {
+            ['role', 'aria-checked', 'class'].forEach(function (key) {
+                radioWrap.removeAttribute(key);
+            });
+            if (this.element.id) {
+                radioWrap.setAttribute('id', this.element.id);
+            }
+            radioWrap.innerHTML = '';
         }
-        if (this.disabled) {
-            this.element.removeAttribute('disabled');
-        }
     };
@@ -162,7 +169,3 @@ RadioButton.prototype.focusHandler = function () {
         var ripple = this.getLabel().getElementsByClassName(RIPPLE)[0];
-        if (ripple) {
-            var event_1 = document.createEvent('MouseEvents');
-            event_1.initEvent(e.type, true, true);
-            ripple.dispatchEvent(event_1);
-        }
+        rippleMouseHandler(e, ripple);
     };
@@ -237,2 +240,3 @@ RadioButton.prototype.mouseDownHandler = function () {
         var element = this.element;
+        this.tagName = this.element.tagName;
         element = wrapperInitialize('EJ-RADIOBUTTON', 'radio', element, WRAPPER);
@@ -327,11 +331,8 @@ this.element = element;
     ], RadioButton.prototype, "value", void 0);
-    RadioButton = __decorate([
+    RadioButton = RadioButton_1 = __decorate([
         NotifyPropertyChanges
     ], RadioButton);
     return RadioButton;
+    var RadioButton_1;
 }(Component));
 export { RadioButton };
-/**
- * Builder for RadioButton
- */
-export var radioButtonBuilder = CreateBuilder(RadioButton);

package.json

 {
   "name": "@syncfusion/ej2-buttons",
-  "version": "15.4.21",
+  "version": "15.4.22",
   "description": "Essential JS 2 Button Components",
@@ -5,0 +5,0 @@ "author": "Syncfusion Inc.",

src/button/button-builder.d.ts

@@ -13,7 +13,8 @@ import{Button} from "./button";
 	/**
-	* Defines the `content` of the Button element that can either be text or HTML elements.
+	* Defines the `content` of the Button element that can either be a text or HTML elements.
 	*/
 	content(value:string): BuilderProperties;
 	/**
-	* Defines class/multiple classes separated by a space in the Button element. Button types, styles, and size can be defined using this.
+	* Defines class/multiple classes separated by a space in the Button element. The Button types, styles, and
+size can be defined by using this.
 	*/
@@ -40,3 +41,5 @@ cssClass(value:string): BuilderProperties;
 	* Positions the icon before/after the text content in the Button.
-When set to `right`, the icon will be positioned to the right of the text content.
+The possible values are:
+* left: The icon will be positioned to the left of the text content.
+* right: The icon will be positioned to the right of the text content.
 	*/
@@ -43,0 +46,0 @@ iconPosition(value:IconPosition): BuilderProperties;

src/button/button-model.d.ts

@@ -1,2 +0,2 @@
-import { Property, NotifyPropertyChanges, INotifyPropertyChanged, Component } from '@syncfusion/ej2-base';import { CreateBuilder, rippleEffect, EventHandler } from '@syncfusion/ej2-base';import { createElement, addClass, removeClass, detach } from '@syncfusion/ej2-base';import { ButtonHelper } from './button-builder';import { getTextNode } from '../common/common';
+import { Property, NotifyPropertyChanges, INotifyPropertyChanged, Component } from '@syncfusion/ej2-base';import { rippleEffect, EventHandler } from '@syncfusion/ej2-base';import { createElement, addClass, removeClass, detach } from '@syncfusion/ej2-base';import { getTextNode } from '../common/common';
 import {IconPosition} from "./button";
@@ -12,3 +12,5 @@ import {ComponentModel} from '@syncfusion/ej2-base';
      * Positions the icon before/after the text content in the Button.
-     * When set to `right`, the icon will be positioned to the right of the text content.
+     * The possible values are:
+     * * left: The icon will be positioned to the left of the text content.
+     * * right: The icon will be positioned to the right of the text content.
      * @default "left"
@@ -38,3 +40,4 @@ */
     /**
-     * Defines class/multiple classes separated by a space in the Button element. Button types, styles, and size can be defined using this.
+     * Defines class/multiple classes separated by a space in the Button element. The Button types, styles, and
+     * size can be defined by using this.
      * @default ""
@@ -45,3 +48,3 @@ */
     /**
-     * Defines the `content` of the Button element that can either be text or HTML elements.
+     * Defines the `content` of the Button element that can either be a text or HTML elements.
      * @default ""
@@ -48,0 +51,0 @@ */

src/button/button.d.ts

 import { INotifyPropertyChanged, Component } from '@syncfusion/ej2-base';
 import { ButtonModel } from './button-model';
-import { ButtonHelper } from './button-builder';
 export declare type IconPosition = 'left' | 'right';
 /**
- * Button is a graphical user interface element that triggers an event on its click action. It can contain a text, an image, or both.
+ * The Button is a graphical user interface element that triggers an event on its click action. It can contain a text, an image, or both.
  * ```html
@@ -20,3 +19,5 @@ * <button id="button">Button</button>
      * Positions the icon before/after the text content in the Button.
-     * When set to `right`, the icon will be positioned to the right of the text content.
+     * The possible values are:
+     * * left: The icon will be positioned to the left of the text content.
+     * * right: The icon will be positioned to the right of the text content.
      * @default "left"
@@ -42,3 +43,4 @@ */
     /**
-     * Defines class/multiple classes separated by a space in the Button element. Button types, styles, and size can be defined using this.
+     * Defines class/multiple classes separated by a space in the Button element. The Button types, styles, and
+     * size can be defined by using this.
      * @default ""
@@ -48,3 +50,3 @@ */
     /**
-     * Defines the `content` of the Button element that can either be text or HTML elements.
+     * Defines the `content` of the Button element that can either be a text or HTML elements.
      * @default ""
@@ -78,3 +80,3 @@ */
     /**
-     * To destroy the widget.
+     * Destroys the widget.
      * @returns void
@@ -103,5 +105,1 @@ */
 }
-/**
- * builder for button
- */
-export declare let buttonBuilder: ButtonHelper;

src/button/button.js

@@ -223,3 +223,2 @@ var __extends = (this && this.__extends) || (function () {
     exports.Button = Button;
-    exports.buttonBuilder = ej2_base_2.CreateBuilder(Button);
 });

src/check-box/check-box-builder.d.ts

@@ -18,3 +18,3 @@ import{CheckBox} from "./check-box";
 	* Specifies a value that indicates whether the CheckBox is `checked` or not.
-When set to `true`, CheckBox will be in `checked` state.
+When set to `true`, the CheckBox will be in `checked` state.
 	*/
@@ -29,3 +29,3 @@ checked(value:boolean): BuilderProperties;
 	* Specifies a value that indicates whether the CheckBox is `disabled` or not.
-When set to `true`, CheckBox will be in `disabled` state.
+When set to `true`, the CheckBox will be in `disabled` state.
 	*/
@@ -43,3 +43,3 @@ disabled(value:boolean): BuilderProperties;
 	* Specifies a value that indicates whether the CheckBox is in `indeterminate` state or not.
-When set to `true`, CheckBox will be in `indeterminate` state.
+When set to `true`, the CheckBox will be in `indeterminate` state.
 	*/
@@ -53,4 +53,6 @@ indeterminate(value:boolean): BuilderProperties;
 	/**
-	* Positions label `before`/`after` to the CheckBox.
-When set to `before`, the label is positioned to left of the CheckBox.
+	* Positions label `before`/`after` the CheckBox.
+The possible values are:
+* before - The label is positioned to left of the CheckBox.
+* after - The label is positioned to right of the CheckBox.
 	*/
@@ -57,0 +59,0 @@ labelPosition(value:LabelPosition): BuilderProperties;

src/check-box/check-box-model.d.ts

@@ -1,2 +0,2 @@
-import { Component, CreateBuilder, INotifyPropertyChanged , NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';import { BaseEventArgs, EmitType, Event, EventHandler, KeyboardEventArgs, KeyboardEvents } from '@syncfusion/ej2-base';import { addClass, attributes, createElement, detach, removeClass, rippleEffect, isRippleEnabled } from '@syncfusion/ej2-base';import { getUniqueID, getValue, setValue } from '@syncfusion/ej2-base';import { CheckBoxHelper } from './check-box-builder';
+import { Component, INotifyPropertyChanged , NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';import { BaseEventArgs, EmitType, Event, EventHandler, KeyboardEventArgs, KeyboardEvents } from '@syncfusion/ej2-base';import { addClass, createElement, detach, getUniqueID, isRippleEnabled, removeClass, rippleEffect } from '@syncfusion/ej2-base';import { wrapperInitialize, rippleMouseHandler } from './../common/common';
 import {ChangeEventArgs,LabelPosition} from "./check-box";
@@ -18,3 +18,3 @@ import {ComponentModel} from '@syncfusion/ej2-base';
      * Specifies a value that indicates whether the CheckBox is `checked` or not.
-     * When set to `true`, CheckBox will be in `checked` state.
+     * When set to `true`, the CheckBox will be in `checked` state.
      * @default false
@@ -33,3 +33,3 @@ */
      * Specifies a value that indicates whether the CheckBox is `disabled` or not.
-     * When set to `true`, CheckBox will be in `disabled` state.
+     * When set to `true`, the CheckBox will be in `disabled` state.
      * @default false
@@ -41,3 +41,3 @@ */
      * Specifies a value that indicates whether the CheckBox is in `indeterminate` state or not.
-     * When set to `true`, CheckBox will be in `indeterminate` state.
+     * When set to `true`, the CheckBox will be in `indeterminate` state.
      * @default false
@@ -54,4 +54,6 @@ */
     /**
-     * Positions label `before`/`after` to the CheckBox.
-     * When set to `before`, the label is positioned to left of the CheckBox.
+     * Positions label `before`/`after` the CheckBox.
+     * The possible values are:
+     * * before - The label is positioned to left of the CheckBox.
+     * * after - The label is positioned to right of the CheckBox.
      * @default 'after'
@@ -58,0 +60,0 @@ */

src/check-box/check-box.d.ts

 import { Component, INotifyPropertyChanged } from '@syncfusion/ej2-base';
 import { BaseEventArgs, EmitType } from '@syncfusion/ej2-base';
 import { CheckBoxModel } from './check-box-model';
-import { CheckBoxHelper } from './check-box-builder';
 export declare type LabelPosition = 'after' | 'before';
 /**
- * CheckBox is a graphical user interface element that allows you to select one or more options from the choices.
- * It contains checked, unchecked and indeterminate states.
+ * The CheckBox is a graphical user interface element that allows you to select one or more options from the choices.
+ * It contains checked, unchecked, and indeterminate states.
  * ```html
@@ -18,2 +17,3 @@ * <input type="checkbox" id="checkbox"/>
 export declare class CheckBox extends Component<HTMLInputElement> implements INotifyPropertyChanged {
+    private tagName;
     private isKeyPressed;
@@ -28,3 +28,3 @@ private keyboardModule;
      * Specifies a value that indicates whether the CheckBox is `checked` or not.
-     * When set to `true`, CheckBox will be in `checked` state.
+     * When set to `true`, the CheckBox will be in `checked` state.
      * @default false
@@ -41,3 +41,3 @@ */
      * Specifies a value that indicates whether the CheckBox is `disabled` or not.
-     * When set to `true`, CheckBox will be in `disabled` state.
+     * When set to `true`, the CheckBox will be in `disabled` state.
      * @default false
@@ -48,3 +48,3 @@ */
      * Specifies a value that indicates whether the CheckBox is in `indeterminate` state or not.
-     * When set to `true`, CheckBox will be in `indeterminate` state.
+     * When set to `true`, the CheckBox will be in `indeterminate` state.
      * @default false
@@ -59,4 +59,6 @@ */
     /**
-     * Positions label `before`/`after` to the CheckBox.
-     * When set to `before`, the label is positioned to left of the CheckBox.
+     * Positions label `before`/`after` the CheckBox.
+     * The possible values are:
+     * * before - The label is positioned to left of the CheckBox.
+     * * after - The label is positioned to right of the CheckBox.
      * @default 'after'
@@ -85,3 +87,3 @@ */
     /**
-     * To destroy the widget.
+     * Destroys the widget.
      * @returns void
@@ -135,5 +137,1 @@ */
 }
-/**
- * Builder for CheckBox
- */
-export declare let checkBoxBuilder: CheckBoxHelper;

src/check-box/check-box.js

@@ -17,3 +17,3 @@ var __extends = (this && this.__extends) || (function () {
 };
-define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base"], function (require, exports, ej2_base_1, ej2_base_2, ej2_base_3, ej2_base_4) {
+define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "./../common/common"], function (require, exports, ej2_base_1, ej2_base_2, ej2_base_3, common_1) {
     "use strict";
@@ -94,2 +94,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
         CheckBox.prototype.destroy = function () {
+            var _this = this;
             var wrapper = this.getWrapper();
@@ -100,17 +101,22 @@ _super.prototype.destroy.call(this);
             }
-            wrapper.parentNode.insertBefore(this.element, wrapper);
-            ej2_base_3.detach(wrapper);
-            this.element.checked = false;
-            if (this.indeterminate) {
-                this.element.indeterminate = false;
+            if (this.tagName === 'INPUT') {
+                wrapper.parentNode.insertBefore(this.element, wrapper);
+                ej2_base_3.detach(wrapper);
+                this.element.checked = false;
+                if (this.indeterminate) {
+                    this.element.indeterminate = false;
+                }
+                ['name', 'value', 'disabled'].forEach(function (key) {
+                    _this.element.removeAttribute(key);
+                });
             }
-            if (this.name) {
-                this.element.removeAttribute('name');
+            else {
+                ['role', 'aria-checked', 'class'].forEach(function (key) {
+                    wrapper.removeAttribute(key);
+                });
+                if (this.element.id) {
+                    wrapper.setAttribute('id', this.element.id);
+                }
+                wrapper.innerHTML = '';
             }
-            if (this.value) {
-                this.element.removeAttribute('value');
-            }
-            if (this.disabled) {
-                this.element.removeAttribute('disabled');
-            }
         };
@@ -196,7 +202,3 @@ CheckBox.prototype.focusHandler = function () {
             var rippleSpan = this.getWrapper().getElementsByClassName(RIPPLE)[0];
-            if (rippleSpan) {
-                var event_1 = document.createEvent('MouseEvents');
-                event_1.initEvent(e.type, false, true);
-                rippleSpan.dispatchEvent(event_1);
-            }
+            common_1.rippleMouseHandler(e, rippleSpan);
         };
@@ -275,21 +277,6 @@ CheckBox.prototype.mouseDownHandler = function () {
         CheckBox.prototype.preRender = function () {
-            if (this.element.tagName === 'EJ-CHECKBOX') {
-                var ejInst = ej2_base_4.getValue('ej2_instances', this.element);
-                var input = ej2_base_3.createElement('input', { attrs: { 'type': 'checkbox' } });
-                var props = ['change', 'cssClass', 'indeterminate', 'label', 'labelPosition'];
-                var wrapper = ej2_base_3.createElement('EJ-CHECKBOX', {
-                    className: WRAPPER, attrs: { 'role': 'checkbox', 'aria-checked': 'false' }
-                });
-                for (var index = 0, len = this.element.attributes.length; index < len; index++) {
-                    if (props.indexOf(this.element.attributes[index].nodeName) === -1) {
-                        input.setAttribute(this.element.attributes[index].nodeName, this.element.attributes[index].nodeValue);
-                    }
-                }
-                this.element.parentNode.insertBefore(input, this.element);
-                ej2_base_3.detach(this.element);
-                this.element = input;
-                this.element.parentNode.insertBefore(wrapper, this.element);
-                wrapper.appendChild(this.element);
-                ej2_base_4.setValue('ej2_instances', ejInst, this.element);
-            }
+            var element = this.element;
+            this.tagName = this.element.tagName;
+            element = common_1.wrapperInitialize('EJ-CHECKBOX', 'checkbox', element, WRAPPER);
+            this.element = element;
             if (this.element.getAttribute('type') !== 'checkbox') {
@@ -299,3 +286,3 @@ this.element.setAttribute('type', 'checkbox');
             if (!this.element.id) {
-                this.element.id = ej2_base_4.getUniqueID('e-' + this.getModuleName());
+                this.element.id = ej2_base_3.getUniqueID('e-' + this.getModuleName());
             }
@@ -393,3 +380,2 @@ };
     exports.CheckBox = CheckBox;
-    exports.checkBoxBuilder = ej2_base_1.CreateBuilder(CheckBox);
 });

src/common/common.d.ts

@@ -12,5 +12,3 @@ /**
 export declare function createCheckBox(enableRipple?: boolean, options?: CheckBoxUtilModel): Element;
-export interface EJ2Instance extends HTMLElement {
-    ej2_instances: Object[];
-}
+export declare function rippleMouseHandler(e: MouseEvent, rippleSpan: Element): void;
 export interface CheckBoxUtilModel {
@@ -20,2 +18,3 @@ checked?: boolean;
     enableRtl?: boolean;
+    cssClass?: string;
 }

src/common/common.js

@@ -22,3 +22,3 @@ define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base"], function (require, exports, ej2_base_1, ej2_base_2) {
             wrapper.appendChild(element);
-            ej2_base_2.setValue('ej2_instances', ejInstance, element);
+            ej2_base_1.setValue('ej2_instances', ejInstance, element);
         }
@@ -44,2 +44,5 @@ return element;
         var wrapper = ej2_base_1.createElement('div', { className: 'e-checkbox-wrapper' });
+        if (options.cssClass) {
+            ej2_base_2.addClass([wrapper], options.cssClass.split(' '));
+        }
         if (options.enableRtl) {
@@ -65,2 +68,10 @@ wrapper.classList.add('e-rtl');
     exports.createCheckBox = createCheckBox;
+    function rippleMouseHandler(e, rippleSpan) {
+        if (rippleSpan) {
+            var event_1 = document.createEvent('MouseEvents');
+            event_1.initEvent(e.type, false, true);
+            rippleSpan.dispatchEvent(event_1);
+        }
+    }
+    exports.rippleMouseHandler = rippleMouseHandler;
 });

src/radio-button/radio-button-builder.d.ts

 import{RadioButton} from "./radio-button";
 
+import{ RadioLabelPosition} from "./radio-button";
 
@@ -17,3 +18,3 @@ export interface RadioButtonHelper {
 	* Specifies a value that indicates whether the RadioButton is `checked` or not.
-When set to `true`, RadioButton will be in `checked` state.
+When set to `true`, the RadioButton will be in `checked` state.
 	*/
@@ -28,3 +29,3 @@ checked(value:boolean): BuilderProperties;
 	* Specifies a value that indicates whether the RadioButton is `disabled` or not.
-When set to `true`, RadioButton will be in `disabled` state.
+When set to `true`, the RadioButton will be in `disabled` state.
 	*/
@@ -46,6 +47,8 @@ disabled(value:boolean): BuilderProperties;
 	/**
-	* Positions label `before`/`after` to the RadioButton.
-When set to `before`, the label is positioned to left of the RadioButton.
+	* Positions label `before`/`after` the RadioButton.
+The possible values are:
+* before: The label is positioned to left of the RadioButton.
+* after: The label is positioned to right of the RadioButton.
 	*/
-	labelPosition(value:string): BuilderProperties;
+	labelPosition(value:RadioLabelPosition): BuilderProperties;
 	/**
@@ -52,0 +55,0 @@ * Overrides the global culture and localization value for this component. Default global culture is 'en-US'.

src/radio-button/radio-button-model.d.ts

@@ -1,3 +0,3 @@
-import { Component, CreateBuilder, INotifyPropertyChanged, rippleEffect, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';import { BaseEventArgs, EmitType, Event, EventHandler } from '@syncfusion/ej2-base';import { addClass, createElement, detach, isRippleEnabled } from '@syncfusion/ej2-base';import { getUniqueID } from '@syncfusion/ej2-base';import { RadioButtonHelper } from './radio-button-builder';import { wrapperInitialize, EJ2Instance } from './../common/common';
-import {ChangeArgs} from "./radio-button";
+import { Component, INotifyPropertyChanged, rippleEffect, NotifyPropertyChanges, Property } from '@syncfusion/ej2-base';import { BaseEventArgs, EmitType, Event, EventHandler } from '@syncfusion/ej2-base';import { addClass, createElement, detach, getInstance, getUniqueID, isRippleEnabled } from '@syncfusion/ej2-base';import { wrapperInitialize, rippleMouseHandler } from './../common/common';
+import {ChangeArgs,RadioLabelPosition} from "./radio-button";
 import {ComponentModel} from '@syncfusion/ej2-base';
@@ -18,3 +18,3 @@
      * Specifies a value that indicates whether the RadioButton is `checked` or not.
-     * When set to `true`, RadioButton will be in `checked` state.
+     * When set to `true`, the RadioButton will be in `checked` state.
      * @default false
@@ -33,3 +33,3 @@ */
      * Specifies a value that indicates whether the RadioButton is `disabled` or not.
-     * When set to `true`, RadioButton will be in `disabled` state.
+     * When set to `true`, the RadioButton will be in `disabled` state.
      * @default false
@@ -46,7 +46,9 @@ */
     /**
-     * Positions label `before`/`after` to the RadioButton.
-     * When set to `before`, the label is positioned to left of the RadioButton.
+     * Positions label `before`/`after` the RadioButton.
+     * The possible values are:
+     * * before: The label is positioned to left of the RadioButton.
+     * * after: The label is positioned to right of the RadioButton.
      * @default 'after'
      */
-    labelPosition?: string;
+    labelPosition?: RadioLabelPosition;
 
@@ -53,0 +55,0 @@ /**

src/radio-button/radio-button.d.ts

 import { Component, INotifyPropertyChanged } from '@syncfusion/ej2-base';
 import { BaseEventArgs, EmitType } from '@syncfusion/ej2-base';
 import { RadioButtonModel } from './radio-button-model';
-import { RadioButtonHelper } from './radio-button-builder';
 export declare type RadioLabelPosition = 'after' | 'before';
 /**
- * RadioButton is a graphical user interface element that allows you to select one option from the choices.
+ * The RadioButton is a graphical user interface element that allows you to select one option from the choices.
  * It contains checked and unchecked states.
@@ -18,2 +17,3 @@ * ```html
 export declare class RadioButton extends Component<HTMLInputElement> implements INotifyPropertyChanged {
+    private tagName;
     private isKeyPressed;
@@ -27,3 +27,3 @@ /**
      * Specifies a value that indicates whether the RadioButton is `checked` or not.
-     * When set to `true`, RadioButton will be in `checked` state.
+     * When set to `true`, the RadioButton will be in `checked` state.
      * @default false
@@ -40,3 +40,3 @@ */
      * Specifies a value that indicates whether the RadioButton is `disabled` or not.
-     * When set to `true`, RadioButton will be in `disabled` state.
+     * When set to `true`, the RadioButton will be in `disabled` state.
      * @default false
@@ -51,7 +51,9 @@ */
     /**
-     * Positions label `before`/`after` to the RadioButton.
-     * When set to `before`, the label is positioned to left of the RadioButton.
+     * Positions label `before`/`after` the RadioButton.
+     * The possible values are:
+     * * before: The label is positioned to left of the RadioButton.
+     * * after: The label is positioned to right of the RadioButton.
      * @default 'after'
      */
-    labelPosition: string;
+    labelPosition: RadioLabelPosition;
     /**
@@ -77,3 +79,3 @@ * Defines `name` attribute for the RadioButton.
     /**
-     * To destroy the widget.
+     * Destroys the widget.
      * @returns void
@@ -117,10 +119,6 @@ */
 export interface ChangeArgs extends BaseEventArgs {
-    /** Returns the checked value of the RadioButton. */
-    checked?: boolean;
+    /** Returns the value of the RadioButton. */
+    value?: string;
     /** Returns the event parameters of the RadioButton. */
     event?: Event;
 }
-/**
- * Builder for RadioButton
- */
-export declare let radioButtonBuilder: RadioButtonHelper;

src/radio-button/radio-button.js

@@ -17,3 +17,3 @@ var __extends = (this && this.__extends) || (function () {
 };
-define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "./../common/common"], function (require, exports, ej2_base_1, ej2_base_2, ej2_base_3, ej2_base_4, common_1) {
+define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "@syncfusion/ej2-base", "./../common/common"], function (require, exports, ej2_base_1, ej2_base_2, ej2_base_3, common_1) {
     "use strict";
@@ -32,6 +32,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
         }
+        RadioButton_1 = RadioButton;
         RadioButton.prototype.changeHandler = function (event) {
             this.checked = true;
             this.dataBind();
-            var changeEventArgs = { checked: true, event: event };
+            var changeEventArgs = { value: this.value, event: event };
             this.trigger('change', changeEventArgs);
@@ -46,3 +47,3 @@ };
                 if (input !== this.element) {
-                    input.ej2_instances[0].checked = false;
+                    ej2_base_3.getInstance(input, RadioButton_1).checked = false;
                 }
@@ -52,3 +53,4 @@ }
         RadioButton.prototype.destroy = function () {
-            var label = this.getLabel();
+            var _this = this;
+            var radioWrap = this.element.parentElement;
             _super.prototype.destroy.call(this);
@@ -58,13 +60,19 @@ if (!this.disabled) {
             }
-            ej2_base_3.detach(label);
-            this.element.checked = false;
-            if (this.name) {
-                this.element.removeAttribute('name');
+            if (this.tagName === 'INPUT') {
+                radioWrap.parentNode.insertBefore(this.element, radioWrap);
+                ej2_base_3.detach(radioWrap);
+                this.element.checked = false;
+                ['name', 'value', 'disabled'].forEach(function (key) {
+                    _this.element.removeAttribute(key);
+                });
             }
-            if (this.value) {
-                this.element.removeAttribute('value');
+            else {
+                ['role', 'aria-checked', 'class'].forEach(function (key) {
+                    radioWrap.removeAttribute(key);
+                });
+                if (this.element.id) {
+                    radioWrap.setAttribute('id', this.element.id);
+                }
+                radioWrap.innerHTML = '';
             }
-            if (this.disabled) {
-                this.element.removeAttribute('disabled');
-            }
         };
@@ -136,7 +144,3 @@ RadioButton.prototype.focusHandler = function () {
             var ripple = this.getLabel().getElementsByClassName(RIPPLE)[0];
-            if (ripple) {
-                var event_1 = document.createEvent('MouseEvents');
-                event_1.initEvent(e.type, true, true);
-                ripple.dispatchEvent(event_1);
-            }
+            common_1.rippleMouseHandler(e, ripple);
         };
@@ -203,2 +207,3 @@ RadioButton.prototype.mouseDownHandler = function () {
             var element = this.element;
+            this.tagName = this.element.tagName;
             element = common_1.wrapperInitialize('EJ-RADIOBUTTON', 'radio', element, WRAPPER);
@@ -210,3 +215,3 @@ this.element = element;
             if (!this.element.id) {
-                this.element.id = ej2_base_4.getUniqueID('e-' + this.getModuleName());
+                this.element.id = ej2_base_3.getUniqueID('e-' + this.getModuleName());
             }
@@ -290,9 +295,9 @@ };
         ], RadioButton.prototype, "value", void 0);
-        RadioButton = __decorate([
+        RadioButton = RadioButton_1 = __decorate([
             ej2_base_1.NotifyPropertyChanges
         ], RadioButton);
         return RadioButton;
+        var RadioButton_1;
     }(ej2_base_1.Component));
     exports.RadioButton = RadioButton;
-    exports.radioButtonBuilder = ej2_base_1.CreateBuilder(RadioButton);
 });

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

5980004

increased by0.15%

Lines of code

53306

increased by0.17%

No dependency changes