better animation

This commit is contained in:
Cole Goldsmith 2025-11-20 12:49:07 -06:00
parent c76e1d1b91
commit 1168b66e4e

View file

@ -54,6 +54,7 @@ export function AssistantMessage({
<div className="w-8 h-8 flex items-center justify-center flex-shrink-0 select-none"> <div className="w-8 h-8 flex items-center justify-center flex-shrink-0 select-none">
{/* Dog icon with bark animation when greeting */} {/* Dog icon with bark animation when greeting */}
<motion.div <motion.div
initial={isInitialGreeting ? { rotate: -5, y: -1 } : false}
animate={ animate={
isInitialGreeting isInitialGreeting
? { ? {
@ -100,25 +101,26 @@ export function AssistantMessage({
/> />
<div className="relative"> <div className="relative">
{/* Slide animation for initial greeting */} {/* Slide animation for initial greeting */}
{isInitialGreeting ? (
<motion.div <motion.div
initial={{ opacity: 0, x: -16 }} initial={isInitialGreeting ? { opacity: 0, x: -16 } : false}
animate={{ animate={
isInitialGreeting
? {
opacity: [0, 0, 1, 1], opacity: [0, 0, 1, 1],
x: [-16, -8, 0, 0], x: [-16, -8, 0, 0],
}} }
transition={{ : {}
}
transition={
isInitialGreeting
? {
duration: 0.8, duration: 0.8,
times: [0, 0.3, 0.6, 1], times: [0, 0.3, 0.6, 1],
ease: "easeOut", ease: "easeOut",
}} }
: {}
}
> >
<MarkdownRenderer
className="text-sm py-1.5 text-foreground"
chatMessage={content}
/>
</motion.div>
) : (
<MarkdownRenderer <MarkdownRenderer
className={cn( className={cn(
"text-sm py-1.5 transition-colors duration-300", "text-sm py-1.5 transition-colors duration-300",
@ -133,7 +135,7 @@ export function AssistantMessage({
: content : content
} }
/> />
)} </motion.div>
</div> </div>
</Message> </Message>
</motion.div> </motion.div>