@farris/ui-vue/components/scroll-list/index.umd.cjs

Farris Vue, a Farris Design based Vue3 component library.

(function(d,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("../locale/index.umd.js"),require("lodash-es"),require("../common/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","vue","../locale/index.umd.js","lodash-es","../common/index.umd.js"],t):(d=typeof globalThis<"u"?globalThis:d||self,t(d["scroll-list"]={},d.Vue,d.locale,d.LodashES,d.common))})(this,function(d,t,R,V,H){"use strict";const N={loading:{type:Boolean,default:!1},error:{type:Boolean,default:!1},finished:{type:Boolean,default:!1},autoLoadMore:{type:Boolean,default:!0},offset:{type:[Number,String],default:30},immediateCheck:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},direction:{type:String,default:"down"},loadMoreText:{type:String,default:void 0},loadingText:{type:String,default:void 0},finishedText:{type:String,default:void 0},errorText:{type:String,default:void 0},showFinishedTip:{type:Boolean,default:!0}},k=/scroll|auto|overlay/i,b=typeof window<"u"?window:void 0;function p(e){return e.tagName!=="HTML"&&e.tagName!=="BODY"&&e.nodeType===1}function C(e,l=b){let o=e;for(;o&&o!==l&&p(o);){const{overflowY:a}=window.getComputedStyle(o);if(k.test(a))return o;o=o.parentNode}return l}function D(e,l=b){const o=t.ref();return t.onMounted(()=>{e.value&&(o.value=C(e.value,l))}),o}function P(e){let l;t.onMounted(()=>{e(),t.nextTick(()=>{l=!0})}),t.onActivated(()=>{l&&e()})}function O(e,l,o={}){let a=!1;const{target:i=window,capture:n=!1,immediate:g=!1}=o,{passive:S=!1}=o,s=()=>{const u=t.unref(i);u&&!a&&(u.addEventListener(e,l,{capture:n,passive:S}),a=!0)},f=()=>{const u=t.unref(i);u&&a&&(u.removeEventListener(e,l,n),a=!1)};g?s():P(s),t.onUnmounted(f),t.onDeactivated(f)}const _=30,j=(e,l)=>{const{containerRef:o,direction:a,offset:i}=e,n=t.ref(!1),g=D(o),S=t.computed(()=>(t.isRef(a)?a.value:a)||"down"),s=t.computed(()=>{const m=t.isRef(i)?+i.value:+(i||0);return m>=0?m:_});let f=!1;const u=m=>{f||(f=!0,t.nextTick(()=>{const c=m&&m.target||g.value;if(!c)return;const E=window.innerHeight,L=typeof c.scrollHeight=="number"?c.scrollHeight:Math.max(document.documentElement.scrollHeight,document.body.scrollHeight),T=typeof c.offsetHeight=="number"?c.offsetHeight:E,w=typeof c.scrollTop=="number"?c.scrollTop:document.documentElement.scrollTop||document.body.scrollTop;if(T<=0)return;const M=L-w-T;n.value=S.value==="up"?w<=s.value:M<=s.value,n.value&&l&&l(),f=!1,e.onScroll&&e.onScroll({topDistance:w,bottomDistance:M})}))};return t.onMounted(()=>{O("scroll",V.throttle(u,100),{target:g,passive:!0,immediate:!0})}),{isReachEdge:n,check:()=>u()}},v=t.defineComponent({name:"FScrollList",props:N,emit:["load","update:error","update:loading","scroll"],setup(e,l){const{bem:o}=H.useBem("FScrollList"),{getLocaleValue:a}=R.LocaleService,{emit:i,slots:n,expose:g}=l,S=t.ref(),s=t.ref(e.loading),f=()=>{s.value=!0,i("update:loading",!0),i("load")},u=t.computed(()=>e.autoLoadMore&&!s.value&&!e.finished&&!e.disabled&&!e.error),m=()=>{u.value&&f()},{direction:c,offset:E}=t.toRefs(e),{check:L}=j({containerRef:S,direction:c.value,offset:E.value,onScroll:r=>{i("scroll",r)}},m);t.watch(()=>[e.loading,e.finished,e.error],()=>{s.value=e.loading,e.autoLoadMore&&L()});const T=t.computed(()=>e.autoLoadMore&&e.immediateCheck);t.onMounted(()=>{T.value&&L()});const w=()=>{e.disabled||(e.error&&i("update:error",!1),f())},M=()=>{var h;const r=(h=n.header)==null?void 0:h.call(n);if(r)return t.createVNode("div",{class:o("header")},[r])},A=()=>{var h;const r=(h=n.footer)==null?void 0:h.call(n);if(r)return t.createVNode("div",{class:o("footer")},[r])},I=()=>{if(!e.showFinishedTip)return;const r=n.finished?n.finished():e.finishedText;if(r)return t.createVNode("div",{class:o("finished-info")},[r])},q=()=>{const r=n.loading?n.loading():t.createVNode("div",{class:o(["list","loading-container"])},[t.createVNode("span",{class:"f-loading-round",style:"width: 16px; height: 16px;"},null),t.createVNode("span",null,[e.loadingText||a("scroll-list.loading")])]);return t.createVNode("div",{class:o(["list","loading"])},[r])},Y=()=>{const r=n.error?n.error():e.errorText;if(r)return t.createVNode("div",{role:"button",class:o("error"),tabindex:0,onClick:w},[r])},U=()=>{const r=n.loadMore?n.loadMore():e.loadMoreText||a("scroll-list.loadMore");return t.createVNode("div",{role:"button",class:o("load-more"),tabindex:0,onClick:w},[r])},y=t.computed(()=>e.finished),x=t.computed(()=>s.value&&!e.disabled&&!y.value),B=t.computed(()=>e.error&&!y.value&&!x.value),z=t.computed(()=>!e.autoLoadMore&&!y.value&&!x.value&&!B.value),G=()=>t.createVNode(t.Fragment,null,[y.value&&I(),x.value&&q(),B.value&&Y(),z.value&&U()]);return g({check:L}),()=>{var F;const r=(F=n.default)==null?void 0:F.call(n),h=c.value==="down",J=c.value==="up";return t.createVNode("div",{ref:S,class:o("list")},[M(),h&&r,G(),J&&r,A()])}}});v.install=e=>{e.component(v.name,v)},d.FScrollList=v,d.default=v,d.listProps=N,Object.defineProperties(d,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});