{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "extends": "none",
  "name": "sidebar-16",
  "title": "sidebar-16",
  "description": "sidebar-16",
  "registryDependencies": [
    "https://intentui.com/r/avatar",
    "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-16/page.tsx",
      "content": "export default function Page() {\n  return <div>Tooltip</div>\n}\n",
      "type": "registry:page",
      "target": "app/sidebar-16/page.tsx"
    },
    {
      "path": "registry/blocks/sidebar-16/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-16/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"
}