UNPKG

primevue

Version:

PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBloc

2 lines (1 loc) 6.77 kB
import e from"primevue/focustrap";import t from"primevue/icons/times";import n from"primevue/portal";import i from"primevue/ripple";import{ZIndexUtils as o,DomHandler as r}from"primevue/utils";import s from"primevue/basecomponent";import l from"primevue/sidebar/style";import{resolveComponent as a,resolveDirective as c,openBlock as u,createBlock as f,withCtx as d,createElementBlock as m,mergeProps as p,createVNode as h,Transition as b,withDirectives as v,renderSlot as y,Fragment as k,createElementVNode as C,normalizeClass as L,toDisplayString as S,createCommentVNode as g,resolveDynamicComponent as O}from"vue";var x={name:"Sidebar",extends:{name:"BaseSidebar",extends:s,props:{visible:{type:Boolean,default:!1},position:{type:String,default:"left"},header:{type:null,default:null},baseZIndex:{type:Number,default:0},autoZIndex:{type:Boolean,default:!0},dismissable:{type:Boolean,default:!0},showCloseIcon:{type:Boolean,default:!0},closeIcon:{type:String,default:void 0},modal:{type:Boolean,default:!0},blockScroll:{type:Boolean,default:!1}},style:l,provide:function(){return{$parentInstance:this}}},inheritAttrs:!1,emits:["update:visible","show","hide","after-hide"],data:function(){return{containerVisible:this.visible}},container:null,mask:null,content:null,headerContainer:null,closeButton:null,outsideClickListener:null,updated:function(){this.visible&&(this.containerVisible=this.visible)},beforeUnmount:function(){this.disableDocumentSettings(),this.mask&&this.autoZIndex&&o.clear(this.mask),this.container=null,this.mask=null},methods:{hide:function(){this.$emit("update:visible",!1)},onEnter:function(){this.$emit("show"),this.focus(),this.autoZIndex&&o.set("modal",this.mask,this.baseZIndex||this.$primevue.config.zIndex.modal)},onAfterEnter:function(){this.enableDocumentSettings()},onBeforeLeave:function(){this.modal&&!this.isUnstyled&&r.addClass(this.mask,"p-component-overlay-leave")},onLeave:function(){this.$emit("hide")},onAfterLeave:function(){this.autoZIndex&&o.clear(this.mask),this.containerVisible=!1,this.disableDocumentSettings(),this.$emit("after-hide")},onMaskClick:function(e){this.dismissable&&this.modal&&this.mask===e.target&&this.hide()},focus:function(){var e=function(e){return e&&e.querySelector("[autofocus]")},t=this.$slots.header&&e(this.headerContainer);t||(t=this.$slots.default&&e(this.container))||(t=this.closeButton),t&&r.focus(t)},enableDocumentSettings:function(){this.dismissable&&!this.modal&&this.bindOutsideClickListener(),this.blockScroll&&r.blockBodyScroll()},disableDocumentSettings:function(){this.unbindOutsideClickListener(),this.blockScroll&&r.unblockBodyScroll()},onKeydown:function(e){"Escape"===e.code&&this.hide()},containerRef:function(e){this.container=e},maskRef:function(e){this.mask=e},contentRef:function(e){this.content=e},headerContainerRef:function(e){this.headerContainer=e},closeButtonRef:function(e){this.closeButton=e},bindOutsideClickListener:function(){var e=this;this.outsideClickListener||(this.outsideClickListener=function(t){e.isOutsideClicked(t)&&e.hide()},document.addEventListener("click",this.outsideClickListener))},unbindOutsideClickListener:function(){this.outsideClickListener&&(document.removeEventListener("click",this.outsideClickListener),this.outsideClickListener=null)},isOutsideClicked:function(e){return this.container&&!this.container.contains(e.target)}},computed:{fullScreen:function(){return"full"===this.position},closeAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0}},directives:{focustrap:e,ripple:i},components:{Portal:n,TimesIcon:t}};function B(e){return B="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},B(e)}function w(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,i)}return n}function I(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?w(Object(n),!0).forEach((function(t){$(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):w(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function $(e,t,n){var i;return(t="symbol"==B(i=j(t,"string"))?i:String(i))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function j(e,t){if("object"!=B(e)||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var i=n.call(e,t||"default");if("object"!=B(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}var E=["aria-modal"],P=["aria-label"];x.render=function(e,t,n,i,o,r){var s=a("Portal"),l=c("ripple"),x=c("focustrap");return u(),f(s,null,{default:d((function(){return[o.containerVisible?(u(),m("div",p({key:0,ref:r.maskRef,onMousedown:t[2]||(t[2]=function(){return r.onMaskClick&&r.onMaskClick.apply(r,arguments)}),class:e.cx("mask"),style:e.sx("mask",!0,{position:e.position})},e.ptm("mask")),[h(b,p({name:"p-sidebar",onEnter:r.onEnter,onAfterEnter:r.onAfterEnter,onBeforeLeave:r.onBeforeLeave,onLeave:r.onLeave,onAfterLeave:r.onAfterLeave,appear:""},e.ptm("transition")),{default:d((function(){return[e.visible?v((u(),m("div",p({key:0,ref:r.containerRef,class:e.cx("root"),role:"complementary","aria-modal":e.modal,onKeydown:t[1]||(t[1]=function(){return r.onKeydown&&r.onKeydown.apply(r,arguments)})},I(I({},e.$attrs),e.ptm("root"))),[e.$slots.container?y(e.$slots,"container",{key:0,onClose:r.hide,closeCallback:r.hide}):(u(),m(k,{key:1},[C("div",p({ref:r.headerContainerRef,class:e.cx("header")},e.ptm("header")),[y(e.$slots,"header",{class:L(e.cx("title"))},(function(){return[e.header?(u(),m("div",p({key:0,class:e.cx("title")},e.ptm("title")),S(e.header),17)):g("",!0)]})),e.showCloseIcon?v((u(),m("button",p({key:0,ref:r.closeButtonRef,type:"button",class:e.cx("closeButton"),"aria-label":r.closeAriaLabel,onClick:t[0]||(t[0]=function(){return r.hide&&r.hide.apply(r,arguments)})},e.ptm("closeButton"),{"data-pc-group-section":"iconcontainer"}),[y(e.$slots,"closeicon",{class:L(e.cx("closeIcon"))},(function(){return[(u(),f(O(e.closeIcon?"span":"TimesIcon"),p({class:[e.cx("closeIcon"),e.closeIcon]},e.ptm("closeIcon")),null,16,["class"]))]}))],16,P)),[[l]]):g("",!0)],16),C("div",p({ref:r.contentRef,class:e.cx("content")},e.ptm("content")),[y(e.$slots,"default")],16)],64))],16,E)),[[x]]):g("",!0)]})),_:3},16,["onEnter","onAfterEnter","onBeforeLeave","onLeave","onAfterLeave"])],16)):g("",!0)]})),_:3})};export{x as default};