buefy
Version:
Lightweight UI components for Vue.js (v3) based on Bulma
3 lines (2 loc) • 5.66 kB
JavaScript
/*! Buefy v3.0.1 | MIT License | github.com/buefy/buefy */
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Sidebar={},e.Vue)}(this,(function(e,t){"use strict";let i=null;const o=["fixed","absolute","static"],s=["clip","keep"];var n=t.defineComponent({name:"BSidebar",props:{modelValue:Boolean,type:[String,Object],overlay:Boolean,position:{type:String,default:"fixed",validator:e=>o.indexOf(e)>=0},fullheight:Boolean,fullwidth:Boolean,right:Boolean,mobile:{type:String},reduce:Boolean,expandOnHover:Boolean,expandOnHoverFixed:Boolean,delay:{type:[Number,null],default:()=>i},canCancel:{type:[Array,Boolean],default:()=>["escape","outside"]},onCancel:{type:Function,default:()=>{}},scroll:{type:String,default:()=>"clip",validator:e=>s.indexOf(e)>=0}},emits:{close:()=>!0,"update:modelValue":e=>!0},data(){return{isOpen:this.modelValue,isDelayOver:!1,transitionName:void 0,animating:!0,savedScrollTop:null,hasLeaved:!1,timer:void 0}},computed:{rootClasses(){return[this.type,{"is-fixed":this.isFixed,"is-static":this.isStatic,"is-absolute":this.isAbsolute,"is-fullheight":this.fullheight,"is-fullwidth":this.fullwidth,"is-right":this.right,"is-mini":this.reduce&&!this.isDelayOver,"is-mini-expand":this.expandOnHover||this.isDelayOver,"is-mini-expand-fixed":this.expandOnHover&&this.expandOnHoverFixed||this.isDelayOver,"is-mini-delayed":null!==this.delay,"is-mini-mobile":"reduce"===this.mobile,"is-hidden-mobile":"hide"===this.mobile,"is-fullwidth-mobile":"fullwidth"===this.mobile}]},cancelOptions(){return"boolean"==typeof this.canCancel?this.canCancel?["escape","outside"]:[]:this.canCancel},isStatic(){return"static"===this.position},isFixed(){return"fixed"===this.position},isAbsolute(){return"absolute"===this.position}},watch:{modelValue:{handler(e){this.isOpen=e,this.overlay&&this.handleScroll();const t=this.right?!e:e;this.transitionName=t?"slide-next":"slide-prev"},immediate:!0}},methods:{keyPress({key:e}){this.isFixed&&(!this.isOpen||"Escape"!==e&&"Esc"!==e||this.cancel("escape"))},cancel(e,...t){this.cancelOptions.indexOf(e)<0||this.isStatic||(this.onCancel.call(null,e,...t),this.close())},close(){this.isOpen=!1,this.$emit("close"),this.$emit("update:modelValue",!1)},clickedOutside(e){this.isFixed&&this.isOpen&&!this.animating&&(e.composedPath().includes(this.$refs.sidebarContent)||this.cancel("outside"))},beforeEnter(){this.animating=!0},afterEnter(){this.animating=!1},handleScroll(){"undefined"!=typeof window&&("clip"!==this.scroll?(this.savedScrollTop=this.savedScrollTop?this.savedScrollTop:document.documentElement.scrollTop,this.modelValue?document.body.classList.add("is-noscroll"):document.body.classList.remove("is-noscroll"),this.modelValue?document.body.style.top=`-${this.savedScrollTop}px`:(document.documentElement.scrollTop=this.savedScrollTop,document.body.style.top="",this.savedScrollTop=null)):this.modelValue?document.documentElement.classList.add("is-clipped"):document.documentElement.classList.remove("is-clipped"))},onHover(){this.delay?(this.hasLeaved=!1,this.timer=setTimeout((()=>{this.hasLeaved||(this.isDelayOver=!0),this.timer=void 0}),this.delay)):this.isDelayOver=!1},onHoverLeave(){this.hasLeaved=!0,this.timer=void 0,this.isDelayOver=!1},clickedCloseButton(){this.isFixed&&this.isOpen&&this.fullwidth&&this.cancel("outside")}},created(){"undefined"!=typeof window&&(document.addEventListener("keyup",this.keyPress),document.addEventListener("click",this.clickedOutside))},mounted(){"undefined"!=typeof window&&this.isFixed&&document.body.appendChild(this.$el),this.overlay&&this.modelValue&&this.handleScroll()},beforeUnmount(){if("undefined"!=typeof window&&(document.removeEventListener("keyup",this.keyPress),document.removeEventListener("click",this.clickedOutside),this.overlay)){document.documentElement.classList.remove("is-clipped");const e=this.savedScrollTop?this.savedScrollTop:document.documentElement.scrollTop;document.body.classList.remove("is-noscroll"),document.documentElement.scrollTop=e,document.body.style.top=""}var e;this.isFixed&&(void 0!==(e=this.$el).remove?e.remove():void 0!==e.parentNode&&null!==e.parentNode&&e.parentNode.removeChild(e)),clearTimeout(this.timer)}});const l={class:"b-sidebar"},d={key:0,class:"sidebar-background"};var a=((e,t)=>{const i=e.__vccOpts||e;for(const[e,o]of t)i[e]=o;return i})(n,[["render",function(e,i,o,s,n,a){return t.openBlock(),t.createElementBlock("div",l,[e.overlay&&e.isOpen?(t.openBlock(),t.createElementBlock("div",d)):t.createCommentVNode("v-if",!0),t.createVNode(t.Transition,{name:e.transitionName,onBeforeEnter:e.beforeEnter,onAfterEnter:e.afterEnter,persisted:""},{default:t.withCtx((()=>[t.withDirectives(t.createElementVNode("div",{ref:"sidebarContent",class:t.normalizeClass(["sidebar-content navbar",e.rootClasses]),onMouseenter:i[1]||(i[1]=(...t)=>e.onHover&&e.onHover(...t)),onMouseleave:i[2]||(i[2]=(...t)=>e.onHoverLeave&&e.onHoverLeave(...t))},[e.fullwidth?(t.openBlock(),t.createElementBlock("button",{key:0,type:"button",onClick:i[0]||(i[0]=(...t)=>e.clickedCloseButton&&e.clickedCloseButton(...t)),class:"modal-close is-large sidebar-close","aria-label":"Close"})):t.createCommentVNode("v-if",!0),t.renderSlot(e.$slots,"default")],34),[[t.vShow,e.isOpen]])])),_:3},8,["name","onBeforeEnter","onAfterEnter"])])}]]);const r={install(e){((e,t)=>{const i=t.name;if(null==i)throw new Error("Buefy.registerComponent: missing component name");e.component(i,t)})(e,a)}};e.BSidebar=a,e.default=r,Object.defineProperty(e,"__esModule",{value:!0})}));