shadimage

Sidebar 01 - Admin Dashboard Sidebar

A collapsible sidebar navigation with grouped menus, icons, and upgrade CTA, perfect for admin dashboards to organize pages, widgets, and apps while keeping workflows fast and intuitive.

src/components/shadcn-space/blocks/sidebar-01/page.tsx

import { SidebarProvider, SidebarTrigger } from "@/components/ui/sidebar";
import { AppSidebar } from "@/components/shadcn-space/blocks/sidebar-01/app-sidebar";

const Page = () => {
  return (
    <SidebarProvider>
      <AppSidebar />
      {/* ---------------- Main ---------------- */}
      <div className="flex flex-1 flex-col">
        <header className="sticky top-0 z-50 flex h-14 items-center border-b px-4">
          <SidebarTrigger className="cursor-pointer"/>
        </header>
        <main className="flex-1 p-4" />
      </div>
    </SidebarProvider>
  );
};

export default Page;

Where it goes
ctasidebardashboard-shellkanban
Interaction
accordiondropdown
Use cases
dashboard

DependenciesBundle weight · light

icons
lucide-react