snapshot of https://github.com/shadcn-ui/ui.git (main, 2026-09-15; blobs > 131072B omitted)

apps/v4/registry/bases/aria/blocks/sidebar-10/components/team-switcher.tsx

@@ -0,0 +1,98 @@
+"use client"
+
+import * as React from "react"
+
+import {
+  DropdownMenu,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuTrigger,
+} from "@/registry/bases/aria/ui/dropdown-menu"
+import {
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+} from "@/registry/bases/aria/ui/sidebar"
+import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
+
+export function TeamSwitcher({
+  teams,
+}: {
+  teams: {
+    name: string
+    logo: React.ReactNode
+    plan: string
+  }[]
+}) {
+  const [activeTeam, setActiveTeam] = React.useState(teams[0])
+  if (!activeTeam) {
+    return null
+  }
+  return (
+    <SidebarMenu>
+      <SidebarMenuItem>
+        <DropdownMenuTrigger>
+          <SidebarMenuButton className="w-fit px-1.5">
+            <div className="flex aspect-square size-5 items-center justify-center rounded-md bg-sidebar-primary text-sidebar-primary-foreground">
+              {activeTeam.logo}
+            </div>
+            <span className="truncate font-medium">{activeTeam.name}</span>
+            <IconPlaceholder
+              lucide="ChevronDownIcon"
+              tabler="IconChevronDown"
+              hugeicons="ArrowDown01Icon"
+              phosphor="CaretDownIcon"
+              remixicon="RiArrowDownSLine"
+              className="opacity-50"
+            />
+          </SidebarMenuButton>
+          <DropdownMenu
+            className="w-64 rounded-lg"
+            placement="bottom start"
+            offset={4}
+          >
+            <DropdownMenuGroup>
+              <DropdownMenuLabel className="text-xs text-muted-foreground">
+                Teams
+              </DropdownMenuLabel>
+              {teams.map((team, index) => (
+                <DropdownMenuItem
+                  key={team.name}
+                  onAction={() => setActiveTeam(team)}
+                  className="gap-2 p-2"
+                >
+                  <div className="flex size-6 items-center justify-center rounded-xs border">
+                    {team.logo}
+                  </div>
+                  {team.name}
+                  <DropdownMenuShortcut>⌘{index + 1}</DropdownMenuShortcut>
+                </DropdownMenuItem>
+              ))}
+            </DropdownMenuGroup>
+            <DropdownMenuSeparator />
+            <DropdownMenuGroup>
+              <DropdownMenuItem className="gap-2 p-2">
+                <div className="flex size-6 items-center justify-center rounded-md border bg-background">
+                  <IconPlaceholder
+                    lucide="PlusIcon"
+                    tabler="IconPlus"
+                    hugeicons="PlusSignIcon"
+                    phosphor="PlusIcon"
+                    remixicon="RiAddLine"
+                    className="size-4"
+                  />
+                </div>
+                <div className="font-medium text-muted-foreground">
+                  Add team
+                </div>
+              </DropdownMenuItem>
+            </DropdownMenuGroup>
+          </DropdownMenu>
+        </DropdownMenuTrigger>
+      </SidebarMenuItem>
+    </SidebarMenu>
+  )
+}