UNPKG

primevue

Version:

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/primevue.svg)](https://badge.fury.io/js/primevue)

2 lines (1 loc) 3.13 kB
import{DomHandler as t}from"primevue/utils";import{openBlock as e,createBlock as n,Transition as i,withCtx as s,createVNode as l,createCommentVNode as o}from"vue";var r={scrollListener:null,data:()=>({visible:!1}),props:{target:{type:String,default:"window"},threshold:{type:Number,default:400},icon:{type:String,default:"pi pi-chevron-up"},behavior:{type:String,default:"smooth"}},mounted(){"window"===this.target?this.bindDocumentScrollListener():"parent"===this.target&&this.bindParentScrollListener()},beforeUnmount(){"window"===this.target?this.unbindDocumentScrollListener():"parent"===this.target&&this.unbindParentScrollListener()},methods:{onClick(){("window"===this.target?window:this.$el.parentElement).scroll({top:0,behavior:this.behavior})},checkVisibility(t){t>this.threshold?this.visible=!0:this.visible=!1},bindParentScrollListener(){this.scrollListener=()=>{this.checkVisibility(this.$el.parentElement.scrollTop)},this.$el.parentElement.addEventListener("scroll",this.scrollListener)},bindDocumentScrollListener(){this.scrollListener=()=>{this.checkVisibility(t.getWindowScrollTop())},window.addEventListener("scroll",this.scrollListener)},unbindParentScrollListener(){this.scrollListener&&(this.$el.parentElement.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},unbindDocumentScrollListener(){this.scrollListener&&(window.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},onEnter(){this.$el.style.zIndex=String(t.generateZIndex())}},computed:{containerClass(){return["p-scrolltop p-link p-component",{"p-scrolltop-sticky":"window"!==this.target}]},iconClass(){return["p-scrolltop-icon",this.icon]}}};!function(t,e){void 0===e&&(e={});var n=e.insertAt;if(t&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],s=document.createElement("style");s.type="text/css","top"===n&&i.firstChild?i.insertBefore(s,i.firstChild):i.appendChild(s),s.styleSheet?s.styleSheet.cssText=t:s.appendChild(document.createTextNode(t))}}("\n.p-scrolltop {\n position: fixed;\n bottom: 20px;\n right: 20px;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n.p-scrolltop-sticky {\n position: sticky;\n}\n.p-scrolltop-sticky.p-link {\n margin-left: auto;\n}\n.p-scrolltop-enter-from {\n opacity: 0;\n}\n.p-scrolltop-enter-active {\n -webkit-transition: opacity .15s;\n transition: opacity .15s;\n}\n.p-scrolltop.p-scrolltop-leave-to {\n opacity: 0;\n}\n.p-scrolltop-leave-active {\n -webkit-transition: opacity .15s;\n transition: opacity .15s;\n}\n"),r.render=function(t,r,c,a,p,d){return e(),n(i,{name:"p-scrolltop",appear:"",onEnter:d.onEnter},{default:s((()=>[p.visible?(e(),n("button",{key:0,class:d.containerClass,onClick:r[1]||(r[1]=(...t)=>d.onClick&&d.onClick(...t)),type:"button"},[l("span",{class:d.iconClass},null,2)],2)):o("",!0)])),_:1},8,["onEnter"])};export default r;