@allbluecn/web-app 0.9.1 → 0.9.3

package/src/routes/_nav/apps/anyhub/$id/route.tsx

@@ -17,7 +17,7 @@
 
 import { createFileRoute } from '@tanstack/react-router'
 import { useTranslation } from 'react-i18next'
-import { PlaceholderPage } from '@/components/shared/placeholder-page'
+import { PlaceholderPage } from '@/components/shared-kit/pages/placeholder-page'
 import { PackageOpen } from 'lucide-react'
 
 export const Route = createFileRoute('/_nav/apps/anyhub/$id')({

package/src/routes/_nav/apps/anyhub/route.tsx

@@ -16,7 +16,7 @@
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 import { Outlet, createFileRoute, useMatches } from '@tanstack/react-router'
-import { PlaceholderPage } from '@/components/shared/placeholder-page'
+import { PlaceholderPage } from '@/components/shared-kit/pages/placeholder-page'
 import { Package } from 'lucide-react'
 
 export const Route = createFileRoute('/_nav/apps/anyhub')({

package/src/routes/_nav/bugs/route.tsx

@@ -16,7 +16,7 @@
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 import { createFileRoute } from '@tanstack/react-router'
-import { PlaceholderPage } from '@/components/shared/placeholder-page'
+import { PlaceholderPage } from '@/components/shared-kit/pages/placeholder-page'
 import { Bug } from 'lucide-react'
 
 export const Route = createFileRoute('/_nav/bugs')({

package/src/routes/_nav/dashboard/-components/avatar-group.tsx

@@ -15,7 +15,7 @@
 // You should have received a copy of the GNU Affero General Public License
 // along with this program. If not, see <https://www.gnu.org/licenses/>.
 
-import { UserAvatar } from '@/components/ui-shared'
+import { UserAvatar } from '@/components/shared-kit'
 import type { AvatarConfig, ShapeType } from '@allbluecn/kernel'
 
 interface TeamMember {

package/src/routes/_nav/dashboard/route.lazy.tsx

@@ -27,7 +27,7 @@ import LiquidEther from '@/components/react-bits/liquid-ether'
 import { LightRays as MagicuiLightRays } from '@/components/magicui/light-rays'
 import WebglLightRays from '@/components/react-bits/light-rays'
 import { AiChatPrompt } from '@/components/ai/ai-chat-prompt'
-import { ContributionGraphWithTooltip } from '@/components/shared/contribution-graph-tooltip'
+import { ContributionGraphWithTooltip } from '@/components/shared-kit/data-viz/contribution-graph-tooltip'
 import { PluginWidgets } from '@/components/plugin-slots/plugin-widgets'
 
 export const Route = createLazyFileRoute('/_nav/dashboard')({

package/src/routes/_nav/knowledge/$kbId/doc/$docId/route.lazy.tsx

@@ -18,7 +18,7 @@
 import { createLazyFileRoute } from '@tanstack/react-router'
 import { useTranslation } from 'react-i18next'
 import { FileText, Table } from 'lucide-react'
-import { PlaceholderPage } from '@/components/shared/placeholder-page'
+import { PlaceholderPage } from '@/components/shared-kit/pages/placeholder-page'
 import { KnowledgeDocEditor, DOC_EDITOR_WIDTH_VARS } from '@/components/knowledge/editor/knowledge-doc-editor'
 import { EDITOR_WIDTH_MAX_WIDTH, useEditorWidth } from '@/components/knowledge/editor/editor-width-context'
 

package/src/routes/_nav/knowledge/index.lazy.tsx

@@ -23,7 +23,7 @@ import { Button } from '@/components/ui/button'
 import { Card } from '@/components/ui/card'
 import { AnimatedGridPattern } from '@/components/magicui/animated-grid-pattern'
 import { BookOpenTextIcon } from '@/components/animated-icons/book-open-text'
-import { LucideIconByName } from '@/components/shared/lucide-icon-picker/lucide-icon-by-name'
+import { LucideIconByName } from '@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name'
 import { KnowledgeFormDialog } from '@/components/knowledge/dialog/knowledge-form-dialog'
 
 type KnowledgeList = ReturnType<typeof import('@/server/serverFns/knowledge')['listKnowledgeFn']> extends Promise<infer T> ? T : never

package/src/routes/_nav/notion-like/route.tsx

@@ -17,7 +17,7 @@
 
 import { createFileRoute } from '@tanstack/react-router'
 import { useTranslation } from 'react-i18next'
-import { PlaceholderPage } from '@/components/shared/placeholder-page'
+import { PlaceholderPage } from '@/components/shared-kit/pages/placeholder-page'
 import { FileText } from 'lucide-react'
 
 function NotionLikePage() {

package/src/routes/_nav/pricing-02/route.tsx

@@ -17,7 +17,7 @@
 
 import { createFileRoute } from '@tanstack/react-router'
 import { useTranslation } from 'react-i18next'
-import { PlaceholderPage } from '@/components/shared/placeholder-page'
+import { PlaceholderPage } from '@/components/shared-kit/pages/placeholder-page'
 import { CreditCard } from 'lucide-react'
 
 function PricingPage() {

package/src/routes/_nav/projects/$projectId/$storyId/route.lazy.tsx

@@ -20,7 +20,7 @@ import { useTranslation } from "react-i18next";
 import { ArrowLeft, ChevronRight } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Badge } from "@/components/ui/badge";
-import { LucideIconByName } from "@/components/shared/lucide-icon-picker/lucide-icon-by-name";
+import { LucideIconByName } from "@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name";
 import { PROJECT_MODULE_META } from "@/lib/project-module-meta";
 import type { ProjectModuleItem } from "@/types/project";
 

package/src/routes/_nav/projects/$projectId/index.lazy.tsx

@@ -19,12 +19,12 @@ import { createLazyFileRoute, Link, useLoaderData } from "@tanstack/react-router
 import { useTranslation } from "react-i18next";
 import { Settings, LayoutGrid, Activity as ActivityIcon, CalendarRange } from "lucide-react";
 import { useTheme } from "next-themes";
-import { UserAvatar } from "@/components/ui-shared";
+import { UserAvatar } from "@/components/shared-kit";
 import type { AvatarConfig, ShapeType } from "@allbluecn/kernel";
 import { Button } from "@/components/ui/button";
 import { AvatarGroup } from "@/components/magicui/components/animate/avatar-group";
 import { GlyphMatrix } from "@/components/magicui/glyph-matrix";
-import { LucideIconByName } from "@/components/shared/lucide-icon-picker/lucide-icon-by-name";
+import { LucideIconByName } from "@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name";
 import { ProjectModuleCard } from "@/components/project/project-module-card";
 import { ProjectActivityList } from "@/components/project/project-activity-list";
 import { PROJECT_MODULE_META, PROJECT_MODULE_KEYS } from "@/lib/project-module-meta";
@@ -32,7 +32,7 @@ import { useMemo } from "react";
 import { formatInTimeZone } from "date-fns-tz";
 import { subDays } from "date-fns";
 import { useTimezone } from "@/providers/timezone-provider";
-import { ContributionGraphWithTooltip } from "@/components/shared/contribution-graph-tooltip";
+import { ContributionGraphWithTooltip } from "@/components/shared-kit/data-viz/contribution-graph-tooltip";
 import type { Activity } from "@/components/kibo-ui/contribution-graph";
 
 // 将项目活动按日聚合成贡献度数据（最近 12 周，level 按单日最高值相对映射 0-4）

package/src/routes/_nav/projects/$projectId/iterations/index.lazy.tsx

@@ -20,7 +20,7 @@ import { createLazyFileRoute, Link, useLoaderData, useRouter } from "@tanstack/r
 import { useTranslation } from "react-i18next";
 import { CalendarRange, Plus, Settings } from "lucide-react";
 import { Button } from "@/components/ui/button";
-import { PlaceholderPage } from "@/components/shared/placeholder-page";
+import { PlaceholderPage } from "@/components/shared-kit/pages/placeholder-page";
 import { IterationCard } from "@/components/iteration/iteration-card";
 import { CreateIterationDialog } from "@/components/iteration/create-iteration-dialog";
 import { AutoScheduleDialog } from "@/components/iteration/auto-schedule-dialog";

package/src/routes/_nav/projects/$projectId/settings/route.lazy.tsx

@@ -28,14 +28,14 @@ import { Label } from "@/components/ui/label";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Checkbox } from "@/components/ui/checkbox";
 import { Badge } from "@/components/ui/badge";
-import { LucideIconPicker } from "@/components/shared/lucide-icon-picker";
+import { LucideIconPicker } from "@/components/shared-kit/icons/lucide-icon-picker";
 
-import { NameConfirmDialog } from "@/components/shared/name-confirm-dialog";
+import { NameConfirmDialog } from "@/components/shared-kit/dialogs/name-confirm-dialog";
 import { ProjectMemberManager } from "@/components/project/project-member-manager";
 import { extractDisplayId, validateDisplayId } from "@/lib/project-display-id";
 import { checkDisplayIdAvailableFn, updateProjectFn, deleteProjectFn, setProjectKbsFn } from "@/server/serverFns/project";
 import { useTimezone } from "@/providers/timezone-provider";
-import { TimezoneSelect } from "@/components/shared/timezone-select";
+import { TimezoneSelect } from "@/components/shared-kit/timezone/timezone-select";
 import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 
 function ProjectSettingsPage() {

package/src/routes/_nav/route.lazy.tsx

@@ -18,7 +18,7 @@
 import { createLazyFileRoute, Outlet } from '@tanstack/react-router'
 import Sidebar03 from '@/components/layout/sidebar-03'
 import { GlobalChatPanel } from '@/components/ai/global-chat-panel'
-import { TimezoneBootstrap } from '@/components/shared/timezone-bootstrap'
+import { TimezoneBootstrap } from '@/components/shared-kit/timezone/timezone-bootstrap'
 import { SubscriptionProvider } from '@/components/billing/subscription-provider'
 import { CommandPalette } from '@/components/command/command-palette'
 import type { Session } from '@/lib/auth/auth-client'

package/src/routes/_nav/settings/general/route.lazy.tsx

@@ -22,7 +22,7 @@ import { Globe, Languages, Loader2 } from 'lucide-react'
 import { toast } from '@/components/ui/sonner'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
 import { Button } from '@/components/ui/button'
-import { TimezoneSelect } from '@/components/shared/timezone-select'
+import { TimezoneSelect } from '@/components/shared-kit/timezone/timezone-select'
 import { updateUserTimezoneFn } from '@/server/serverFns/user/settings'
 import { LanguageSelector } from '@/components/settings/language-selector'
 import type { Session } from '@/lib/auth/auth-client'

package/src/routes/_nav/test-cases/route.tsx

@@ -17,7 +17,7 @@
 
 import { createFileRoute } from '@tanstack/react-router'
 import { useTranslation } from 'react-i18next'
-import { PlaceholderPage } from '@/components/shared/placeholder-page'
+import { PlaceholderPage } from '@/components/shared-kit/pages/placeholder-page'
 import { FlaskConical } from 'lucide-react'
 
 function TestCasesPage() {

package/src/routes/_nav/workspaces/$workspaceId/route.lazy.tsx

@@ -23,7 +23,7 @@ import { useTranslation } from "react-i18next";
 import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
 import { GlyphMatrix } from "@/components/magicui/glyph-matrix";
-import { LucideIconByName } from "@/components/shared/lucide-icon-picker/lucide-icon-by-name";
+import { LucideIconByName } from "@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name";
 import { CreateProjectDialog } from "@/components/project/create-project-dialog";
 
 type DetailData = ReturnType<typeof import("@/server/serverFns/workspace")["getWorkspaceDetailFn"]> extends Promise<infer T>

package/src/routes/_nav/workspaces/$workspaceId/settings/route.lazy.tsx

@@ -26,9 +26,9 @@ import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
 import { Label } from "@/components/ui/label";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
-import { LucideIconPicker } from "@/components/shared/lucide-icon-picker";
+import { LucideIconPicker } from "@/components/shared-kit/icons/lucide-icon-picker";
 
-import { NameConfirmDialog } from "@/components/shared/name-confirm-dialog";
+import { NameConfirmDialog } from "@/components/shared-kit/dialogs/name-confirm-dialog";
 import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 import {
   updateWorkspaceFn,

package/src/routes/_nav/workspaces/index.lazy.tsx

@@ -23,7 +23,7 @@ import { useTranslation } from "react-i18next";
 import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
 import { GlyphMatrix } from "@/components/magicui/glyph-matrix";
-import { LucideIconByName } from "@/components/shared/lucide-icon-picker/lucide-icon-by-name";
+import { LucideIconByName } from "@/components/shared-kit/icons/lucide-icon-picker/lucide-icon-by-name";
 import { CreateWorkspaceDialog } from "@/components/workspace/create-workspace-dialog";
 
 type WorkspaceList = ReturnType<typeof import("@/server/serverFns/workspace")["listWorkspacesFn"]> extends Promise<infer T> ? T : never;

package/src/routes/invite/$token/route.lazy.tsx

@@ -21,7 +21,7 @@ import { useMutation } from '@tanstack/react-query'
 import { useTranslation } from 'react-i18next'
 import { toast } from '@/components/ui/sonner'
 import { RainbowButton } from '@/components/magicui/rainbow-button'
-import { UserAvatar } from '@/components/ui-shared'
+import { UserAvatar } from '@/components/shared-kit'
 import { AuthLayout, AuthLayoutLeft, AuthLayoutRight } from '@/components/auth/auth-layout'
 import { AuthBrandPanel } from '@/components/auth/auth-brand-panel'
 import { IconInput } from '@/components/auth/icon-input'

package/src/server/__tests__/agent-client-graph.test.ts

@@ -30,7 +30,7 @@ const CLIENT_SAFE_SPECIFIERS = new Set([
   'date-fns/locale',
   '@allbluecn/kernel',
   '@allbluecn/kernel',
-  '@/components/ui-shared',
+  '@/components/shared-kit',
   '@/lib/desktop-detect',
   '@/server/ai-gateway/tools',
   '@allbluecn/kernel',

package/src/components/shared/name-confirm-dialog.tsx

@@ -1 +0,0 @@
-export * from '@/components/ui-shared/name-confirm-dialog'

package/src/components/shared/nav-float-button.tsx

@@ -1 +0,0 @@
-export * from '@/components/ui-shared/nav-float-button'

package/src/components/shared/placeholder-page.tsx

@@ -1 +0,0 @@
-export * from '@/components/ui-shared/placeholder-page'

package/src/components/ui-shared/alert-dialog.tsx

@@ -1,216 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-"use client"
-
-import * as React from "react"
-import { AlertDialog as AlertDialogPrimitive } from "radix-ui"
-
-import { cn } from "./utils"
-import { Button } from "./button"
-
-function AlertDialog({
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {
-  return <AlertDialogPrimitive.Root data-slot="alert-dialog" {...props} />
-}
-
-function AlertDialogTrigger({
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {
-  return (
-    <AlertDialogPrimitive.Trigger data-slot="alert-dialog-trigger" {...props} />
-  )
-}
-
-function AlertDialogPortal({
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {
-  return (
-    <AlertDialogPrimitive.Portal data-slot="alert-dialog-portal" {...props} />
-  )
-}
-
-function AlertDialogOverlay({
-  className,
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {
-  return (
-    <AlertDialogPrimitive.Overlay
-      data-slot="alert-dialog-overlay"
-      className={cn(
-        "fixed inset-0 z-50 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AlertDialogContent({
-  className,
-  size = "default",
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {
-  size?: "default" | "sm"
-}) {
-  return (
-    <AlertDialogPortal>
-      <AlertDialogOverlay />
-      <AlertDialogPrimitive.Content
-        data-slot="alert-dialog-content"
-        data-size={size}
-        className={cn(
-          "group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-4 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
-          className
-        )}
-        {...props}
-      />
-    </AlertDialogPortal>
-  )
-}
-
-function AlertDialogHeader({
-  className,
-  ...props
-}: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="alert-dialog-header"
-      className={cn(
-        "grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AlertDialogFooter({
-  className,
-  ...props
-}: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="alert-dialog-footer"
-      className={cn(
-        "-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AlertDialogMedia({
-  className,
-  ...props
-}: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="alert-dialog-media"
-      className={cn(
-        "mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AlertDialogTitle({
-  className,
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {
-  return (
-    <AlertDialogPrimitive.Title
-      data-slot="alert-dialog-title"
-      className={cn(
-        "text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AlertDialogDescription({
-  className,
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {
-  return (
-    <AlertDialogPrimitive.Description
-      data-slot="alert-dialog-description"
-      className={cn(
-        "text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AlertDialogAction({
-  className,
-  variant = "default",
-  size = "default",
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Action> &
-  Pick<React.ComponentProps<typeof Button>, "variant" | "size">) {
-  return (
-    <Button variant={variant} size={size} asChild>
-      <AlertDialogPrimitive.Action
-        data-slot="alert-dialog-action"
-        className={cn(className)}
-        {...props}
-      />
-    </Button>
-  )
-}
-
-function AlertDialogCancel({
-  className,
-  variant = "outline",
-  size = "default",
-  ...props
-}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel> &
-  Pick<React.ComponentProps<typeof Button>, "variant" | "size">) {
-  return (
-    <Button variant={variant} size={size} asChild>
-      <AlertDialogPrimitive.Cancel
-        data-slot="alert-dialog-cancel"
-        className={cn(className)}
-        {...props}
-      />
-    </Button>
-  )
-}
-
-export {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogMedia,
-  AlertDialogOverlay,
-  AlertDialogPortal,
-  AlertDialogTitle,
-  AlertDialogTrigger,
-}

package/src/components/ui-shared/avatar.tsx

@@ -1,129 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-//
-// This program is free software: you can redistribute it and/or modify
-// it under the terms of the GNU Affero General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// This program is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU Affero General Public License for more details.
-//
-// You should have received a copy of the GNU Affero General Public License
-// along with this program. If not, see <https://www.gnu.org/licenses/>.
-
-"use client"
-
-import * as React from "react"
-import { Avatar as AvatarPrimitive } from "radix-ui"
-
-import { cn } from "./utils"
-
-function Avatar({
-  className,
-  size = "default",
-  ...props
-}: React.ComponentProps<typeof AvatarPrimitive.Root> & {
-  size?: "default" | "sm" | "lg"
-}) {
-  return (
-    <AvatarPrimitive.Root
-      data-slot="avatar"
-      data-size={size}
-      className={cn(
-        "group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AvatarImage({
-  className,
-  ...props
-}: React.ComponentProps<typeof AvatarPrimitive.Image>) {
-  return (
-    <AvatarPrimitive.Image
-      data-slot="avatar-image"
-      className={cn(
-        "aspect-square size-full rounded-full object-cover",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AvatarFallback({
-  className,
-  ...props
-}: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {
-  return (
-    <AvatarPrimitive.Fallback
-      data-slot="avatar-fallback"
-      className={cn(
-        "flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AvatarBadge({ className, ...props }: React.ComponentProps<"span">) {
-  return (
-    <span
-      data-slot="avatar-badge"
-      className={cn(
-        "absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground bg-blend-color ring-2 ring-background select-none",
-        "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden",
-        "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2",
-        "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AvatarGroup({ className, ...props }: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="avatar-group"
-      className={cn(
-        "group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function AvatarGroupCount({
-  className,
-  ...props
-}: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="avatar-group-count"
-      className={cn(
-        "relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-export {
-  Avatar,
-  AvatarImage,
-  AvatarFallback,
-  AvatarGroup,
-  AvatarGroupCount,
-  AvatarBadge,
-}