Why doesn't Shadcn use compound components?

[jirulak02]

I am sure this was already discussed somewhere (also since Radix UI uses them), but I couldn’t find it.

Recently there has been a push at my company to convert the Shadcn components to compound components, e.g. like this:

export const Dialog = Object.assign(DialogRoot, {
  Trigger: DialogTrigger,
  Close: DialogClose,
  Content: Object.assign(DialogContent, {
    Header: Object.assign(DialogHeader, {
      Title: DialogTitle,
      Description: DialogDescription,
    }),
    Footer: DialogFooter,
  }),
})

With use like this:

import { Dialog } from "@/components/ui/dialog"

<Dialog>
  <Dialog.Trigger> ... </Dialog.Trigger>
  <Dialog.Content>
    <Dialog.Content.Header>
      <Dialog.Content.Header.Title>
        ...
      </Dialog.Content.Header.Title>
      <Dialog.Content.Header.Description>
        ...
      </Dialog.Content.Header.Description>
    </Dialog.Content.Header>
    ...
 </Dialog.Content>
</Dialog>

The reasons for the push were mostly improved intellisense, smaller imports and prevention of incorrect use, since it's clear for each component what parent components it needs.

I am a big advocate for just using the default wherever possible and would like to hear what were the reasons for going with the separated components in Shadcn and not compound ones, especially since Radix UI already uses them?