tailchat/client/web/src/components/ChatBox/ChatMessageList/ScrollToBottom.tsx

22 lines
593 B
TypeScript

import React from 'react';
import { Icon } from 'tailchat-design';
interface Props {
onClick: () => void;
}
/**
* 滚动到底部的按钮
*/
export const ScrollToBottom: React.FC<Props> = React.memo((props) => {
return (
<div
className="absolute right-10 bottom-18 px-3 py-2 rounded-full bg-white dark:bg-black bg-opacity-50 shadow cursor-pointer z-10 w-11 h-11 flex justify-center items-center text-2xl hover:bg-opacity-80"
onClick={props.onClick}
>
<Icon icon="mdi:chevron-double-down" />
</div>
);
});
ScrollToBottom.displayName = 'ScrollToBottom';