ant-design-x-vue/lib/bubble/BubbleList.js

Craft AI-driven interfaces effortlessly

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),p=require("../attachments/Attachments2.js"),k=require("../_util/hooks/use-event-callback.js"),y=require("../_util/pick-attrs.js");require("../x-provider/index.js");const z=require("./Bubble.js"),O=require("./hooks/useDisplayData.js"),X=require("./hooks/useListData.js"),$=require("./style/index.js"),g=require("../_util/hooks/use-state.js"),j=require("./context.js"),K=require("../x-provider/hooks/use-x-provider-context.js"),W=1,F=e.defineComponent({name:"AXBubbleList",inheritAttrs:!1,__name:"BubbleList",props:e.mergeDefaults({prefixCls:null,rootClassName:null,items:null,autoScroll:{type:Boolean},roles:null},{autoScroll:!0}),setup(s,{expose:E}){const I=p.createPropsRestProxy(s,["prefixCls","rootClassName","items","autoScroll","roles"]);e.toRef(s,"roles"),e.toRef(s,"items"),e.toRef(s,"prefixCls");const V=e.useAttrs(),n=e.useSlots(),w=e.computed(()=>y.default(e.mergeProps(I,V),{attr:!0,aria:!0})),v=e.ref(s.items),C=e.ref(s.roles);e.watch(()=>s.items,()=>{v.value=s.items}),e.watch(()=>s.roles,()=>{C.value=s.roles});const i=e.ref(null),d=e.ref({}),{getPrefixCls:N}=K.default(),x=N("bubble",s.prefixCls),S=`${x}-list`,[T,A,D]=$.default(x),[b,P]=g.default(!1);e.watchEffect(()=>{P(!0),e.onWatcherCleanup(()=>{P(!1)})});const B=X.default(v,C),[c,_]=O.default(B),[R,m]=g.default(!0),[h,q]=g.default(0),L=t=>{const r=t.target;m(r.scrollHeight-Math.abs(r.scrollTop)-r.clientHeight<=W)};e.watch(h,()=>{s.autoScroll&&e.unref(i)&&e.unref(R)&&e.nextTick(()=>{e.unref(i).scrollTo({top:e.unref(i).scrollHeight})})}),e.watch(()=>e.unref(c).length,()=>{var t;if(s.autoScroll){const r=(t=e.unref(c)[e.unref(c).length-2])==null?void 0:t.key,o=e.unref(d)[r];if(o){const{nativeElement:a}=o,{top:u=0,bottom:f=0}=(a==null?void 0:a.getBoundingClientRect())??{},{top:l,bottom:U}=e.unref(i).getBoundingClientRect();u<U&&f>l&&(q(e.unref(h)+1),m(!0))}}});const H=k.useEventCallback(()=>{s.autoScroll&&q(e.unref(h)+1)}),M=e.computed(()=>({onUpdate:H}));return E({nativeElement:i,scrollTo:({key:t,offset:r,behavior:o="smooth",block:a})=>{if(typeof r=="number")e.unref(i).scrollTo({top:r,behavior:o});else if(t!==void 0){const u=e.unref(d)[t];if(u){const f=e.unref(c).findIndex(l=>l.key===t);m(f===e.unref(c).length-1),u.nativeElement.scrollIntoView({behavior:o,block:a})}}}}),()=>T(e.createVNode(j.BubbleContextProvider,{value:M.value},{default:()=>[e.createVNode("div",e.mergeProps(w.value,{class:p.classnames(S,s.rootClassName,A.value,D,{[`${S}-reach-end`]:R.value}),ref:i,onScroll:L}),[e.unref(c).map(({key:t,onTypingComplete:r,...o})=>{var a,u,f;return e.createVNode(z.default,e.mergeProps(o,{avatar:n.avatar?()=>{var l;return(l=n.avatar)==null?void 0:l.call(n,{item:{key:t,...o}})}:o.avatar,header:((a=n.header)==null?void 0:a.call(n,{item:{key:t,...o}}))??o.header,footer:((u=n.footer)==null?void 0:u.call(n,{item:{key:t,...o}}))??o.footer,loadingRender:n.loading?()=>n.loading({item:{key:t,...o}}):o.loadingRender,content:((f=n.message)==null?void 0:f.call(n,{item:{key:t,...o}}))??o.content,key:t,ref:l=>{l?d.value[t]=l:delete d.value[t]},typing:b.value?o.typing:!1,onTypingComplete:()=>{r==null||r(),_(t)}}),null)})])]}))}});exports.default=F;