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) • 2.95 kB
JavaScript
import e from"primevue/icons/chevronup";import{ZIndexUtils as t,DomHandler as n}from"primevue/utils";import i from"primevue/basecomponent";import r from"primevue/scrolltop/style";import{openBlock as o,createBlock as l,Transition as s,mergeProps as c,withCtx as a,createElementBlock as u,renderSlot as p,normalizeClass as h,resolveDynamicComponent as f,createCommentVNode as m}from"vue";var d={name:"ScrollTop",extends:{name:"BaseScrollTop",extends:i,props:{target:{type:String,default:"window"},threshold:{type:Number,default:400},icon:{type:String,default:void 0},behavior:{type:String,default:"smooth"}},style:r,provide:function(){return{$parentInstance:this}}},scrollListener:null,container:null,data:function(){return{visible:!1}},mounted:function(){"window"===this.target?this.bindDocumentScrollListener():"parent"===this.target&&this.bindParentScrollListener()},beforeUnmount:function(){"window"===this.target?this.unbindDocumentScrollListener():"parent"===this.target&&this.unbindParentScrollListener(),this.container&&(t.clear(this.container),this.overlay=null)},methods:{onClick:function(){("window"===this.target?window:this.$el.parentElement).scroll({top:0,behavior:this.behavior})},checkVisibility:function(e){this.visible=e>this.threshold},bindParentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(e.$el.parentElement.scrollTop)},this.$el.parentElement.addEventListener("scroll",this.scrollListener)},bindDocumentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(n.getWindowScrollTop())},window.addEventListener("scroll",this.scrollListener)},unbindParentScrollListener:function(){this.scrollListener&&(this.$el.parentElement.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},unbindDocumentScrollListener:function(){this.scrollListener&&(window.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},onEnter:function(e){t.set("overlay",e,this.$primevue.config.zIndex.overlay)},onAfterLeave:function(e){t.clear(e)},containerRef:function(e){this.container=e}},computed:{scrollTopAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.scrollTop:void 0}},components:{ChevronUpIcon:e}},v=["aria-label"];d.render=function(e,t,n,i,r,d){return o(),l(s,c({name:"p-scrolltop",appear:"",onEnter:d.onEnter,onAfterLeave:d.onAfterLeave},e.ptm("transition")),{default:a((function(){return[r.visible?(o(),u("button",c({key:0,ref:d.containerRef,class:e.cx("root"),onClick:t[0]||(t[0]=function(){return d.onClick&&d.onClick.apply(d,arguments)}),type:"button","aria-label":d.scrollTopAriaLabel},e.ptm("root"),{"data-pc-name":"scrolltop"}),[p(e.$slots,"icon",{class:h(e.cx("icon"))},(function(){return[(o(),l(f(e.icon?"span":"ChevronUpIcon"),c({class:[e.cx("icon"),e.icon]},e.ptm("icon")),null,16,["class"]))]}))],16,v)):m("",!0)]})),_:3},16,["onEnter","onAfterLeave"])};export{d as default};