Message Components

An animated SVG message bubble icon featuring pulsing indicator dots built with Motion, supporting hover-triggered or continuous looping animations for chat and notification interfaces.

A performance monitoring badge that displays AI message streaming statistics like TTFT and tokens per second, featuring a hover-triggered tooltip for detailed timing metrics.

A versatile chat message component for Vercel AI SDK that supports markdown rendering, tool call integration, and reasoning blocks with customizable variants for user and assistant message styling.

A comprehensive chat interface component that integrates with AI SDKs to provide real-time streaming text responses, message history management, and input handling for conversational AI applications.

An animated message square icon featuring an 'X' mark, built with Motion for React, featuring interactive rotation and cross-path animation sequences triggered by context controls.

An animated message square warning icon featuring a subtle shake and bounce effect built with Framer Motion and SVG, designed for interactive alert notifications.

An animated message square text icon built with Framer Motion, featuring interactive path-drawing and rotation effects triggered by animation controls.

An animated message square share icon built with Framer Motion, featuring interactive hover or trigger-based animations including rotation and directional arrow movement.

An animated message square quote icon built with Motion, featuring a subtle rotation effect and shifting internal quote marks triggered by interaction.

An animated message square plus icon built with Framer Motion that features a playful rotation and cross-path animation sequence triggered by interaction.

An animated message square off icon featuring a diagonal strike-through animation and subtle shake effects built with Framer Motion and SVG.

An animated message square icon featuring interactive SVG paths that support multiple motion states like pulse, jump, and default wobble, built with Framer Motion for responsive UI feedback.

An animated message square icon featuring a heart symbol that uses Framer Motion to perform a rhythmic rotation and scaling effect upon interaction.

An animated message square dot icon featuring a subtle shake effect on the square and a bouncing motion on the dot, built with Framer Motion and SVG.

An animated message square diff icon featuring interactive SVG path rotations and subtle movements powered by Framer Motion for dynamic UI feedback.

A decorative message square dashed icon featuring interactive motion variants, including a shake animation and a sequential drawing effect built with Framer Motion.

An animated message square code icon featuring interactive SVG path movements and rotation effects built with Framer Motion and Tailwind CSS.

A message square icon component featuring a subtle, interactive shake animation built with Framer Motion and SVG, designed for use in chat or notification interfaces.

An animated message circle icon featuring an 'X' mark, built with Framer Motion to provide interactive rotation and cross-path animation effects.

An animated message circle warning icon featuring a subtle shake effect and vertical bounce on the exclamation mark, built with Framer Motion and SVG for interactive UI feedback.