UNPKG

@uimkit/uikit-react

Version:

<img style="width:64px" src="https://mgmt.uimkit.chat/media/img/avatar.png"/>

66 lines (63 loc) 3.33 kB
import React__default from 'react'; import { UnknownType } from '../../types/index.js'; import { VirtuosoProps, ScrollSeekConfiguration, ScrollSeekPlaceholderProps } from 'react-virtuoso'; import { UIMessageProps } from '../UIMessage/UIMessage.js'; import { Message, Conversation } from '../../types/models.js'; type VirtualizedMessageListProps = { UIMessage?: React__default.ComponentType<UIMessageProps>; className?: string; messages?: Message[]; intervalsTimer?: number; hasMore?: boolean; hasMoreNewer?: boolean; loadMore?: () => Promise<void>; loadMoreNewer?: () => Promise<void>; /** Whether or not the list is currently loading more items */ loadingMore?: boolean; /** Whether or not the list is currently loading newer items */ loadingMoreNewer?: boolean; head?: React__default.ReactElement; /** The id of the message to highlight and center */ highlightedMessageId?: string; /** 自定义 render 函数, 如果设置, UIMessage 属性会被忽略 */ customMessageRenderer?: (messages: Message[], index: number) => React__default.ReactElement; /** If set, the default item height is used for the calculation of the total list height. Use if you expect messages with a lot of height variance */ defaultItemHeight?: number; /** Additional props to be passed the underlying [`react-virtuoso` virtualized list dependency](https://virtuoso.dev/virtuoso-api-reference/) */ additionalVirtuosoProps?: VirtuosoProps<UnknownType, unknown>; /** The scrollTo behavior when new messages appear. Use `"smooth"` for regular chat channels, and `"auto"` (which results in instant scroll to bottom) if you expect high throughput. */ stickToBottomScrollBehavior?: 'smooth' | 'auto'; /** 当新消息加载时停止列表的自动滚动 */ suppressAutoscroll?: boolean; /** When `true`, the list will scroll to the latest message when the window regains focus */ scrollToLatestMessageOnFocus?: boolean; /** The amount of extra content the list should render in addition to what's necessary to fill in the viewport */ overscan?: number; /** * Performance improvement by showing placeholders if user scrolls fast through list. * it can be used like this: * ``` * { * enter: (velocity) => Math.abs(velocity) > 120, * exit: (velocity) => Math.abs(velocity) < 40, * change: () => null, * placeholder: ({index, height})=> <div style={{height: height + "px"}}>{index}</div>, * } * ``` */ scrollSeekPlaceHolder?: ScrollSeekConfiguration & { placeholder: React__default.ComponentType<ScrollSeekPlaceholderProps>; }; }; type VirtualizedMessageListWithContextProps = VirtualizedMessageListProps & { conversation: Conversation; hasMore: boolean; hasMoreNewer: boolean; /** Function called when latest messages should be loaded, after the list has jumped at an earlier message set */ jumpToLatestMessage: () => Promise<void>; loadingMore: boolean; loadingMoreNewer: boolean; }; declare const VirtualizedMessageList: React__default.FC<VirtualizedMessageListProps>; export { VirtualizedMessageList, VirtualizedMessageListProps, VirtualizedMessageListWithContextProps }; //# sourceMappingURL=VirtualizedMessageList.d.ts.map