{
  "name": "dashboard-07",
  "type": "registry:block",
  "registryDependencies": [
    "badge",
    "breadcrumb",
    "button",
    "card",
    "dropdown-menu",
    "input",
    "pagination",
    "progress",
    "separator",
    "sheet",
    "table",
    "tabs",
    "tooltip"
  ],
  "files": [
    {
      "path": "block/dashboard-07.tsx",
      "content": "import Image from \"next/image\"\nimport Link from \"next/link\"\nimport {\n  ChevronLeft,\n  Home,\n  LineChart,\n  Package,\n  Package2,\n  PanelLeft,\n  PlusCircle,\n  Search,\n  Settings,\n  ShoppingCart,\n  Upload,\n  Users2,\n} from \"lucide-react\"\n\nimport { Badge } from \"@/registry/new-york/ui/badge\"\nimport {\n  Breadcrumb,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n} from \"@/registry/new-york/ui/breadcrumb\"\nimport { Button } from \"@/registry/new-york/ui/button\"\nimport {\n  Card,\n  CardContent,\n  CardDescription,\n  CardFooter,\n  CardHeader,\n  CardTitle,\n} from \"@/registry/new-york/ui/card\"\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"@/registry/new-york/ui/dropdown-menu\"\nimport { Input } from \"@/registry/new-york/ui/input\"\nimport { Label } from \"@/registry/new-york/ui/label\"\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"@/registry/new-york/ui/select\"\nimport { Sheet, SheetContent, SheetTrigger } from \"@/registry/new-york/ui/sheet\"\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from \"@/registry/new-york/ui/table\"\nimport { Textarea } from \"@/registry/new-york/ui/textarea\"\nimport {\n  ToggleGroup,\n  ToggleGroupItem,\n} from \"@/registry/new-york/ui/toggle-group\"\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipTrigger,\n} from \"@/registry/new-york/ui/tooltip\"\n\nexport default function Dashboard() {\n  return (\n    <div className=\"flex min-h-screen w-full flex-col bg-muted/40\">\n      <aside className=\"fixed inset-y-0 left-0 z-10 hidden w-14 flex-col border-r bg-background sm:flex\">\n        <nav className=\"flex flex-col items-center gap-4 px-2 py-4\">\n          <Link\n            href=\"#\"\n            className=\"group flex h-9 w-9 shrink-0 items-center justify-center gap-2 rounded-full bg-primary text-lg font-semibold text-primary-foreground md:h-8 md:w-8 md:text-base\"\n          >\n            <Package2 className=\"h-4 w-4 transition-all group-hover:scale-110\" />\n            <span className=\"sr-only\">Acme Inc</span>\n          </Link>\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Link\n                href=\"#\"\n                className=\"flex h-9 w-9 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:text-foreground md:h-8 md:w-8\"\n              >\n                <Home className=\"h-5 w-5\" />\n                <span className=\"sr-only\">Dashboard</span>\n              </Link>\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">Dashboard</TooltipContent>\n          </Tooltip>\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Link\n                href=\"#\"\n                className=\"flex h-9 w-9 items-center justify-center rounded-lg transition-colors hover:text-foreground md:h-8 md:w-8\"\n              >\n                <ShoppingCart className=\"h-5 w-5\" />\n                <span className=\"sr-only\">Orders</span>\n              </Link>\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">Orders</TooltipContent>\n          </Tooltip>\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Link\n                href=\"#\"\n                className=\"flex h-9 w-9 items-center justify-center rounded-lg bg-accent text-accent-foreground transition-colors hover:text-foreground md:h-8 md:w-8\"\n              >\n                <Package className=\"h-5 w-5\" />\n                <span className=\"sr-only\">Products</span>\n              </Link>\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">Products</TooltipContent>\n          </Tooltip>\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Link\n                href=\"#\"\n                className=\"flex h-9 w-9 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:text-foreground md:h-8 md:w-8\"\n              >\n                <Users2 className=\"h-5 w-5\" />\n                <span className=\"sr-only\">Customers</span>\n              </Link>\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">Customers</TooltipContent>\n          </Tooltip>\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Link\n                href=\"#\"\n                className=\"flex h-9 w-9 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:text-foreground md:h-8 md:w-8\"\n              >\n                <LineChart className=\"h-5 w-5\" />\n                <span className=\"sr-only\">Analytics</span>\n              </Link>\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">Analytics</TooltipContent>\n          </Tooltip>\n        </nav>\n        <nav className=\"mt-auto flex flex-col items-center gap-4 px-2 py-4\">\n          <Tooltip>\n            <TooltipTrigger asChild>\n              <Link\n                href=\"#\"\n                className=\"flex h-9 w-9 items-center justify-center rounded-lg text-muted-foreground transition-colors hover:text-foreground md:h-8 md:w-8\"\n              >\n                <Settings className=\"h-5 w-5\" />\n                <span className=\"sr-only\">Settings</span>\n              </Link>\n            </TooltipTrigger>\n            <TooltipContent side=\"right\">Settings</TooltipContent>\n          </Tooltip>\n        </nav>\n      </aside>\n      <div className=\"flex flex-col sm:gap-4 sm:py-4 sm:pl-14\">\n        <header className=\"sticky top-0 z-30 flex h-14 items-center gap-4 border-b bg-background px-4 sm:static sm:h-auto sm:border-0 sm:bg-transparent sm:px-6\">\n          <Sheet>\n            <SheetTrigger asChild>\n              <Button size=\"icon\" variant=\"outline\" className=\"sm:hidden\">\n                <PanelLeft className=\"h-5 w-5\" />\n                <span className=\"sr-only\">Toggle Menu</span>\n              </Button>\n            </SheetTrigger>\n            <SheetContent side=\"left\" className=\"sm:max-w-xs\">\n              <nav className=\"grid gap-6 text-lg font-medium\">\n                <Link\n                  href=\"#\"\n                  className=\"group flex h-10 w-10 shrink-0 items-center justify-center gap-2 rounded-full bg-primary text-lg font-semibold text-primary-foreground md:text-base\"\n                >\n                  <Package2 className=\"h-5 w-5 transition-all group-hover:scale-110\" />\n                  <span className=\"sr-only\">Acme Inc</span>\n                </Link>\n                <Link\n                  href=\"#\"\n                  className=\"flex items-center gap-4 px-2.5 text-muted-foreground hover:text-foreground\"\n                >\n                  <Home className=\"h-5 w-5\" />\n                  Dashboard\n                </Link>\n                <Link\n                  href=\"#\"\n                  className=\"flex items-center gap-4 px-2.5 text-muted-foreground hover:text-foreground\"\n                >\n                  <ShoppingCart className=\"h-5 w-5\" />\n                  Orders\n                </Link>\n                <Link\n                  href=\"#\"\n                  className=\"flex items-center gap-4 px-2.5 text-foreground\"\n                >\n                  <Package className=\"h-5 w-5\" />\n                  Products\n                </Link>\n                <Link\n                  href=\"#\"\n                  className=\"flex items-center gap-4 px-2.5 text-muted-foreground hover:text-foreground\"\n                >\n                  <Users2 className=\"h-5 w-5\" />\n                  Customers\n                </Link>\n                <Link\n                  href=\"#\"\n                  className=\"flex items-center gap-4 px-2.5 text-muted-foreground hover:text-foreground\"\n                >\n                  <LineChart className=\"h-5 w-5\" />\n                  Settings\n                </Link>\n              </nav>\n            </SheetContent>\n          </Sheet>\n          <Breadcrumb className=\"hidden md:flex\">\n            <BreadcrumbList>\n              <BreadcrumbItem>\n                <BreadcrumbLink asChild>\n                  <Link href=\"#\">Dashboard</Link>\n                </BreadcrumbLink>\n              </BreadcrumbItem>\n              <BreadcrumbSeparator />\n              <BreadcrumbItem>\n                <BreadcrumbLink asChild>\n                  <Link href=\"#\">Products</Link>\n                </BreadcrumbLink>\n              </BreadcrumbItem>\n              <BreadcrumbSeparator />\n              <BreadcrumbItem>\n                <BreadcrumbPage>Edit Product</BreadcrumbPage>\n              </BreadcrumbItem>\n            </BreadcrumbList>\n          </Breadcrumb>\n          <div className=\"relative ml-auto flex-1 md:grow-0\">\n            <Search className=\"absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground\" />\n            <Input\n              type=\"search\"\n              placeholder=\"Search...\"\n              className=\"w-full rounded-lg bg-background pl-8 md:w-[200px] lg:w-[320px]\"\n            />\n          </div>\n          <DropdownMenu>\n            <DropdownMenuTrigger asChild>\n              <Button\n                variant=\"outline\"\n                size=\"icon\"\n                className=\"overflow-hidden rounded-full\"\n              >\n                <Image\n                  src=\"/placeholder-user.jpg\"\n                  width={36}\n                  height={36}\n                  alt=\"Avatar\"\n                  className=\"overflow-hidden rounded-full\"\n                />\n              </Button>\n            </DropdownMenuTrigger>\n            <DropdownMenuContent align=\"end\">\n              <DropdownMenuLabel>My Account</DropdownMenuLabel>\n              <DropdownMenuSeparator />\n              <DropdownMenuItem>Settings</DropdownMenuItem>\n              <DropdownMenuItem>Support</DropdownMenuItem>\n              <DropdownMenuSeparator />\n              <DropdownMenuItem>Logout</DropdownMenuItem>\n            </DropdownMenuContent>\n          </DropdownMenu>\n        </header>\n        <main className=\"grid flex-1 items-start gap-4 p-4 sm:px-6 sm:py-0 md:gap-8\">\n          <div className=\"mx-auto grid max-w-[59rem] flex-1 auto-rows-max gap-4\">\n            <div className=\"flex items-center gap-4\">\n              <Button variant=\"outline\" size=\"icon\" className=\"h-7 w-7\">\n                <ChevronLeft className=\"h-4 w-4\" />\n                <span className=\"sr-only\">Back</span>\n              </Button>\n              <h1 className=\"flex-1 shrink-0 whitespace-nowrap text-xl font-semibold tracking-tight sm:grow-0\">\n                Pro Controller\n              </h1>\n              <Badge variant=\"outline\" className=\"ml-auto sm:ml-0\">\n                In stock\n              </Badge>\n              <div className=\"hidden items-center gap-2 md:ml-auto md:flex\">\n                <Button variant=\"outline\" size=\"sm\">\n                  Discard\n                </Button>\n                <Button size=\"sm\">Save Product</Button>\n              </div>\n            </div>\n            <div className=\"grid gap-4 md:grid-cols-[1fr_250px] lg:grid-cols-3 lg:gap-8\">\n              <div className=\"grid auto-rows-max items-start gap-4 lg:col-span-2 lg:gap-8\">\n                <Card x-chunk=\"A card with a form to edit the product details\">\n                  <CardHeader>\n                    <CardTitle>Product Details</CardTitle>\n                    <CardDescription>\n                      Lipsum dolor sit amet, consectetur adipiscing elit\n                    </CardDescription>\n                  </CardHeader>\n                  <CardContent>\n                    <div className=\"grid gap-6\">\n                      <div className=\"grid gap-3\">\n                        <Label htmlFor=\"name\">Name</Label>\n                        <Input\n                          id=\"name\"\n                          type=\"text\"\n                          className=\"w-full\"\n                          defaultValue=\"Gamer Gear Pro Controller\"\n                        />\n                      </div>\n                      <div className=\"grid gap-3\">\n                        <Label htmlFor=\"description\">Description</Label>\n                        <Textarea\n                          id=\"description\"\n                          defaultValue=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam auctor, nisl nec ultricies ultricies, nunc nisl ultricies nunc, nec ultricies nunc nisl nec nunc.\"\n                          className=\"min-h-32\"\n                        />\n                      </div>\n                    </div>\n                  </CardContent>\n                </Card>\n                <Card x-chunk=\"A card with a form to edit the product stock and variants\">\n                  <CardHeader>\n                    <CardTitle>Stock</CardTitle>\n                    <CardDescription>\n                      Lipsum dolor sit amet, consectetur adipiscing elit\n                    </CardDescription>\n                  </CardHeader>\n                  <CardContent>\n                    <Table>\n                      <TableHeader>\n                        <TableRow>\n                          <TableHead className=\"w-[100px]\">SKU</TableHead>\n                          <TableHead>Stock</TableHead>\n                          <TableHead>Price</TableHead>\n                          <TableHead className=\"w-[100px]\">Size</TableHead>\n                        </TableRow>\n                      </TableHeader>\n                      <TableBody>\n                        <TableRow>\n                          <TableCell className=\"font-semibold\">\n                            GGPC-001\n                          </TableCell>\n                          <TableCell>\n                            <Label htmlFor=\"stock-1\" className=\"sr-only\">\n                              Stock\n                            </Label>\n                            <Input\n                              id=\"stock-1\"\n                              type=\"number\"\n                              defaultValue=\"100\"\n                            />\n                          </TableCell>\n                          <TableCell>\n                            <Label htmlFor=\"price-1\" className=\"sr-only\">\n                              Price\n                            </Label>\n                            <Input\n                              id=\"price-1\"\n                              type=\"number\"\n                              defaultValue=\"99.99\"\n                            />\n                          </TableCell>\n                          <TableCell>\n                            <ToggleGroup\n                              type=\"single\"\n                              defaultValue=\"s\"\n                              variant=\"outline\"\n                            >\n                              <ToggleGroupItem value=\"s\">S</ToggleGroupItem>\n                              <ToggleGroupItem value=\"m\">M</ToggleGroupItem>\n                              <ToggleGroupItem value=\"l\">L</ToggleGroupItem>\n                            </ToggleGroup>\n                          </TableCell>\n                        </TableRow>\n                        <TableRow>\n                          <TableCell className=\"font-semibold\">\n                            GGPC-002\n                          </TableCell>\n                          <TableCell>\n                            <Label htmlFor=\"stock-2\" className=\"sr-only\">\n                              Stock\n                            </Label>\n                            <Input\n                              id=\"stock-2\"\n                              type=\"number\"\n                              defaultValue=\"143\"\n                            />\n                          </TableCell>\n                          <TableCell>\n                            <Label htmlFor=\"price-2\" className=\"sr-only\">\n                              Price\n                            </Label>\n                            <Input\n                              id=\"price-2\"\n                              type=\"number\"\n                              defaultValue=\"99.99\"\n                            />\n                          </TableCell>\n                          <TableCell>\n                            <ToggleGroup\n                              type=\"single\"\n                              defaultValue=\"m\"\n                              variant=\"outline\"\n                            >\n                              <ToggleGroupItem value=\"s\">S</ToggleGroupItem>\n                              <ToggleGroupItem value=\"m\">M</ToggleGroupItem>\n                              <ToggleGroupItem value=\"l\">L</ToggleGroupItem>\n                            </ToggleGroup>\n                          </TableCell>\n                        </TableRow>\n                        <TableRow>\n                          <TableCell className=\"font-semibold\">\n                            GGPC-003\n                          </TableCell>\n                          <TableCell>\n                            <Label htmlFor=\"stock-3\" className=\"sr-only\">\n                              Stock\n                            </Label>\n                            <Input\n                              id=\"stock-3\"\n                              type=\"number\"\n                              defaultValue=\"32\"\n                            />\n                          </TableCell>\n                          <TableCell>\n                            <Label htmlFor=\"price-3\" className=\"sr-only\">\n                              Stock\n                            </Label>\n                            <Input\n                              id=\"price-3\"\n                              type=\"number\"\n                              defaultValue=\"99.99\"\n                            />\n                          </TableCell>\n                          <TableCell>\n                            <ToggleGroup\n                              type=\"single\"\n                              defaultValue=\"s\"\n                              variant=\"outline\"\n                            >\n                              <ToggleGroupItem value=\"s\">S</ToggleGroupItem>\n                              <ToggleGroupItem value=\"m\">M</ToggleGroupItem>\n                              <ToggleGroupItem value=\"l\">L</ToggleGroupItem>\n                            </ToggleGroup>\n                          </TableCell>\n                        </TableRow>\n                      </TableBody>\n                    </Table>\n                  </CardContent>\n                  <CardFooter className=\"justify-center border-t p-4\">\n                    <Button size=\"sm\" variant=\"ghost\" className=\"gap-1\">\n                      <PlusCircle className=\"h-3.5 w-3.5\" />\n                      Add Variant\n                    </Button>\n                  </CardFooter>\n                </Card>\n                <Card x-chunk=\"A card with a form to edit the product category and subcategory\">\n                  <CardHeader>\n                    <CardTitle>Product Category</CardTitle>\n                  </CardHeader>\n                  <CardContent>\n                    <div className=\"grid gap-6 sm:grid-cols-3\">\n                      <div className=\"grid gap-3\">\n                        <Label htmlFor=\"category\">Category</Label>\n                        <Select>\n                          <SelectTrigger\n                            id=\"category\"\n                            aria-label=\"Select category\"\n                          >\n                            <SelectValue placeholder=\"Select category\" />\n                          </SelectTrigger>\n                          <SelectContent>\n                            <SelectItem value=\"clothing\">Clothing</SelectItem>\n                            <SelectItem value=\"electronics\">\n                              Electronics\n                            </SelectItem>\n                            <SelectItem value=\"accessories\">\n                              Accessories\n                            </SelectItem>\n                          </SelectContent>\n                        </Select>\n                      </div>\n                      <div className=\"grid gap-3\">\n                        <Label htmlFor=\"subcategory\">\n                          Subcategory (optional)\n                        </Label>\n                        <Select>\n                          <SelectTrigger\n                            id=\"subcategory\"\n                            aria-label=\"Select subcategory\"\n                          >\n                            <SelectValue placeholder=\"Select subcategory\" />\n                          </SelectTrigger>\n                          <SelectContent>\n                            <SelectItem value=\"t-shirts\">T-Shirts</SelectItem>\n                            <SelectItem value=\"hoodies\">Hoodies</SelectItem>\n                            <SelectItem value=\"sweatshirts\">\n                              Sweatshirts\n                            </SelectItem>\n                          </SelectContent>\n                        </Select>\n                      </div>\n                    </div>\n                  </CardContent>\n                </Card>\n              </div>\n              <div className=\"grid auto-rows-max items-start gap-4 lg:gap-8\">\n                <Card x-chunk=\"A card with a form to edit the product status\">\n                  <CardHeader>\n                    <CardTitle>Product Status</CardTitle>\n                  </CardHeader>\n                  <CardContent>\n                    <div className=\"grid gap-6\">\n                      <div className=\"grid gap-3\">\n                        <Label htmlFor=\"status\">Status</Label>\n                        <Select>\n                          <SelectTrigger id=\"status\" aria-label=\"Select status\">\n                            <SelectValue placeholder=\"Select status\" />\n                          </SelectTrigger>\n                          <SelectContent>\n                            <SelectItem value=\"draft\">Draft</SelectItem>\n                            <SelectItem value=\"published\">Active</SelectItem>\n                            <SelectItem value=\"archived\">Archived</SelectItem>\n                          </SelectContent>\n                        </Select>\n                      </div>\n                    </div>\n                  </CardContent>\n                </Card>\n                <Card\n                  className=\"overflow-hidden\"\n                  x-chunk=\"A card with a form to upload product images\"\n                >\n                  <CardHeader>\n                    <CardTitle>Product Images</CardTitle>\n                    <CardDescription>\n                      Lipsum dolor sit amet, consectetur adipiscing elit\n                    </CardDescription>\n                  </CardHeader>\n                  <CardContent>\n                    <div className=\"grid gap-2\">\n                      <Image\n                        alt=\"Product image\"\n                        className=\"aspect-square w-full rounded-md object-cover\"\n                        height=\"300\"\n                        src=\"/placeholder.svg\"\n                        width=\"300\"\n                      />\n                      <div className=\"grid grid-cols-3 gap-2\">\n                        <button>\n                          <Image\n                            alt=\"Product image\"\n                            className=\"aspect-square w-full rounded-md object-cover\"\n                            height=\"84\"\n                            src=\"/placeholder.svg\"\n                            width=\"84\"\n                          />\n                        </button>\n                        <button>\n                          <Image\n                            alt=\"Product image\"\n                            className=\"aspect-square w-full rounded-md object-cover\"\n                            height=\"84\"\n                            src=\"/placeholder.svg\"\n                            width=\"84\"\n                          />\n                        </button>\n                        <button className=\"flex aspect-square w-full items-center justify-center rounded-md border border-dashed\">\n                          <Upload className=\"h-4 w-4 text-muted-foreground\" />\n                          <span className=\"sr-only\">Upload</span>\n                        </button>\n                      </div>\n                    </div>\n                  </CardContent>\n                </Card>\n                <Card x-chunk=\"A card with a call to action to archive the product\">\n                  <CardHeader>\n                    <CardTitle>Archive Product</CardTitle>\n                    <CardDescription>\n                      Lipsum dolor sit amet, consectetur adipiscing elit.\n                    </CardDescription>\n                  </CardHeader>\n                  <CardContent>\n                    <div></div>\n                    <Button size=\"sm\" variant=\"secondary\">\n                      Archive Product\n                    </Button>\n                  </CardContent>\n                </Card>\n              </div>\n            </div>\n            <div className=\"flex items-center justify-center gap-2 md:hidden\">\n              <Button variant=\"outline\" size=\"sm\">\n                Discard\n              </Button>\n              <Button size=\"sm\">Save Product</Button>\n            </div>\n          </div>\n        </main>\n      </div>\n    </div>\n  )\n}\n",
      "type": "registry:block",
      "target": ""
    }
  ]
}