@artmate/chat/dist/cjs/bubbleList/index.vue.js

借鉴字节开源react库AntX，通过vue实现的版本

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),x=require("../bubble/index.vue.js");;/* empty css                    */const D=require("../hooks/useNamespace.js"),L=require("./hooks/useDisplayData.js"),N=require("./hooks/useListData.js"),E=1,H=e.defineComponent({__name:"index",props:{autoScroll:{type:Boolean,default:!0},className:{},items:{default:()=>[]},roles:{},rootClassName:{}},setup(y,{expose:h}){const a=y,d=D.useNamespace("bubble-list"),_=e.useSlots(),B=e.ref(!0),i=e.ref(!1),f=e.ref(0),s=e.ref(),p=e.ref({}),{ListData:m,setListData:C}=N.default(a.items,a.roles),[c,T,k]=L.default(m);e.watch(()=>a.items,()=>{C(a.items)}),e.watch(()=>m.value,()=>{k()});const S=t=>{const o=t.target;i.value=o.scrollHeight-Math.abs(o.scrollTop)-o.clientHeight<=E};e.watch(()=>f.value,()=>{a.autoScroll&&s.value&&i.value&&s.value.scrollTo({top:s.value.scrollHeight})}),e.watch(()=>c.value.length,()=>{e.nextTick(()=>{var t;if(a.autoScroll){const o=(t=c.value[c.value.length-2])==null?void 0:t.key,l=p.value[o];if(l){const{nativeElement:n}=l,{top:r=0,bottom:u=0}=(n==null?void 0:n.getBoundingClientRect())??{},{top:v,bottom:w}=s.value.getBoundingClientRect();r<w&&u>v&&(f.value+=1,i.value=!0)}}})});const R=()=>{a.autoScroll&&(f.value=f.value+1)},I=t=>{var o;t!=null&&t.key&&((o=t==null?void 0:t.onTypingComplete)==null||o.call(t),T(t.key))},g=({key:t,offset:o,behavior:l="smooth",block:n})=>{if(typeof o=="number")s.value.scrollTo({top:o,behavior:l});else if(t!==void 0){const r=p.value[t];if(r){const u=c.value.findIndex(v=>v.key===t);i.value=u===c.value.length-1,r.$el.scrollIntoView({behavior:l,block:n})}}},q=(t,o)=>{o!=null&&(t?Reflect.set(p.value,o,t):Reflect.deleteProperty(p.value,o))};return e.onMounted(()=>{e.nextTick(()=>{g({offset:s.value.scrollHeight,behavior:"auto"})})}),h({nativeElement:s.value,scrollTo:g}),(t,o)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"listRef",ref:s,class:e.normalizeClass([e.unref(d).b(),t.rootClassName,t.className,i.value&&e.unref(d).b("reach-end")]),onScroll:S},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(c),l=>(e.openBlock(),e.createBlock(x.default,e.mergeProps({key:l.key,ref_for:!0},l,{ref_for:!0,ref:n=>q(n,l.key),"on-typing-complete":()=>I(l),"on-update":R,typing:B.value?l.typing:!1}),e.createSlots({_:2},[e.renderList(_,(n,r)=>({name:r,fn:e.withCtx(u=>[e.renderSlot(t.$slots,r,{info:{...u,...l}})])}))]),1040,["on-typing-complete","typing"]))),128))],34))}});exports.default=H;