ui Architecture Docs
Home / File/ empty-avatar.tsx — ui Source File

empty-avatar.tsx — ui Source File

Architecture documentation for empty-avatar.tsx, a tsx file in the ui codebase. 3 imports, 0 dependents.

File tsx DocumentationAtlas ContentSourcing 3 imports 1 functions

Entity Profile

Dependency Diagram

graph LR
  58e18e05_e4d3_87a0_a7d7_00cdfbe5cb71["empty-avatar.tsx"]
  00c9789a_2f63_b98d_c90d_4d6abf3582ce["avatar"]
  58e18e05_e4d3_87a0_a7d7_00cdfbe5cb71 --> 00c9789a_2f63_b98d_c90d_4d6abf3582ce
  4544fa74_9b37_0912_c55e_f4ff161b8e83["button"]
  58e18e05_e4d3_87a0_a7d7_00cdfbe5cb71 --> 4544fa74_9b37_0912_c55e_f4ff161b8e83
  29a55916_5997_18bd_e445_208bb7dd8efa["empty"]
  58e18e05_e4d3_87a0_a7d7_00cdfbe5cb71 --> 29a55916_5997_18bd_e445_208bb7dd8efa
  style 58e18e05_e4d3_87a0_a7d7_00cdfbe5cb71 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { Avatar, AvatarFallback, AvatarImage } from "@/examples/base/ui/avatar"
import { Button } from "@/examples/base/ui/button"
import {
  Empty,
  EmptyContent,
  EmptyDescription,
  EmptyHeader,
  EmptyMedia,
  EmptyTitle,
} from "@/examples/base/ui/empty"

export default function EmptyAvatar() {
  return (
    <Empty>
      <EmptyHeader>
        <EmptyMedia variant="default">
          <Avatar className="size-12">
            <AvatarImage
              src="https://github.com/shadcn.png"
              className="grayscale"
            />
            <AvatarFallback>LR</AvatarFallback>
          </Avatar>
        </EmptyMedia>
        <EmptyTitle>User Offline</EmptyTitle>
        <EmptyDescription>
          This user is currently offline. You can leave a message to notify them
          or try again later.
        </EmptyDescription>
      </EmptyHeader>
      <EmptyContent>
        <Button size="sm">Leave Message</Button>
      </EmptyContent>
    </Empty>
  )
}

Domain

Subdomains

Functions

Dependencies

  • avatar
  • button
  • empty

Source

Frequently Asked Questions

What does empty-avatar.tsx do?
empty-avatar.tsx is a source file in the ui codebase, written in tsx. It belongs to the DocumentationAtlas domain, ContentSourcing subdomain.
What functions are defined in empty-avatar.tsx?
empty-avatar.tsx defines 1 function(s): EmptyAvatar.
What does empty-avatar.tsx depend on?
empty-avatar.tsx imports 3 module(s): avatar, button, empty.
Where is empty-avatar.tsx in the architecture?
empty-avatar.tsx is located at apps/v4/examples/base/empty-avatar.tsx (domain: DocumentationAtlas, subdomain: ContentSourcing, directory: apps/v4/examples/base).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free