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
JavaScript
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};