bruno-ui
Version:
Bruno UI Kit
1 lines • 19.8 kB
JavaScript
var __spreadArrays=this&&this.__spreadArrays||function(){for(var t=0,e=0,n=arguments.length;e<n;e++)t+=arguments[e].length;for(var r=Array(t),i=0,e=0;e<n;e++)for(var o=arguments[e],a=0,c=o.length;a<c;a++,i++)r[i]=o[a];return r};System.register(["./p-453dead9.system.js"],(function(t){"use strict";var e,n,r,i;return{setters:[function(t){e=t.r;n=t.c;r=t.h;i=t.g}],execute:function(){var o=t("brn_checkbox",function(){function t(t){e(this,t);this.type="primary";this.changed=n(this,"changed",7)}t.prototype.render=function(){var t=this;return r("label",null,r("input",{type:"checkbox",checked:this.checked,onChange:function(e){return t.OnChangeHandler(e)}}),r("span",{class:"brn-checkbox__checkmark brn-checkbox__checkmark--"+this.type}),r("span",{class:"brn-checkbox__text"},r("slot",null)))};t.prototype.OnChangeHandler=function(t){this.changed.emit(t.target.checked)};Object.defineProperty(t,"style",{get:function(){return"brn-checkbox label{color:#02364c;position:relative;display:inline-block}brn-checkbox label input{display:none}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--primary{background-color:#3abeff}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--secondary{background-color:#808c9e}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--success{background-color:#59c17c}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--danger{background-color:#d64d61}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--warning{background-color:#f8a841}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--info{background-color:#89defa}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--dark{background-color:#02364c}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--light{background-color:#eaecf0}brn-checkbox label input:checked~.brn-checkbox__checkmark.brn-checkbox__checkmark--light:after{border-bottom:2px solid #02364c;border-right:2px solid #02364c}brn-checkbox label input:checked~.brn-checkbox__checkmark:after{opacity:1;visibility:visible}brn-checkbox label .brn-checkbox__checkmark{display:block;position:absolute;top:0;left:0;width:1rem;height:1rem;background-color:#eaecf0;-webkit-transition:color .2s ease-in-out,background-color .2s ease-in-out,opacity .2s ease-in-out,visibility .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,opacity .2s ease-in-out,visibility .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .15s ease-in-out,opacity .2s ease-in-out,visibility .2s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .15s ease-in-out,opacity .2s ease-in-out,visibility .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;cursor:pointer;-webkit-border-radius:2px;-moz-border-radius:2px;-ms-border-radius:2px;border-radius:2px;-ms-user-select:none;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none}brn-checkbox label .brn-checkbox__checkmark:hover{background-color:#d7dde4}brn-checkbox label .brn-checkbox__checkmark:after{opacity:0;visibility:hidden;content:\"\";display:block;position:absolute;top:.16rem;left:.33rem;width:.2rem;height:.45rem;border-bottom:2px solid #fff;border-right:2px solid #fff;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}brn-checkbox label .brn-checkbox__text{padding-left:1.5rem;margin-right:1rem}"},enumerable:true,configurable:true});return t}());var a=t("brn_collapse",function(){function t(t){e(this,t);this.active=false;this._active=false}t.prototype.ActiveWatchHandler=function(){this._active=this.active};t.prototype.componentDidLoad=function(){this._active=this.active};t.prototype.render=function(){var t=this;return r("div",{class:{"brn-collapse":true,"brn-collapse--active":this._active}},r("div",{class:"brn-collapse__header",onClick:function(){t.Toggle()}},r("slot",{name:"header"})),r("div",{class:"brn-collapse__body"},r("slot",{name:"body"})))};t.prototype.Toggle=function(){this._active=!this._active};Object.defineProperty(t,"watchers",{get:function(){return{active:["ActiveWatchHandler"]}},enumerable:true,configurable:true});Object.defineProperty(t,"style",{get:function(){return"brn-collapse>div,brn-collapse>div.brn-collapse--active .brn-collapse__body{display:block}brn-collapse>div .brn-collapse__body{display:none}"},enumerable:true,configurable:true});return t}());var c=t("brn_column",function(){function t(t){e(this,t)}t.prototype.render=function(){this._el.style.width=this.CalculateWidth()+"%";return r("div",null,r("slot",null))};t.prototype.CalculateWidth=function(){return this.total>0&&this.columns>0?this.columns*100/this.total:0};Object.defineProperty(t.prototype,"_el",{get:function(){return i(this)},enumerable:true,configurable:true});Object.defineProperty(t,"style",{get:function(){return"brn-column{display:block;padding:0 .5rem;position:relative}brn-column>.div{width:100%;height:100%}brn-column:first-child{padding-left:0}brn-column:last-child{padding-right:0}"},enumerable:true,configurable:true});return t}());var s=function(){function t(){}t.GetId=function(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,(function(t){var e=Math.random()*16|0,n=t=="x"?e:e&3|8;return n.toString(16)}))};t.GetIdWithPrefix=function(e){return e+"--"+t.GetId()};return t}();var u=t("brn_dropdown",function(){function t(t){e(this,t);this.closeable=true;this.active=false;this._active=false;this._id=s.GetIdWithPrefix("dropdown");this._menuId=s.GetIdWithPrefix("dropdown__menu")}t.prototype.ActiveWatchHandler=function(t){this._active=t};t.prototype.componentDidLoad=function(){this._active=this.active};t.prototype.WindowClickHandler=function(t){this._active=this.IsCloseable(t)};t.prototype.render=function(){var t=this;return r("div",{class:{"brn-dropdown--active":this._active},id:""+this._id},r("div",{class:"brn-dropdown__button",onClick:function(){t.Toggle()}},r("slot",{name:"button"})),r("div",{class:"brn-dropdown__menu",id:""+this._menuId},r("slot",{name:"menu"})))};t.prototype.Toggle=function(){this._active=!this._active};t.prototype.IsCloseable=function(t){var e=false;if(this.closeable&&t.target.closest("#"+this._menuId)){e=false}else if(t.target.closest("#"+this._id)){e=this._active}return e};Object.defineProperty(t.prototype,"_element",{get:function(){return i(this)},enumerable:true,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{active:["ActiveWatchHandler"]}},enumerable:true,configurable:true});Object.defineProperty(t,"style",{get:function(){return"brn-dropdown>div{display:inline-block;position:relative}brn-dropdown>div.brn-dropdown--active .brn-dropdown__menu{visibility:visible;opacity:1;top:auto;margin-top:.15rem}brn-dropdown>div .brn-dropdown__menu{visibility:hidden;opacity:0;position:absolute;left:0;width:-webkit-max-content;width:-moz-max-content;width:max-content;z-index:1;display:block;text-align:left;background-color:#fff;border:1px solid #d7dde4;padding:.5rem .8rem;margin-top:-.15rem;-webkit-transition:visibility .2s ease-in-out,opacity .2s ease-in-out,margin-top .2s ease-in-out;transition:visibility .2s ease-in-out,opacity .2s ease-in-out,margin-top .2s ease-in-out;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;border-radius:4px}brn-dropdown>div .brn-dropdown__menu ul{margin:-.5rem -.8rem -.5rem -.8rem}brn-dropdown>div .brn-dropdown__menu ul li:hover{background-color:#eaecf0}brn-dropdown>div .brn-dropdown__menu ul li.divider{padding:0;margin:.15rem 0}brn-dropdown>div .brn-dropdown__menu ul li a{display:block;padding:.4rem .8rem}"},enumerable:true,configurable:true});return t}());var l=t("brn_radio",function(){function t(t){e(this,t);this.type="primary";this.changed=n(this,"changed",7)}t.prototype.render=function(){var t=this;return r("label",null,r("input",{type:"radio",name:this.name,checked:this.checked,onChange:function(e){return t.OnChangeHandler(e)}}),r("span",{class:"brn-radio__checkmark brn-radio__checkmark--"+this.type}),r("span",{class:"brn-radio__text"},r("slot",null)))};t.prototype.OnChangeHandler=function(t){this.changed.emit(t.target.checked)};Object.defineProperty(t,"style",{get:function(){return"brn-radio label{color:#02364c;position:relative;display:inline-block}brn-radio label input{display:none}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--primary{background-color:#3abeff}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--secondary{background-color:#808c9e}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--success{background-color:#59c17c}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--danger{background-color:#d64d61}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--warning{background-color:#f8a841}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--info{background-color:#89defa}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--dark{background-color:#02364c}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--light{background-color:#eaecf0}brn-radio label input:checked~.brn-radio__checkmark.brn-radio__checkmark--light:after{background-color:#02364c}brn-radio label input:checked~.brn-radio__checkmark:after{opacity:1;visibility:visible}brn-radio label .brn-radio__checkmark{display:block;position:absolute;top:0;left:0;width:1rem;height:1rem;background-color:#eaecf0;-webkit-transition:color .2s ease-in-out,background-color .2s ease-in-out,opacity .2s ease-in-out,visibility .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,opacity .2s ease-in-out,visibility .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .15s ease-in-out,opacity .2s ease-in-out,visibility .2s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .15s ease-in-out,opacity .2s ease-in-out,visibility .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;cursor:pointer;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;-ms-user-select:none;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none}brn-radio label .brn-radio__checkmark:hover{background-color:#d7dde4}brn-radio label .brn-radio__checkmark:after{opacity:0;visibility:hidden;content:\"\";display:block;position:absolute;top:.24rem;left:.25rem;width:.5rem;height:.5rem;background-color:#fff;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}brn-radio label .brn-radio__text{padding-left:1.5rem;margin-right:1rem}"},enumerable:true,configurable:true});return t}());var h=t("brn_row",function(){function t(t){e(this,t)}t.prototype.render=function(){return r("div",null,r("slot",null))};Object.defineProperty(t,"style",{get:function(){return"brn-row{display:block}brn-row>div{position:relative;width:100%;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;border:0;line-height:normal}"},enumerable:true,configurable:true});return t}());var d=t("brn_slider",function(){function t(t){e(this,t);this._active=false}t.prototype.MouseMoveHandler=function(t){if(this._active){this.SetHandlePosition(t)}};t.prototype.MouseUpHandler=function(){this._active=false};t.prototype.componentDidLoad=function(){this.handle=this.GetHandle()};t.prototype.render=function(){var t=this;return r("div",{class:"slider"},r("div",{class:"slider__bar",onClick:function(e){t.SetHandlePosition(e)}}),r("div",{class:"slider__handle",onMouseDown:function(){t._active=true}}))};t.prototype.GetHandle=function(){return this._element.getElementsByClassName("slider__handle")[0]};t.prototype.GetSlider=function(){return this._element.getElementsByClassName("slider")[0]};t.prototype.SetHandlePosition=function(t){var e=this.CalculatePosition(t);this.handle.style.left=e+"px"};t.prototype.CalculatePosition=function(t){var e=this.GetSlider();var n=t.clientX-this._element.offsetLeft-this.handle.clientWidth/2;if(n<this._element.offsetLeft){n=0}else if(t.clientX>e.offsetWidth){n=e.offsetWidth-this._element.offsetLeft-this.handle.clientWidth/2}return n};Object.defineProperty(t.prototype,"_element",{get:function(){return i(this)},enumerable:true,configurable:true});Object.defineProperty(t,"style",{get:function(){return"brn-slider .slider{position:relative}brn-slider .slider .slider__bar{display:block;height:.5rem;background-color:#eaecf0}brn-slider .slider .slider__bar,brn-slider .slider .slider__handle{-webkit-border-radius:1rem;-moz-border-radius:1rem;-ms-border-radius:1rem;border-radius:1rem}brn-slider .slider .slider__handle{top:-.25rem;left:0;position:absolute;width:1rem;height:1rem;background-color:#3abeff;cursor:pointer;-ms-user-select:none;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none}"},enumerable:true,configurable:true});return t}());var f=t("brn_tab",function(){function t(t){e(this,t);this.active=false;this._active=false;this.tabLoaded=n(this,"tabLoaded",7);this.tabChanged=n(this,"tabChanged",7)}t.prototype.ActiveChangeHandler=function(t){this._active=t;this.TabChanged()};t.prototype.componentWillLoad=function(){this._identifier=s.GetId();this._active=this.active};t.prototype.componentDidLoad=function(){var t=this.GetTab();this.tabLoaded.emit(t)};t.prototype.render=function(){return r("div",{class:{"brn-tab--active":this._active}},r("slot",null))};t.prototype.TabChanged=function(){var t=this.GetTab();this.tabChanged.emit(t)};t.prototype.GetTab=function(){var t=this;var e={Identifier:this._identifier,Index:this.GetIndex(),Name:this.name,Active:this._active,OnActive:function(e){t._active=e}};return e};t.prototype.GetIndex=function(){var t=this._element.closest("brn-tabs");if(t){var e=t.getElementsByTagName("brn-tab");return Array.prototype.indexOf.call(e,this._element)}console.warn('"brn-tab" components must be wrapped with "brn-tabs" component');return 0};Object.defineProperty(t.prototype,"_element",{get:function(){return i(this)},enumerable:true,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{active:["ActiveChangeHandler"]}},enumerable:true,configurable:true});Object.defineProperty(t,"style",{get:function(){return"brn-tab>div{display:none}brn-tab>div.brn-tab--active{display:block}"},enumerable:true,configurable:true});return t}());var b=t("brn_tabs",function(){function t(t){e(this,t)}t.prototype.componentWillLoad=function(){this._tabs=[]};t.prototype.TabLoadedHandler=function(t){var e=t.detail;if(this._tabs.length-1<e.Index){this._tabs.length=e.Index+1}this._tabs[e.Index]=e;this._tabs=__spreadArrays(this._tabs)};t.prototype.TabChangedHandler=function(t){var e=t.detail;var n=this._tabs.findIndex((function(t){return t.Identifier==e.Identifier}));this._tabs[n]=e;this._tabs=__spreadArrays(this._tabs)};t.prototype.render=function(){var t=this;return r("div",null,r("div",{class:"brn-tabs"},this._tabs.filter((function(t){return t})).map((function(e){return r("div",{class:{"brn-tabs__tab":true,"brn-tabs__tab--active":e.Active},onClick:function(){t.TabChangeHandler(e)}},e.Name)}))),r("div",{class:"brn-tabs__content"},r("slot",null)))};t.prototype.TabChangeHandler=function(t){this.DeactivateAllTabs();t.Active=true;t.OnActive(true);this._tabs=__spreadArrays(this._tabs)};t.prototype.DeactivateAllTabs=function(){this._tabs.map((function(t){t.Active=false;t.OnActive(false)}))};Object.defineProperty(t,"style",{get:function(){return"brn-tabs .brn-tabs{display:block;border-bottom:1px solid #d7dde4;margin-bottom:.5rem}brn-tabs .brn-tabs__tab{position:relative;cursor:pointer;display:inline-block;text-decoration:none;color:#808c9e;font-size:.875rem;padding:0 .85rem .5rem .85rem;margin-bottom:-1px;-ms-user-select:none;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none}brn-tabs .brn-tabs__tab--active{color:#02364c;border-bottom:1px solid #02364c}"},enumerable:true,configurable:true});return t}());var p=t("brn_toggle",function(){function t(t){e(this,t);this.type="primary";this.changed=n(this,"changed",7)}t.prototype.render=function(){var t=this;return r("label",null,r("input",{type:"checkbox",checked:this.checked,onChange:function(e){return t.OnChangeHandler(e)}}),r("span",{class:"brn-toggle__checkmark brn-toggle__checkmark--"+this.type}),r("span",{class:"brn-toggle__text"},r("slot",null)))};t.prototype.OnChangeHandler=function(t){this.changed.emit(t.target.checked)};Object.defineProperty(t,"style",{get:function(){return"brn-toggle label{color:#02364c;position:relative;display:inline-block}brn-toggle label input{display:none}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--primary:after{background-color:#3abeff}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--secondary:after{background-color:#808c9e}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--success:after{background-color:#59c17c}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--danger:after{background-color:#d64d61}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--warning:after{background-color:#f8a841}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--info:after{background-color:#89defa}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--dark,brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--dark:after{background-color:#02364c}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--dark:after{background-color:#3abeff}brn-toggle label input:checked~.brn-toggle__checkmark.brn-toggle__checkmark--light:after{background-color:#02364c}brn-toggle label input:checked~.brn-toggle__checkmark:after{margin-left:.7rem}brn-toggle label .brn-toggle__checkmark{display:block;position:absolute;top:0;left:0;width:1.75rem;height:1rem;background-color:#eaecf0;-webkit-transition:color .2s ease-in-out,background-color .2s ease-in-out,margin-left .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,margin-left .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .15s ease-in-out,margin-left .2s ease-in-out;transition:color .2s ease-in-out,background-color .2s ease-in-out,box-shadow .15s ease-in-out,margin-left .2s ease-in-out,-webkit-box-shadow .15s ease-in-out;cursor:pointer;-webkit-border-radius:2rem;-moz-border-radius:2rem;-ms-border-radius:2rem;border-radius:2rem;-ms-user-select:none;-webkit-user-select:none;-moz-user-select:-moz-none;user-select:none}brn-toggle label .brn-toggle__checkmark:hover{background-color:#d7dde4}brn-toggle label .brn-toggle__checkmark:after{-webkit-transition:margin-left .2s ease-in-out,background-color .2s ease-in-out;transition:margin-left .2s ease-in-out,background-color .2s ease-in-out;content:\"\";display:block;position:absolute;top:.19rem;left:.23rem;width:.6rem;height:.6rem;background-color:#fff;-webkit-border-radius:.6rem;-moz-border-radius:.6rem;-ms-border-radius:.6rem;border-radius:.6rem}brn-toggle label .brn-toggle__checkmark.brn-toggle__checkmark--dark{background-color:#02364c}brn-toggle label .brn-toggle__checkmark.brn-toggle__checkmark--dark:hover{background-color:#042836}brn-toggle label .brn-toggle__text{padding-left:2.25rem;margin-right:1rem}"},enumerable:true,configurable:true});return t}())}}}));