<AnalyzingImage />

<AnalyzingImage /> is a small status component for moments when the assistant is looking at an image and the user is waiting for the result. It makes that state feel intentional and product-specific instead of falling back to a neutral spinner.

Why it is useful

This component does one very specific job, and that is exactly what makes it valuable. In image-understanding flows, users usually need reassurance that the model is actively inspecting the image rather than simply “loading.”

Usage

The simplest usage is just to render the component inline wherever an image-analysis state appears. It already includes its own icon animation and localized status label.

import { AnalyzingImage } from "@workspace/ui-web/ai-elements/analyzing-image";

export function ImageAnalysisState() {
  return <AnalyzingImage />;
}

If you are already using the conversation primitives, this component also appears through the image loading variant in the conversation loading UI.

import { ConversationLoading } from "@workspace/ui-web/ai-elements/conversation";

export function AssistantPendingState() {
  return <ConversationLoading variant="image" />;
}

Props

The component is intentionally lightweight. It forwards standard div props, so you can pass className and any native wrapper attributes you need when placing it inside message rows, cards, or custom loading states.

How it works

The component combines three small pieces to create a clear multimodal loading state. The result is subtle enough for production UIs while still being recognizable at a glance.

• An animated image frame creates the feeling of an active scan.
• A moving vertical bar reinforces the “analyzing” motion.
• A <ShimmerText /> label displays the localized analyzingImage copy from the common translation namespace.

It does not manage image uploads, request state, or model calls on its own. It is purely a presentational component that helps your loading state communicate intent.

Related components

<AnalyzingImage /> works best as part of a broader conversational UI rather than as a standalone hero element. These nearby components are the most relevant companions.