directory-add-button.tsx — ui Source File

Source Code

"use client"

import * as React from "react"
import { IconCheck, IconCopy, IconPlus } from "@tabler/icons-react"

import { useConfig } from "@/hooks/use-config"
import { useIsMobile } from "@/hooks/use-mobile"
import { copyToClipboardWithMeta } from "@/components/copy-button"
import { Button } from "@/registry/new-york-v4/ui/button"
import {
  Dialog,
  DialogClose,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
  DialogTrigger,
} from "@/registry/new-york-v4/ui/dialog"
import {
  Drawer,
  DrawerClose,
  DrawerContent,
  DrawerDescription,
  DrawerFooter,
  DrawerHeader,
  DrawerTitle,
  DrawerTrigger,
} from "@/registry/new-york-v4/ui/drawer"
import {
  Tabs,
  TabsContent,
  TabsList,
  TabsTrigger,
} from "@/registry/new-york-v4/ui/tabs"
import {
  Tooltip,
  TooltipContent,
  TooltipTrigger,
} from "@/registry/new-york-v4/ui/tooltip"

export function DirectoryAddButton({
  registry,
}: {
  registry: { name: string }
}) {
  const [config, setConfig] = useConfig()
  const [hasCopied, setHasCopied] = React.useState(false)
  const [open, setOpen] = React.useState(false)
  const isMobile = useIsMobile()

  const packageManager = config.packageManager || "pnpm"

  const commands = React.useMemo(() => {
    return {
      pnpm: `pnpm dlx shadcn@latest registry add ${registry.name}`,
      npm: `npx shadcn@latest registry add ${registry.name}`,
      yarn: `yarn dlx shadcn@latest registry add ${registry.name}`,
      bun: `bunx --bun shadcn@latest registry add ${registry.name}`,
    }
// ... (122 more lines)