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