{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "extends": "none",
  "name": "sidebar-15",
  "title": "sidebar-15",
  "description": "sidebar-15",
  "registryDependencies": [
    "https://intentui.com/r/avatar",
    "https://intentui.com/r/heading",
    "https://intentui.com/r/table",
    "https://intentui.com/r/breadcrumbs",
    "https://intentui.com/r/menu",
    "https://intentui.com/r/sidebar",
    "https://intentui.com/r/link"
  ],
  "files": [
    {
      "path": "registry/blocks/sidebar-15/page.tsx",
      "content": "'use client'\n\nimport { Avatar } from '@/components/ui/avatar'\nimport { Heading } from '@/components/ui/heading'\nimport {\n  Table,\n  TableBody,\n  TableCell,\n  TableColumn,\n  TableHeader,\n  TableRow,\n} from '@/components/ui/table'\n\nexport default function Page() {\n  return (\n    <>\n      <Heading>Users</Heading>\n      <Table aria-label=\"Users\" bleed className=\"[--gutter:var(--layout-padding)]\">\n        <TableHeader>\n          <TableColumn>ID</TableColumn>\n          <TableColumn isRowHeader>Name</TableColumn>\n          <TableColumn>Email</TableColumn>\n          <TableColumn>Username</TableColumn>\n          <TableColumn>Phone</TableColumn>\n          <TableColumn>Address</TableColumn>\n          <TableColumn>City</TableColumn>\n          <TableColumn>State</TableColumn>\n          <TableColumn>Country</TableColumn>\n          <TableColumn>Postal Code</TableColumn>\n          <TableColumn>Avatar</TableColumn>\n          <TableColumn>Status</TableColumn>\n          <TableColumn>Role</TableColumn>\n          <TableColumn>Last Login</TableColumn>\n          <TableColumn>Created At</TableColumn>\n          <TableColumn>Updated At</TableColumn>\n        </TableHeader>\n        <TableBody items={users}>\n          {(item) => (\n            <TableRow id={item.id}>\n              <TableCell>{item.id}</TableCell>\n              <TableCell>{item.name}</TableCell>\n              <TableCell>{item.email}</TableCell>\n              <TableCell>{item.username}</TableCell>\n              <TableCell>{item.phone}</TableCell>\n              <TableCell>{item.address}</TableCell>\n              <TableCell>{item.city}</TableCell>\n              <TableCell>{item.state}</TableCell>\n              <TableCell>{item.country}</TableCell>\n              <TableCell>{item.postalCode}</TableCell>\n              <TableCell>\n                <Avatar size=\"xs\" src={item.avatar} alt=\"Avatar\" />\n              </TableCell>\n              <TableCell>{item.status}</TableCell>\n              <TableCell>{item.role}</TableCell>\n              <TableCell>{new Date(item.lastLogin).toLocaleString()}</TableCell>\n              <TableCell>{new Date(item.createdAt).toLocaleString()}</TableCell>\n              <TableCell>{new Date(item.updatedAt).toLocaleString()}</TableCell>\n            </TableRow>\n          )}\n        </TableBody>\n      </Table>\n    </>\n  )\n}\n\nconst users = [\n  {\n    id: '1',\n    name: 'Michael Carter',\n    email: 'michael.carter@example.com',\n    username: 'mcarter',\n    phone: '+1-202-555-0173',\n    address: '742 Evergreen Terrace, Springfield',\n    city: 'Springfield',\n    state: 'Illinois',\n    country: 'USA',\n    postalCode: '62704',\n    avatar: 'https://i.pravatar.cc/150?u=1',\n    status: 'active',\n    role: 'admin',\n    lastLogin: '2025-05-10T13:42:00Z',\n    createdAt: '2023-01-10T10:15:00Z',\n    updatedAt: '2025-04-30T09:00:00Z',\n  },\n  {\n    id: '2',\n    name: 'Ava Thompson',\n    email: 'ava.thompson@example.com',\n    username: 'avt',\n    phone: '+44-7911-123456',\n    address: '19 Church Street, London',\n    city: 'London',\n    state: 'England',\n    country: 'UK',\n    postalCode: 'SW1A 1AA',\n    avatar: 'https://i.pravatar.cc/150?u=2',\n    status: 'pending',\n    role: 'editor',\n    lastLogin: '2025-05-08T16:00:00Z',\n    createdAt: '2022-12-05T09:00:00Z',\n    updatedAt: '2025-04-29T13:00:00Z',\n  },\n  {\n    id: '3',\n    name: 'Liam Nguyen',\n    email: 'liam.nguyen@example.com',\n    username: 'liamng',\n    phone: '+61-401-234-567',\n    address: '22 Collins Street, Melbourne',\n    city: 'Melbourne',\n    state: 'Victoria',\n    country: 'Australia',\n    postalCode: '3000',\n    avatar: 'https://i.pravatar.cc/150?u=3',\n    status: 'inactive',\n    role: 'viewer',\n    lastLogin: '2025-04-20T14:30:00Z',\n    createdAt: '2021-06-15T11:45:00Z',\n    updatedAt: '2025-04-01T08:10:00Z',\n  },\n  {\n    id: '4',\n    name: 'Sophia Martinez',\n    email: 'sophia.martinez@example.com',\n    username: 'smartinez',\n    phone: '+1-305-555-0199',\n    address: '301 Ocean Drive, Miami',\n    city: 'Miami',\n    state: 'Florida',\n    country: 'USA',\n    postalCode: '33139',\n    avatar: 'https://i.pravatar.cc/150?u=4',\n    status: 'active',\n    role: 'manager',\n    lastLogin: '2025-05-10T10:22:00Z',\n    createdAt: '2022-04-08T13:30:00Z',\n    updatedAt: '2025-05-01T11:50:00Z',\n  },\n  {\n    id: '5',\n    name: 'Noah Kim',\n    email: 'noah.kim@example.com',\n    username: 'noahk',\n    phone: '+82-10-1234-5678',\n    address: '55 Gangnam-daero, Seoul',\n    city: 'Seoul',\n    state: 'Seoul',\n    country: 'South Korea',\n    postalCode: '06000',\n    avatar: 'https://i.pravatar.cc/150?u=5',\n    status: 'banned',\n    role: 'viewer',\n    lastLogin: '2025-03-15T17:00:00Z',\n    createdAt: '2020-09-21T10:00:00Z',\n    updatedAt: '2025-02-18T15:30:00Z',\n  },\n  {\n    id: '6',\n    name: 'Emma Dubois',\n    email: 'emma.dubois@example.com',\n    username: 'emmad',\n    phone: '+33-6-12-34-56-78',\n    address: '10 Rue de Rivoli, Paris',\n    city: 'Paris',\n    state: 'Île-de-France',\n    country: 'France',\n    postalCode: '75001',\n    avatar: 'https://i.pravatar.cc/150?u=6',\n    status: 'active',\n    role: 'admin',\n    lastLogin: '2025-05-09T12:00:00Z',\n    createdAt: '2023-07-22T08:00:00Z',\n    updatedAt: '2025-05-09T12:15:00Z',\n  },\n  {\n    id: '7',\n    name: 'Ethan Schmidt',\n    email: 'ethan.schmidt@example.com',\n    username: 'ethansch',\n    phone: '+49-171-1234567',\n    address: '5 Alexanderplatz, Berlin',\n    city: 'Berlin',\n    state: 'Berlin',\n    country: 'Germany',\n    postalCode: '10178',\n    avatar: 'https://i.pravatar.cc/150?u=7',\n    status: 'active',\n    role: 'developer',\n    lastLogin: '2025-05-07T18:30:00Z',\n    createdAt: '2023-10-10T09:30:00Z',\n    updatedAt: '2025-04-20T08:40:00Z',\n  },\n  {\n    id: '8',\n    name: 'Isabella Rossi',\n    email: 'isabella.rossi@example.com',\n    username: 'bellar',\n    phone: '+39-320-1234567',\n    address: 'Via Roma 12, Milan',\n    city: 'Milan',\n    state: 'Lombardy',\n    country: 'Italy',\n    postalCode: '20100',\n    avatar: 'https://i.pravatar.cc/150?u=8',\n    status: 'pending',\n    role: 'editor',\n    lastLogin: '2025-04-28T20:15:00Z',\n    createdAt: '2022-05-15T14:00:00Z',\n    updatedAt: '2025-04-30T07:10:00Z',\n  },\n  {\n    id: '9',\n    name: 'Lucas Silva',\n    email: 'lucas.silva@example.com',\n    username: 'lucsilva',\n    phone: '+55-11-91234-5678',\n    address: 'Av. Paulista, São Paulo',\n    city: 'São Paulo',\n    state: 'SP',\n    country: 'Brazil',\n    postalCode: '01311-000',\n    avatar: 'https://i.pravatar.cc/150?u=9',\n    status: 'active',\n    role: 'manager',\n    lastLogin: '2025-05-03T08:00:00Z',\n    createdAt: '2021-03-05T10:00:00Z',\n    updatedAt: '2025-04-10T10:30:00Z',\n  },\n  {\n    id: '10',\n    name: 'Yuki Tanaka',\n    email: 'yuki.tanaka@example.com',\n    username: 'yuki_t',\n    phone: '+81-90-1234-5678',\n    address: '1 Chome-1-2 Oshiage, Tokyo',\n    city: 'Tokyo',\n    state: 'Tokyo',\n    country: 'Japan',\n    postalCode: '131-0045',\n    avatar: 'https://i.pravatar.cc/150?u=10',\n    status: 'active',\n    role: 'designer',\n    lastLogin: '2025-05-11T02:45:00Z',\n    createdAt: '2024-01-01T00:00:00Z',\n    updatedAt: '2025-05-10T22:00:00Z',\n  },\n]\n",
      "type": "registry:page",
      "target": "app/sidebar-15/page.tsx"
    },
    {
      "path": "registry/blocks/sidebar-15/app-sidebar-nav.tsx",
      "content": "'use client'\n\nimport {\n  ArrowRightOnRectangleIcon,\n  Cog6ToothIcon,\n  CommandLineIcon,\n  Squares2X2Icon,\n} from '@heroicons/react/24/outline'\nimport { Avatar } from '@/components/ui/avatar'\nimport { Breadcrumbs, BreadcrumbsItem } from '@/components/ui/breadcrumbs'\nimport {\n  Menu,\n  MenuContent,\n  MenuHeader,\n  MenuItem,\n  MenuLabel,\n  MenuSection,\n  MenuSeparator,\n  MenuTrigger,\n} from '@/components/ui/menu'\nimport { SidebarNav, SidebarTrigger } from '@/components/ui/sidebar'\n\nexport default function AppSidebarNav() {\n  return (\n    <SidebarNav>\n      <span className=\"flex items-center gap-x-4\">\n        <SidebarTrigger className=\"-ml-2.5 lg:ml-0\" />\n        <Breadcrumbs className=\"hidden md:flex\">\n          <BreadcrumbsItem href=\"/pre-blocks/sidebar/sidebar-01\">Dashboard</BreadcrumbsItem>\n          <BreadcrumbsItem>Newsletter</BreadcrumbsItem>\n        </Breadcrumbs>\n      </span>\n      <UserMenu />\n    </SidebarNav>\n  )\n}\n\nfunction UserMenu() {\n  return (\n    <Menu>\n      <MenuTrigger className=\"ml-auto md:hidden\" aria-label=\"Open Menu\">\n        <Avatar isSquare alt=\"kurt cobain\" src=\"https://intentui.com/images/avatar/cobain.jpg\" />\n      </MenuTrigger>\n      <MenuContent popover={{ placement: 'bottom end' }} className=\"min-w-64\">\n        <MenuSection>\n          <MenuHeader separator>\n            <span className=\"block\">Kurt Cobain</span>\n            <span className=\"font-normal text-muted-fg\">@cobain</span>\n          </MenuHeader>\n        </MenuSection>\n        <MenuItem href=\"#dashboard\">\n          <Squares2X2Icon />\n          <MenuLabel>Dashboard</MenuLabel>\n        </MenuItem>\n        <MenuItem href=\"#settings\">\n          <Cog6ToothIcon />\n          <MenuLabel>Settings</MenuLabel>\n        </MenuItem>\n        <MenuSeparator />\n        <MenuItem>\n          <CommandLineIcon />\n          <MenuLabel>Command Menu</MenuLabel>\n        </MenuItem>\n        <MenuSeparator />\n        <MenuItem href=\"#contact-s\">\n          <MenuLabel>Contact Support</MenuLabel>\n        </MenuItem>\n        <MenuSeparator />\n        <MenuItem href=\"#logout\">\n          <ArrowRightOnRectangleIcon />\n          <MenuLabel>Log out</MenuLabel>\n        </MenuItem>\n      </MenuContent>\n    </Menu>\n  )\n}\n",
      "type": "registry:component"
    },
    {
      "path": "registry/blocks/sidebar-15/app-sidebar.tsx",
      "content": "'use client'\n\nimport { EllipsisHorizontalIcon } from '@heroicons/react/16/solid'\nimport { ChevronUpDownIcon, PlusIcon } from '@heroicons/react/20/solid'\nimport {\n  ArchiveBoxIcon,\n  ArrowDownTrayIcon,\n  ArrowRightStartOnRectangleIcon,\n  ArrowUpTrayIcon,\n  BuildingOfficeIcon,\n  ChatBubbleLeftRightIcon,\n  CheckCircleIcon,\n  ClockIcon,\n  Cog6ToothIcon,\n  CreditCardIcon,\n  CubeIcon,\n  DocumentTextIcon,\n  HashtagIcon,\n  HomeIcon,\n  LifebuoyIcon,\n  ListBulletIcon,\n  QuestionMarkCircleIcon,\n  ShieldCheckIcon,\n  ShoppingBagIcon,\n  TicketIcon,\n} from '@heroicons/react/24/outline'\nimport { Avatar } from '@/components/ui/avatar'\nimport { Link } from '@/components/ui/link'\nimport {\n  Menu,\n  MenuContent,\n  MenuHeader,\n  MenuItem,\n  MenuSection,\n  MenuSeparator,\n  MenuTrigger,\n} from '@/components/ui/menu'\nimport {\n  Sidebar,\n  SidebarBadge,\n  SidebarContent,\n  SidebarDisclosure,\n  SidebarDisclosureGroup,\n  SidebarDisclosurePanel,\n  SidebarDisclosureTrigger,\n  SidebarFooter,\n  SidebarHeader,\n  SidebarItem,\n  SidebarLabel,\n  SidebarLink,\n  SidebarMenuTrigger,\n  SidebarRail,\n  SidebarSection,\n  SidebarSectionGroup,\n} from '@/components/ui/sidebar'\n\nexport default function AppSidebar(props: React.ComponentProps<typeof Sidebar>) {\n  return (\n    <Sidebar {...props}>\n      <SidebarHeader>\n        <Link href=\"/docs/components/layouts/sidebar\" className=\"flex items-center gap-x-2\">\n          <Avatar\n            isSquare\n            size=\"sm\"\n            className=\"outline-hidden\"\n            src=\"https://design.intentui.com/logo\"\n          />\n          <SidebarLabel className=\"font-medium\">\n            Intent <span className=\"text-muted-fg\">UI</span>\n          </SidebarLabel>\n        </Link>\n      </SidebarHeader>\n      <SidebarContent>\n        <SidebarSectionGroup>\n          <SidebarSection label=\"Overview\">\n            <SidebarItem tooltip=\"Overview\" isCurrent href=\"#\">\n              <HomeIcon />\n              <SidebarLabel>Overview</SidebarLabel>\n            </SidebarItem>\n\n            <SidebarItem tooltip=\"Orders\">\n              {({ isCollapsed, isFocused }) => (\n                <>\n                  <SidebarLink href=\"#\">\n                    <ShoppingBagIcon />\n                    <SidebarLabel>Orders</SidebarLabel>\n                  </SidebarLink>\n                  {(!isCollapsed || isFocused) && (\n                    <Menu>\n                      <SidebarMenuTrigger aria-label=\"Manage\">\n                        <EllipsisHorizontalIcon />\n                      </SidebarMenuTrigger>\n                      <MenuContent\n                        popover={{\n                          offset: 0,\n                          placement: 'right top',\n                        }}\n                      >\n                        <MenuItem href=\"#new-order\">\n                          <PlusIcon />\n                          Create New Order\n                        </MenuItem>\n                        <MenuItem href=\"#view-all\">\n                          <ListBulletIcon />\n                          View All Orders\n                        </MenuItem>\n                        <MenuItem href=\"#pending-orders\">\n                          <ClockIcon />\n                          Pending Orders\n                        </MenuItem>\n                        <MenuItem href=\"#completed-orders\">\n                          <CheckCircleIcon />\n                          Completed Orders\n                        </MenuItem>\n                        <MenuItem href=\"#export-orders\">\n                          <ArrowUpTrayIcon />\n                          Export Orders\n                        </MenuItem>\n                      </MenuContent>\n                    </Menu>\n                  )}\n                </>\n              )}\n            </SidebarItem>\n\n            <SidebarItem tooltip=\"Products\">\n              {({ isCollapsed, isFocused }) => (\n                <>\n                  <SidebarLink href=\"#\">\n                    <CubeIcon />\n                    <SidebarLabel>Products</SidebarLabel>\n                  </SidebarLink>\n                  {(!isCollapsed || isFocused) && (\n                    <Menu>\n                      <SidebarMenuTrigger aria-label=\"Manage\">\n                        <EllipsisHorizontalIcon />\n                      </SidebarMenuTrigger>\n                      <MenuContent\n                        popover={{\n                          offset: 0,\n                          placement: 'right top',\n                        }}\n                      >\n                        <MenuItem href=\"#new-product\">\n                          <PlusIcon />\n                          Add New Product\n                        </MenuItem>\n                        <MenuItem href=\"#archive\">\n                          <ArchiveBoxIcon />\n                          Archive Product\n                        </MenuItem>\n                        <MenuItem href=\"#manage-categories\">\n                          <HashtagIcon />\n                          Manage Categories\n                        </MenuItem>\n                        <MenuItem href=\"#import\">\n                          <ArrowDownTrayIcon />\n                          Import Products\n                        </MenuItem>\n                        <MenuItem href=\"#export\">\n                          <ArrowUpTrayIcon />\n                          Export Products\n                        </MenuItem>\n                      </MenuContent>\n                    </Menu>\n                  )}\n                </>\n              )}\n            </SidebarItem>\n\n            <SidebarItem href=\"#\" tooltip=\"Payments\">\n              <CreditCardIcon />\n              <SidebarLabel>Payments</SidebarLabel>\n              <SidebarBadge>4 Pending</SidebarBadge>\n            </SidebarItem>\n          </SidebarSection>\n\n          <SidebarDisclosureGroup defaultExpandedKeys={[1]}>\n            <SidebarDisclosure id={1}>\n              <SidebarDisclosureTrigger>\n                <EllipsisHorizontalIcon />\n                <SidebarLabel>Support</SidebarLabel>\n              </SidebarDisclosureTrigger>\n              <SidebarDisclosurePanel>\n                <SidebarItem href=\"#\" tooltip=\"Tickets\">\n                  <TicketIcon />\n                  <SidebarLabel>Tickets</SidebarLabel>\n                </SidebarItem>\n                <SidebarItem href=\"#\" tooltip=\"Chat Support\">\n                  <ChatBubbleLeftRightIcon />\n                  <SidebarLabel>Chat Support</SidebarLabel>\n                </SidebarItem>\n                <SidebarItem href=\"#\" tooltip=\"FAQ\">\n                  <QuestionMarkCircleIcon />\n                  <SidebarLabel>FAQ</SidebarLabel>\n                </SidebarItem>\n                <SidebarItem href=\"#\" tooltip=\"Documentation\">\n                  <DocumentTextIcon />\n                  <SidebarLabel>Documentation</SidebarLabel>\n                </SidebarItem>\n              </SidebarDisclosurePanel>\n            </SidebarDisclosure>\n            <SidebarDisclosure id={2}>\n              <SidebarDisclosureTrigger>\n                <ArchiveBoxIcon />\n                <SidebarLabel>Inventory</SidebarLabel>\n              </SidebarDisclosureTrigger>\n              <SidebarDisclosurePanel>\n                <SidebarItem href=\"#\" tooltip=\"Warehouse\">\n                  <BuildingOfficeIcon />\n                  <SidebarLabel>Warehouse</SidebarLabel>\n                </SidebarItem>\n                <SidebarItem href=\"#\" tooltip=\"Stock Levels\">\n                  <SidebarLabel>Stock Levels</SidebarLabel>\n                  <SidebarBadge>12</SidebarBadge>\n                </SidebarItem>\n                <SidebarItem href=\"#\" tooltip=\"Shipping\">\n                  <SidebarLabel>Shipping</SidebarLabel>\n                  <SidebarBadge>3</SidebarBadge>\n                </SidebarItem>\n              </SidebarDisclosurePanel>\n            </SidebarDisclosure>\n          </SidebarDisclosureGroup>\n        </SidebarSectionGroup>\n      </SidebarContent>\n\n      <SidebarFooter className=\"flex flex-row justify-between gap-4 group-data-[state=collapsed]:flex-col\">\n        <Menu>\n          <MenuTrigger className=\"flex w-full items-center justify-between\" aria-label=\"Profile\">\n            <div className=\"flex items-center gap-x-2\">\n              <Avatar\n                className=\"size-8 *:size-8 group-data-[state=collapsed]:size-6 group-data-[state=collapsed]:*:size-6\"\n                isSquare\n                src=\"https://intentui.com/images/avatar/cobain.jpg\"\n              />\n              <div className=\"in-data-[collapsible=dock]:hidden text-sm\">\n                <SidebarLabel>Kurt Cobain</SidebarLabel>\n                <span className=\"-mt-0.5 block text-muted-fg\">@kurtcobain</span>\n              </div>\n            </div>\n            <ChevronUpDownIcon data-slot=\"chevron\" />\n          </MenuTrigger>\n          <MenuContent\n            className=\"in-data-[sidebar-collapsible=collapsed]:min-w-56 min-w-(--trigger-width)\"\n            placement=\"bottom right\"\n          >\n            <MenuSection>\n              <MenuHeader separator>\n                <span className=\"block\">Kurt Cobain</span>\n                <span className=\"font-normal text-muted-fg\">@cobain</span>\n              </MenuHeader>\n            </MenuSection>\n\n            <MenuItem href=\"#dashboard\">\n              <HomeIcon />\n              Dashboard\n            </MenuItem>\n            <MenuItem href=\"#settings\">\n              <Cog6ToothIcon />\n              Settings\n            </MenuItem>\n            <MenuItem href=\"#security\">\n              <ShieldCheckIcon />\n              Security\n            </MenuItem>\n            <MenuSeparator />\n            <MenuItem href=\"#contact\">\n              <LifebuoyIcon />\n              Customer Support\n            </MenuItem>\n            <MenuSeparator />\n            <MenuItem href=\"#logout\">\n              <ArrowRightStartOnRectangleIcon />\n              Log out\n            </MenuItem>\n          </MenuContent>\n        </Menu>\n      </SidebarFooter>\n      <SidebarRail />\n    </Sidebar>\n  )\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:block"
}