SkeletonAvatar() — ui Function Reference

Architecture documentation for the SkeletonAvatar() function in skeleton-example.tsx from the ui codebase.

Function tsx ComponentRegistry UIPrimitives

Entity Profile

ComponentRegistry→ UIPrimitives→ SkeletonAvatar() — ui Function Reference

Dependency Diagram

graph TD
  9d4d6810_2872_e786_2e1d_9601ea086686["SkeletonAvatar()"]
  57c8d182_e8c7_fc66_4636_f0be5761c1cf["skeleton-example.tsx"]
  9d4d6810_2872_e786_2e1d_9601ea086686 -->|defined in| 57c8d182_e8c7_fc66_4636_f0be5761c1cf
  style 9d4d6810_2872_e786_2e1d_9601ea086686 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/registry/bases/base/examples/skeleton-example.tsx lines 20–32

function SkeletonAvatar() {
  return (
    <Example title="Avatar">
      <div className="flex w-full items-center gap-4">
        <Skeleton className="size-10 shrink-0 rounded-full" />
        <div className="grid gap-2">
          <Skeleton className="h-4 w-[150px]" />
          <Skeleton className="h-4 w-[100px]" />
        </div>
      </div>
    </Example>
  )
}