EmptyRtl() — ui Function Reference

Architecture documentation for the EmptyRtl() function in empty-rtl.tsx from the ui codebase.

Function tsx DocumentationAtlas ContentSourcing

Entity Profile

DocumentationAtlas→ ContentSourcing→ EmptyRtl() — ui Function Reference

Dependency Diagram

graph TD
  79b91e07_1ee1_0cb0_3b1f_711072cdfe84["EmptyRtl()"]
  bcac5977_6eed_7ff5_fcb7_bee169310d36["empty-rtl.tsx"]
  79b91e07_1ee1_0cb0_3b1f_711072cdfe84 -->|defined in| bcac5977_6eed_7ff5_fcb7_bee169310d36
  style 79b91e07_1ee1_0cb0_3b1f_711072cdfe84 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/radix/empty-rtl.tsx lines 56–85

export function EmptyRtl() {
  const { dir, t } = useTranslation(translations, "ar")

  return (
    <Empty dir={dir}>
      <EmptyHeader>
        <EmptyMedia variant="icon">
          <IconFolderCode />
        </EmptyMedia>
        <EmptyTitle>{t.title}</EmptyTitle>
        <EmptyDescription>{t.description}</EmptyDescription>
      </EmptyHeader>
      <EmptyContent className="flex-row justify-center gap-2">
        <Button>{t.createProject}</Button>
        <Button variant="outline">{t.importProject}</Button>
      </EmptyContent>
      <Button
        variant="link"
        asChild
        className="text-muted-foreground"
        size="sm"
      >
        <a href="#">
          {t.learnMore}{" "}
          <ArrowUpRightIcon className="rtl:rotate-270" data-icon="inline-end" />
        </a>
      </Button>
    </Empty>
  )
}