4e:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 4f:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 50:T84c,import { cookies } from "next/headers"; import type { Layout } from "react-resizable-panels"; import { AppSidebar } from "@/registry/blocks/sidebar-01/components/app-sidebar"; import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from "@/registry/ui/breadcrumb"; import { Separator } from "@/registry/ui/separator"; import { MainContent, SidebarProvider, SidebarTrigger, } from "@/registry/ui/sidebar"; const GROUP_ID = "main-layout-persistence"; export default async function Page() { const cookieStore = await cookies(); const layoutCookie = cookieStore.get(GROUP_ID); const defaultLayout: Layout = layoutCookie ? JSON.parse(layoutCookie.value) : undefined; return (

Dashboard Financial Performance

); } 51:Tc3a,"use client"; import { AudioWaveform, BookOpen, Bot, Command, Frame, GalleryVerticalEnd, MapIcon, PieChart, Settings2, SquareTerminal, } from "lucide-react"; import type * as React from "react"; import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarSeparator, } from "@/registry/ui/sidebar"; import { NavMain } from "./nav-main"; import { NavProjects } from "./nav-projects"; import { NavUser } from "./nav-user"; import { SearchCombobox } from "./search-combobox"; import { TeamSwitcher } from "./team-switcher"; // This is sample data. const data = { navMain: [ { icon: SquareTerminal, isActive: true, items: [ { title: "History", url: "#", }, { title: "Starred", url: "#", }, { title: "Settings", url: "#", }, ], title: "Playground", url: "#", }, { icon: Bot, items: [ { title: "Genesis", url: "#", }, { title: "Explorer", url: "#", }, { title: "Quantum", url: "#", }, ], title: "Models", url: "#", }, { icon: BookOpen, items: [ { title: "Introduction", url: "#", }, { title: "Get Started", url: "#", }, { title: "Tutorials", url: "#", }, { title: "Changelog", url: "#", }, ], title: "Documentation", url: "#", }, { icon: Settings2, items: [ { title: "General", url: "#", }, { title: "Team", url: "#", }, { title: "Billing", url: "#", }, { title: "Limits", url: "#", }, ], title: "Settings", url: "#", }, ], projects: [ { icon: Frame, name: "Design Engineering", url: "#", }, { icon: PieChart, name: "Sales & Marketing", url: "#", }, { icon: MapIcon, name: "Travel", url: "#", }, ], teams: [ { logo: GalleryVerticalEnd, name: "Acme Inc", plan: "Enterprise", }, { logo: AudioWaveform, name: "Acme Corp.", plan: "Startup", }, { logo: Command, name: "Evil Corp.", plan: "Free", }, ], user: { email: "m@example.com", name: "Lumi UI", }, }; export function AppSidebar({ ...props }: React.ComponentProps) { return ( ); } 52:T8ce,"use client"; import { ChevronRight, type LucideIcon } from "lucide-react"; import { Collapsible, CollapsiblePanel, CollapsibleTrigger, } from "@/registry/ui/collapsible"; import { SidebarGroup, SidebarMenu, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, } from "@/registry/ui/sidebar"; export function NavMain({ items, }: { items: { title: string; url: string; icon?: LucideIcon; isActive?: boolean; items?: { title: string; url: string; }[]; }[]; }) { return ( {items.map((item) => ( {item.icon && } {item.title} } /> {item.items?.map((subItem) => ( {subItem.title} } /> ))} ))} ); } 53:T15e3,"use client"; import { Folder, Forward, type LucideIcon, MoreHorizontal, Trash2, } from "lucide-react"; import { Button } from "@/registry/ui/button"; import { createDialogHandle, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from "@/registry/ui/dialog"; import { createDropdownMenuHandle, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuItem, DropdownMenuTrigger, } from "@/registry/ui/dropdown-menu"; import { SidebarGroup, SidebarGroupLabel, SidebarMenu, SidebarMenuAction, SidebarMenuButton, SidebarMenuItem, useSidebar, } from "@/registry/ui/sidebar"; import { toast } from "@/registry/ui/toast"; interface Project { name: string; url: string; icon: LucideIcon; } const projectMenuHandle = createDropdownMenuHandle(); const deleteProjectDialogHandle = createDialogHandle(); export function NavProjects({ projects }: { projects: Project[] }) { const { isMobile } = useSidebar(); return ( <> Projects {projects.map((item) => ( {item.name} } showOnHover > } > ))} {({ payload: project }) => { return ( {project?.name} View Project Share Project { if (project) { deleteProjectDialogHandle.openWithPayload(project); } }} variant={"destructive"} > Delete Project ); }} ); } 54:Tb5d,"use client"; import { BookIcon, ChevronsUpDown, HouseIcon, LogOut, PenIcon, Settings, SmileIcon, UserIcon, } from "lucide-react"; import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, } from "@/registry/ui/dropdown-menu"; import { SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar, } from "@/registry/ui/sidebar"; export function NavUser({ user, }: { user: { name: string; email: string; }; }) { const { isCollapsed } = useSidebar(); return ( {isCollapsed ? ( ) : ( <>

{user.name} {user.email}

)} } />

{user.name} {user.email}

Feedback Homepage Changelog Doc Log out ); } 55:T106e,"use client"; import { CpuIcon, EyeIcon, SearchIcon, Settings2Icon, SparklesIcon, TvMinimalIcon, UserIcon, } from "lucide-react"; import { useState } from "react"; import { cn } from "@/registry/lib/utils"; import { Button } from "@/registry/ui/button"; import { Combobox, ComboboxContent, ComboboxEmpty, ComboboxInputGroupContent, ComboboxItemContent, ComboboxList, ComboboxTrigger, } from "@/registry/ui/combobox"; import { Kbd } from "@/registry/ui/kbd"; import { Separator } from "@/registry/ui/separator"; import { SidebarMenuButton, useSidebar } from "@/registry/ui/sidebar"; export function SearchCombobox() { const [open, setOpen] = useState(false); const { isCollapsed } = useSidebar(); return ( Find.. } />

} inputSize="lg" placeholder="Find..." variant="ghost" />

No member found. {(member: TeamMember) => ( {IconMap[member.iconName]} {member.label} {member.description} } value={member} /> )} ); } interface TeamMember { id: string; value: string; description: string; label: string; iconName: IconName; } type IconName = keyof typeof IconMap; const IconMap = { cpu: , eye: , settings: , sparkles: , tv: , user: , } as const; const teamMembers: TeamMember[] = [ { description: "Run apps safely", iconName: "cpu", id: "1", label: "Sandboxes", value: "sandboxes", }, { description: "View usage", iconName: "eye", id: "2", label: "Observability", value: "observability", }, { description: "Explore AI models", iconName: "tv", id: "3", label: "AI Gateway", value: "ai-gateway", }, { description: "Build and Deployment", iconName: "settings", id: "4", label: "Build Machines", value: "build-machines", }, { description: "what did we deploy today?", iconName: "sparkles", id: "5", label: "Navigation Assistant", value: "navigation-assistant", }, ]; 56:T150f,"use client"; import { ChevronsUpDown, PlusIcon, UserSearch } from "lucide-react"; import { useState } from "react"; import { cn } from "@/registry/lib/utils"; import { Button } from "@/registry/ui/button"; import { Combobox, ComboboxContent, ComboboxEmpty, ComboboxInputGroupContent, ComboboxItemContent, ComboboxList, ComboboxTrigger, ComboboxValue, } from "@/registry/ui/combobox"; import { Field, FieldError, FieldLabel } from "@/registry/ui/field"; import { Form } from "@/registry/ui/form"; import { Input } from "@/registry/ui/input"; import { Kbd } from "@/registry/ui/kbd"; import { Separator } from "@/registry/ui/separator"; import { createSheetHandle, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, } from "@/registry/ui/sheet"; import { SidebarMenuButton, useSidebar } from "@/registry/ui/sidebar"; import { toast } from "@/registry/ui/toast"; const sheetHandle = createSheetHandle(); export function TeamSwitcher() { const [comboboxOpen, setComboboxOpen] = useState(false); const { isCollapsed } = useSidebar(); return ( <>

{isCollapsed ? ( ) : ( )} } />

No member found. {(member: TeamMember) => ( {member.label} )}

setComboboxOpen(false)} render={ } />

New Team Unlock collaboration and improved performance. ); } interface TeamMember { id: string; value: string; role: string; label: string; } const teamMembers: TeamMember[] = [ { id: "1", label: "Alex Davis", role: "Product", value: "alex.d" }, { id: "2", label: "Sarah King", role: "Engineering", value: "sarah.k" }, { id: "3", label: "James Wilson", role: "Design", value: "james.w" }, { id: "4", label: "Maria Garcia", role: "Marketing", value: "maria.g" }, { id: "5", label: "David Chen", role: "Engineering", value: "david.c" }, { id: "6", label: "Emma Roberts", role: "Product", value: "emma.r" }, ]; 4d:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L4e",null,{"namespace":"@lumiui","registryDependencies":["@lumi-ui/sidebar","@lumi-ui/separator","@lumi-ui/scroll-area","@lumi-ui/dropdown-menu","@lumi-ui/dialog","@lumi-ui/chart","@lumi-ui/tabs","@lumi-ui/input","@lumi-ui/sheet","@lumi-ui/form","@lumi-ui/field","@lumi-ui/button","@lumi-ui/combobox","@lumi-ui/collapsible","@lumi-ui/toggle-group","@lumi-ui/toast","@lumi-ui/card","@lumi-ui/breadcrumb","@lumi-ui/kbd"]}]]}],null]}],["$","$L4f",null,{"files":[{"path":"registry/blocks/sidebar-01/page.tsx","content":"$50","type":"registry:page","target":"app/dashboard/page.tsx"},{"path":"registry/blocks/sidebar-01/components/app-sidebar.tsx","content":"$51","type":"registry:component"},{"path":"registry/blocks/sidebar-01/components/nav-main.tsx","content":"$52","type":"registry:component"},{"path":"registry/blocks/sidebar-01/components/nav-projects.tsx","content":"$53","type":"registry:component"},{"path":"registry/blocks/sidebar-01/components/nav-user.tsx","content":"$54","type":"registry:component"},{"path":"registry/blocks/sidebar-01/components/search-combobox.tsx","content":"$55","type":"registry:component"},{"path":"registry/blocks/sidebar-01/components/team-switcher.tsx","content":"$56","type":"registry:component"}],"className":"h-[70svh] min-h-80"}]]}]