|
- /*!
- DMXzone Bootstrap 5 Alert
- Version: 1.0.2
- (c) 2021 DMXzone.com
- @build 2021-04-15 13:03:41
- */
- dmx.Component("bs5-alert",{constructor:function(t,s){this.onTransitionEnd=this.onTransitionEnd.bind(this),dmx.BaseComponent.call(this,t,s)},attributes:{show:{type:Boolean,default:!1},type:{type:String,default:"primary"},closable:{type:Boolean,default:!1}},methods:{toggle:function(){this[this.$node.classList.contains("show")?"hide":"show"]()},show:function(){this.show()},hide:function(){this.hide()},setType:function(t){this.setType(t)},setTextContent:function(t){this.setTextContent(t)}},render:function(t){this.$node=t,this.$parse(),t.setAttribute("role","alert"),t.classList.add("alert"),this.$closeButton=document.createElement("button"),this.$closeButton.setAttribute("type","button"),this.$closeButton.setAttribute("aria-label","Close"),this.$closeButton.className="btn-close",this.$closeButton.addEventListener("click",this.hide.bind(this)),this.props.show||this.$node.style.setProperty("display","none"),this.update({})},update:function(t){t.type!=this.props.type&&this.setType(this.props.type),t.show!=this.props.show&&this[this.props.show?"show":"hide"](),t.closable!=this.props.closable&&(this.props.closable?(this.$node.appendChild(this.$closeButton),this.$node.classList.add("alert-dismissible")):(this.$closeButton.remove(),this.$node.classList.remove("alert-dismissible")))},show:function(){this.$node.removeEventListener("transitionend",this.onTransitionEnd),this.$node.style.removeProperty("display"),this.$node.offsetWidth,this.$node.classList.add("show")},hide:function(){this.$node.removeEventListener("transitionend",this.onTransitionEnd),this.$node.classList.contains("fade")?this.$node.addEventListener("transitionend",this.onTransitionEnd,{once:!0}):this.$node.style.setProperty("display","none"),this.$node.classList.remove("show")},onTransitionEnd:function(){this.$node.style.setProperty("display","none")},setType:function(t){var s=["primary","secondary","success","danger","warning","info","light","dark"].map(function(t){return"alert-"+t});this.$node.classList.remove.apply(this.$node.classList,s),this.$node.classList.add("alert-"+t)},setTextContent:function(t){this.$closeButton.remove(),this.$node.textContent=t,this.props.closable&&this.$node.appendChild(this.$closeButton)}});
- //# sourceMappingURL=../maps/dmxBootstrap5Alert.js.map
|
