@atxp/design-system 0.1.3 → 0.2.1

package/dist/index.d.cts

@@ -140,6 +140,54 @@ declare const Avatar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLD
 declare const AvatarImage: React.ForwardRefExoticComponent<React.ImgHTMLAttributes<HTMLImageElement> & React.RefAttributes<HTMLImageElement>>;
 declare const AvatarFallback: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 
+/**
+ * AvatarGroup Component
+ *
+ * Displays multiple user avatars in an overlapping group.
+ * Each avatar shows with a border for visual separation.
+ * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=5069-7627
+ *
+ * @example
+ * ```tsx
+ * <AvatarGroup>
+ *   <AvatarGroupItem fallback="L" className="bg-orange-100" />
+ *   <AvatarGroupItem fallback="B" className="bg-green-100" />
+ *   <AvatarGroupItem fallback="R" className="bg-pink-100" />
+ * </AvatarGroup>
+ * ```
+ */
+declare const avatarGroupVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | null | undefined;
+    spacing?: "default" | "tight" | "loose" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof avatarGroupVariants> {
+}
+declare const AvatarGroup: React.ForwardRefExoticComponent<AvatarGroupProps & React.RefAttributes<HTMLDivElement>>;
+interface AvatarGroupItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+    /**
+     * URL of the avatar image
+     */
+    src?: string;
+    /**
+     * Alt text for the avatar image
+     */
+    alt?: string;
+    /**
+     * Fallback text (usually initials)
+     */
+    fallback: string;
+    /**
+     * Whether to show a presence indicator (green dot)
+     */
+    showPresence?: boolean;
+    /**
+     * Classes for the fallback background/text (e.g., bg-indigo-500 text-white)
+     * Defaults to bg-muted text-foreground if not provided
+     */
+    fallbackClassName?: string;
+}
+declare const AvatarGroupItem: React.ForwardRefExoticComponent<AvatarGroupItemProps & React.RefAttributes<HTMLDivElement>>;
+
 /**
  * Badge variants using class-variance-authority
  * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=620:965
@@ -219,7 +267,7 @@ declare const BreadcrumbEllipsis: {
  */
 declare const buttonVariants: (props?: ({
     variant?: "link" | "default" | "destructive" | "secondary" | "outline" | "success" | "destructive-subtle" | "secondary-outline" | "ghost" | "side-panel" | null | undefined;
-    size?: "default" | "sm" | "icon" | "lg" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;
@@ -407,6 +455,57 @@ declare const DrawerTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<
 declare const DrawerDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const DrawerFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 
+/**
+ * DropdownMenu Component
+ *
+ * Displays a menu to the user — such as a set of actions or functions — triggered by a button.
+ * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=5070-8203
+ *
+ * @see https://ui.shadcn.com/docs/components/dropdown-menu
+ *
+ * @example
+ * ```tsx
+ * <DropdownMenu>
+ *   <DropdownMenuLabel>Add participants</DropdownMenuLabel>
+ *   <DropdownMenuItem>Group</DropdownMenuItem>
+ *   <DropdownMenuItem>Team member</DropdownMenuItem>
+ * </DropdownMenu>
+ * ```
+ */
+type DropdownMenuProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps & React.RefAttributes<HTMLDivElement>>;
+declare const dropdownMenuItemVariants: (props?: ({
+    variant?: "default" | "active" | null | undefined;
+    disabled?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface DropdownMenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'disabled'>, VariantProps<typeof dropdownMenuItemVariants> {
+    /**
+     * Optional icon to display on the left
+     */
+    icon?: LucideIcon;
+    /**
+     * Optional secondary icon to display on the right
+     */
+    secondaryIcon?: LucideIcon | 'check' | 'plus' | 'chevron';
+    /**
+     * Whether to show a checkmark (shorthand for secondaryIcon="check")
+     */
+    checked?: boolean;
+    /**
+     * Whether this item has a submenu (shorthand for secondaryIcon="chevron")
+     */
+    hasSubmenu?: boolean;
+    /**
+     * Optional avatar element to display instead of icon
+     */
+    avatar?: React.ReactNode;
+}
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<DropdownMenuItemProps & React.RefAttributes<HTMLButtonElement>>;
+type DropdownMenuLabelProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>>;
+type DropdownMenuSeparatorProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+
 /**
  * Header Component
  *
@@ -645,6 +744,42 @@ declare const MenubarSeparator: React.ForwardRefExoticComponent<MenubarSeparator
 type MenubarLabelProps = React.HTMLAttributes<HTMLDivElement>;
 declare const MenubarLabel: React.ForwardRefExoticComponent<MenubarLabelProps & React.RefAttributes<HTMLDivElement>>;
 
+/**
+ * ModelUserManagement Component
+ *
+ * A compound component for managing model selection and user participants.
+ * Combines model selector button with user management controls including
+ * add user button, avatar display, and user dropdown.
+ * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=5070-8794
+ *
+ * @example
+ * ```tsx
+ * <ModelUserManagement>
+ *   <ModelSelector>Claude Sonnet 4.5</ModelSelector>
+ *   <UserManagementGroup>
+ *     <AddUserButton />
+ *     <UserAvatars>
+ *       <AvatarGroupItem fallback="L" className="bg-orange-100" />
+ *       <AvatarGroupItem fallback="B" className="bg-green-100" />
+ *       <UserDropdownTrigger />
+ *     </UserAvatars>
+ *   </UserManagementGroup>
+ * </ModelUserManagement>
+ * ```
+ */
+type ModelUserManagementProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ModelUserManagement: React.ForwardRefExoticComponent<ModelUserManagementProps & React.RefAttributes<HTMLDivElement>>;
+type ModelSelectorProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+declare const ModelSelector: React.ForwardRefExoticComponent<ModelSelectorProps & React.RefAttributes<HTMLButtonElement>>;
+type UserManagementGroupProps = React.HTMLAttributes<HTMLDivElement>;
+declare const UserManagementGroup: React.ForwardRefExoticComponent<UserManagementGroupProps & React.RefAttributes<HTMLDivElement>>;
+type AddUserButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+declare const AddUserButton: React.ForwardRefExoticComponent<AddUserButtonProps & React.RefAttributes<HTMLButtonElement>>;
+type UserAvatarsProps = React.HTMLAttributes<HTMLDivElement>;
+declare const UserAvatars: React.ForwardRefExoticComponent<UserAvatarsProps & React.RefAttributes<HTMLDivElement>>;
+type UserDropdownTriggerProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+declare const UserDropdownTrigger: React.ForwardRefExoticComponent<UserDropdownTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+
 /**
  * NavHeader Component
  *
@@ -1159,9 +1294,29 @@ interface ToggleProps extends React.ComponentPropsWithoutRef<typeof TogglePrimit
 }
 declare const Toggle: React.ForwardRefExoticComponent<ToggleProps & React.RefAttributes<HTMLButtonElement>>;
 
+/**
+ * Tooltip Component
+ *
+ * A popup that displays information related to an element when the element
+ * receives keyboard focus or the mouse hovers over it.
+ * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=2688-451
+ *
+ * @see https://ui.shadcn.com/docs/components/tooltip
+ *
+ * @example
+ * ```tsx
+ * <Tooltip>
+ *   Chat participants
+ * </Tooltip>
+ * ```
+ */
+type TooltipProps = React.HTMLAttributes<HTMLDivElement>;
+declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
+
 /**
  * Utility function to merge class names
- * Combines clsx for conditional classes
+ * Combines clsx for conditional classes with tailwind-merge
+ * to properly handle conflicting Tailwind classes
  */
 declare function cn(...inputs: ClassValue[]): string;
 
@@ -1237,4 +1392,4 @@ declare function ThemeProvider({ children, defaultTheme, storageKey, enablePersi
  */
 declare function useTheme(): ThemeContextValue;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, type CheckboxProps, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, type DialogProps, DialogTitle, Drawer, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, type DrawerProps, DrawerTitle, Header, HeaderActions, HeaderBreadcrumbs, HeaderContent, HeaderDescription, HeaderTitle, HoverCard, HoverCardDescription, type HoverCardDescriptionProps, HoverCardHeader, type HoverCardHeaderProps, type HoverCardProps, HoverCardTitle, type HoverCardTitleProps, Icon, IndicatorCircle, type IndicatorCircleProps, IndicatorDot, type IndicatorDotProps, Input, InputGroup, InputGroupHelpText, type InputGroupHelpTextProps, InputGroupLabel, type InputGroupLabelProps, type InputGroupProps, type InputProps, Label, type LabelProps, Menubar, MenubarDropdown, type MenubarDropdownProps, MenubarItem, type MenubarItemProps, MenubarLabel, type MenubarLabelProps, type MenubarProps, MenubarSeparator, type MenubarSeparatorProps, MenubarTrigger, type MenubarTriggerProps, NavHeader, NavHeaderBrand, type NavHeaderBrandProps, NavHeaderDivider, type NavHeaderDividerProps, NavHeaderItem, type NavHeaderItemProps, NavHeaderNav, type NavHeaderNavProps, type NavHeaderProps, NavSidePanel, NavSidePanelBrand, type NavSidePanelBrandProps, NavSidePanelFooter, type NavSidePanelFooterProps, NavSidePanelHeader, type NavSidePanelHeaderProps, NavSidePanelItem, type NavSidePanelItemProps, NavSidePanelNav, type NavSidePanelNavProps, type NavSidePanelProps, NavSidePanelSeparator, type NavSidePanelSeparatorProps, Pagination, PaginationEllipsis, type PaginationEllipsisProps, PaginationItem, type PaginationItemProps, PaginationLink, type PaginationLinkProps, type PaginationProps, Popover, PopoverDescription, type PopoverDescriptionProps, PopoverHeader, type PopoverHeaderProps, type PopoverProps, PopoverTitle, type PopoverTitleProps, Progress, type ProgressProps, Radio, type RadioProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, type SheetProps, SheetTitle, Skeleton, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, type Theme, ThemeProvider, type ThemeProviderProps, Toaster as Toast, Toggle, type ToggleProps, badgeVariants, buttonVariants, cn, indicatorCircleVariants, indicatorDotVariants, menubarItemVariants, menubarTriggerVariants, navHeaderItemVariants, navSidePanelItemVariants, paginationItemVariants, toggleVariants, useTheme };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AddUserButton, type AddUserButtonProps, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertTitle, Avatar, AvatarFallback, AvatarGroup, AvatarGroupItem, type AvatarGroupItemProps, type AvatarGroupProps, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, type CheckboxProps, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, type DialogProps, DialogTitle, Drawer, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, type DrawerProps, DrawerTitle, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, type DropdownMenuProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, Header, HeaderActions, HeaderBreadcrumbs, HeaderContent, HeaderDescription, HeaderTitle, HoverCard, HoverCardDescription, type HoverCardDescriptionProps, HoverCardHeader, type HoverCardHeaderProps, type HoverCardProps, HoverCardTitle, type HoverCardTitleProps, Icon, IndicatorCircle, type IndicatorCircleProps, IndicatorDot, type IndicatorDotProps, Input, InputGroup, InputGroupHelpText, type InputGroupHelpTextProps, InputGroupLabel, type InputGroupLabelProps, type InputGroupProps, type InputProps, Label, type LabelProps, Menubar, MenubarDropdown, type MenubarDropdownProps, MenubarItem, type MenubarItemProps, MenubarLabel, type MenubarLabelProps, type MenubarProps, MenubarSeparator, type MenubarSeparatorProps, MenubarTrigger, type MenubarTriggerProps, ModelSelector, type ModelSelectorProps, ModelUserManagement, type ModelUserManagementProps, NavHeader, NavHeaderBrand, type NavHeaderBrandProps, NavHeaderDivider, type NavHeaderDividerProps, NavHeaderItem, type NavHeaderItemProps, NavHeaderNav, type NavHeaderNavProps, type NavHeaderProps, NavSidePanel, NavSidePanelBrand, type NavSidePanelBrandProps, NavSidePanelFooter, type NavSidePanelFooterProps, NavSidePanelHeader, type NavSidePanelHeaderProps, NavSidePanelItem, type NavSidePanelItemProps, NavSidePanelNav, type NavSidePanelNavProps, type NavSidePanelProps, NavSidePanelSeparator, type NavSidePanelSeparatorProps, Pagination, PaginationEllipsis, type PaginationEllipsisProps, PaginationItem, type PaginationItemProps, PaginationLink, type PaginationLinkProps, type PaginationProps, Popover, PopoverDescription, type PopoverDescriptionProps, PopoverHeader, type PopoverHeaderProps, type PopoverProps, PopoverTitle, type PopoverTitleProps, Progress, type ProgressProps, Radio, type RadioProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, type SheetProps, SheetTitle, Skeleton, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, type Theme, ThemeProvider, type ThemeProviderProps, Toaster as Toast, Toggle, type ToggleProps, Tooltip, type TooltipProps, UserAvatars, type UserAvatarsProps, UserDropdownTrigger, type UserDropdownTriggerProps, UserManagementGroup, type UserManagementGroupProps, avatarGroupVariants, badgeVariants, buttonVariants, cn, dropdownMenuItemVariants, indicatorCircleVariants, indicatorDotVariants, menubarItemVariants, menubarTriggerVariants, navHeaderItemVariants, navSidePanelItemVariants, paginationItemVariants, toggleVariants, useTheme };

package/dist/index.d.ts

@@ -140,6 +140,54 @@ declare const Avatar: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLD
 declare const AvatarImage: React.ForwardRefExoticComponent<React.ImgHTMLAttributes<HTMLImageElement> & React.RefAttributes<HTMLImageElement>>;
 declare const AvatarFallback: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 
+/**
+ * AvatarGroup Component
+ *
+ * Displays multiple user avatars in an overlapping group.
+ * Each avatar shows with a border for visual separation.
+ * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=5069-7627
+ *
+ * @example
+ * ```tsx
+ * <AvatarGroup>
+ *   <AvatarGroupItem fallback="L" className="bg-orange-100" />
+ *   <AvatarGroupItem fallback="B" className="bg-green-100" />
+ *   <AvatarGroupItem fallback="R" className="bg-pink-100" />
+ * </AvatarGroup>
+ * ```
+ */
+declare const avatarGroupVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | null | undefined;
+    spacing?: "default" | "tight" | "loose" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof avatarGroupVariants> {
+}
+declare const AvatarGroup: React.ForwardRefExoticComponent<AvatarGroupProps & React.RefAttributes<HTMLDivElement>>;
+interface AvatarGroupItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+    /**
+     * URL of the avatar image
+     */
+    src?: string;
+    /**
+     * Alt text for the avatar image
+     */
+    alt?: string;
+    /**
+     * Fallback text (usually initials)
+     */
+    fallback: string;
+    /**
+     * Whether to show a presence indicator (green dot)
+     */
+    showPresence?: boolean;
+    /**
+     * Classes for the fallback background/text (e.g., bg-indigo-500 text-white)
+     * Defaults to bg-muted text-foreground if not provided
+     */
+    fallbackClassName?: string;
+}
+declare const AvatarGroupItem: React.ForwardRefExoticComponent<AvatarGroupItemProps & React.RefAttributes<HTMLDivElement>>;
+
 /**
  * Badge variants using class-variance-authority
  * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=620:965
@@ -219,7 +267,7 @@ declare const BreadcrumbEllipsis: {
  */
 declare const buttonVariants: (props?: ({
     variant?: "link" | "default" | "destructive" | "secondary" | "outline" | "success" | "destructive-subtle" | "secondary-outline" | "ghost" | "side-panel" | null | undefined;
-    size?: "default" | "sm" | "icon" | "lg" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;
@@ -407,6 +455,57 @@ declare const DrawerTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<
 declare const DrawerDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const DrawerFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 
+/**
+ * DropdownMenu Component
+ *
+ * Displays a menu to the user — such as a set of actions or functions — triggered by a button.
+ * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=5070-8203
+ *
+ * @see https://ui.shadcn.com/docs/components/dropdown-menu
+ *
+ * @example
+ * ```tsx
+ * <DropdownMenu>
+ *   <DropdownMenuLabel>Add participants</DropdownMenuLabel>
+ *   <DropdownMenuItem>Group</DropdownMenuItem>
+ *   <DropdownMenuItem>Team member</DropdownMenuItem>
+ * </DropdownMenu>
+ * ```
+ */
+type DropdownMenuProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps & React.RefAttributes<HTMLDivElement>>;
+declare const dropdownMenuItemVariants: (props?: ({
+    variant?: "default" | "active" | null | undefined;
+    disabled?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface DropdownMenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'disabled'>, VariantProps<typeof dropdownMenuItemVariants> {
+    /**
+     * Optional icon to display on the left
+     */
+    icon?: LucideIcon;
+    /**
+     * Optional secondary icon to display on the right
+     */
+    secondaryIcon?: LucideIcon | 'check' | 'plus' | 'chevron';
+    /**
+     * Whether to show a checkmark (shorthand for secondaryIcon="check")
+     */
+    checked?: boolean;
+    /**
+     * Whether this item has a submenu (shorthand for secondaryIcon="chevron")
+     */
+    hasSubmenu?: boolean;
+    /**
+     * Optional avatar element to display instead of icon
+     */
+    avatar?: React.ReactNode;
+}
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<DropdownMenuItemProps & React.RefAttributes<HTMLButtonElement>>;
+type DropdownMenuLabelProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>>;
+type DropdownMenuSeparatorProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
+
 /**
  * Header Component
  *
@@ -645,6 +744,42 @@ declare const MenubarSeparator: React.ForwardRefExoticComponent<MenubarSeparator
 type MenubarLabelProps = React.HTMLAttributes<HTMLDivElement>;
 declare const MenubarLabel: React.ForwardRefExoticComponent<MenubarLabelProps & React.RefAttributes<HTMLDivElement>>;
 
+/**
+ * ModelUserManagement Component
+ *
+ * A compound component for managing model selection and user participants.
+ * Combines model selector button with user management controls including
+ * add user button, avatar display, and user dropdown.
+ * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=5070-8794
+ *
+ * @example
+ * ```tsx
+ * <ModelUserManagement>
+ *   <ModelSelector>Claude Sonnet 4.5</ModelSelector>
+ *   <UserManagementGroup>
+ *     <AddUserButton />
+ *     <UserAvatars>
+ *       <AvatarGroupItem fallback="L" className="bg-orange-100" />
+ *       <AvatarGroupItem fallback="B" className="bg-green-100" />
+ *       <UserDropdownTrigger />
+ *     </UserAvatars>
+ *   </UserManagementGroup>
+ * </ModelUserManagement>
+ * ```
+ */
+type ModelUserManagementProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ModelUserManagement: React.ForwardRefExoticComponent<ModelUserManagementProps & React.RefAttributes<HTMLDivElement>>;
+type ModelSelectorProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+declare const ModelSelector: React.ForwardRefExoticComponent<ModelSelectorProps & React.RefAttributes<HTMLButtonElement>>;
+type UserManagementGroupProps = React.HTMLAttributes<HTMLDivElement>;
+declare const UserManagementGroup: React.ForwardRefExoticComponent<UserManagementGroupProps & React.RefAttributes<HTMLDivElement>>;
+type AddUserButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+declare const AddUserButton: React.ForwardRefExoticComponent<AddUserButtonProps & React.RefAttributes<HTMLButtonElement>>;
+type UserAvatarsProps = React.HTMLAttributes<HTMLDivElement>;
+declare const UserAvatars: React.ForwardRefExoticComponent<UserAvatarsProps & React.RefAttributes<HTMLDivElement>>;
+type UserDropdownTriggerProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
+declare const UserDropdownTrigger: React.ForwardRefExoticComponent<UserDropdownTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+
 /**
  * NavHeader Component
  *
@@ -1159,9 +1294,29 @@ interface ToggleProps extends React.ComponentPropsWithoutRef<typeof TogglePrimit
 }
 declare const Toggle: React.ForwardRefExoticComponent<ToggleProps & React.RefAttributes<HTMLButtonElement>>;
 
+/**
+ * Tooltip Component
+ *
+ * A popup that displays information related to an element when the element
+ * receives keyboard focus or the mouse hovers over it.
+ * Based on Figma component: https://www.figma.com/design/nadcKNlrnZUHbbLwm9GdK4?node-id=2688-451
+ *
+ * @see https://ui.shadcn.com/docs/components/tooltip
+ *
+ * @example
+ * ```tsx
+ * <Tooltip>
+ *   Chat participants
+ * </Tooltip>
+ * ```
+ */
+type TooltipProps = React.HTMLAttributes<HTMLDivElement>;
+declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
+
 /**
  * Utility function to merge class names
- * Combines clsx for conditional classes
+ * Combines clsx for conditional classes with tailwind-merge
+ * to properly handle conflicting Tailwind classes
  */
 declare function cn(...inputs: ClassValue[]): string;
 
@@ -1237,4 +1392,4 @@ declare function ThemeProvider({ children, defaultTheme, storageKey, enablePersi
  */
 declare function useTheme(): ThemeContextValue;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, type CheckboxProps, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, type DialogProps, DialogTitle, Drawer, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, type DrawerProps, DrawerTitle, Header, HeaderActions, HeaderBreadcrumbs, HeaderContent, HeaderDescription, HeaderTitle, HoverCard, HoverCardDescription, type HoverCardDescriptionProps, HoverCardHeader, type HoverCardHeaderProps, type HoverCardProps, HoverCardTitle, type HoverCardTitleProps, Icon, IndicatorCircle, type IndicatorCircleProps, IndicatorDot, type IndicatorDotProps, Input, InputGroup, InputGroupHelpText, type InputGroupHelpTextProps, InputGroupLabel, type InputGroupLabelProps, type InputGroupProps, type InputProps, Label, type LabelProps, Menubar, MenubarDropdown, type MenubarDropdownProps, MenubarItem, type MenubarItemProps, MenubarLabel, type MenubarLabelProps, type MenubarProps, MenubarSeparator, type MenubarSeparatorProps, MenubarTrigger, type MenubarTriggerProps, NavHeader, NavHeaderBrand, type NavHeaderBrandProps, NavHeaderDivider, type NavHeaderDividerProps, NavHeaderItem, type NavHeaderItemProps, NavHeaderNav, type NavHeaderNavProps, type NavHeaderProps, NavSidePanel, NavSidePanelBrand, type NavSidePanelBrandProps, NavSidePanelFooter, type NavSidePanelFooterProps, NavSidePanelHeader, type NavSidePanelHeaderProps, NavSidePanelItem, type NavSidePanelItemProps, NavSidePanelNav, type NavSidePanelNavProps, type NavSidePanelProps, NavSidePanelSeparator, type NavSidePanelSeparatorProps, Pagination, PaginationEllipsis, type PaginationEllipsisProps, PaginationItem, type PaginationItemProps, PaginationLink, type PaginationLinkProps, type PaginationProps, Popover, PopoverDescription, type PopoverDescriptionProps, PopoverHeader, type PopoverHeaderProps, type PopoverProps, PopoverTitle, type PopoverTitleProps, Progress, type ProgressProps, Radio, type RadioProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, type SheetProps, SheetTitle, Skeleton, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, type Theme, ThemeProvider, type ThemeProviderProps, Toaster as Toast, Toggle, type ToggleProps, badgeVariants, buttonVariants, cn, indicatorCircleVariants, indicatorDotVariants, menubarItemVariants, menubarTriggerVariants, navHeaderItemVariants, navSidePanelItemVariants, paginationItemVariants, toggleVariants, useTheme };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AddUserButton, type AddUserButtonProps, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertTitle, Avatar, AvatarFallback, AvatarGroup, AvatarGroupItem, type AvatarGroupItemProps, type AvatarGroupProps, AvatarImage, Badge, type BadgeProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, type CheckboxProps, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, type DialogProps, DialogTitle, Drawer, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, type DrawerProps, DrawerTitle, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, type DropdownMenuProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, Header, HeaderActions, HeaderBreadcrumbs, HeaderContent, HeaderDescription, HeaderTitle, HoverCard, HoverCardDescription, type HoverCardDescriptionProps, HoverCardHeader, type HoverCardHeaderProps, type HoverCardProps, HoverCardTitle, type HoverCardTitleProps, Icon, IndicatorCircle, type IndicatorCircleProps, IndicatorDot, type IndicatorDotProps, Input, InputGroup, InputGroupHelpText, type InputGroupHelpTextProps, InputGroupLabel, type InputGroupLabelProps, type InputGroupProps, type InputProps, Label, type LabelProps, Menubar, MenubarDropdown, type MenubarDropdownProps, MenubarItem, type MenubarItemProps, MenubarLabel, type MenubarLabelProps, type MenubarProps, MenubarSeparator, type MenubarSeparatorProps, MenubarTrigger, type MenubarTriggerProps, ModelSelector, type ModelSelectorProps, ModelUserManagement, type ModelUserManagementProps, NavHeader, NavHeaderBrand, type NavHeaderBrandProps, NavHeaderDivider, type NavHeaderDividerProps, NavHeaderItem, type NavHeaderItemProps, NavHeaderNav, type NavHeaderNavProps, type NavHeaderProps, NavSidePanel, NavSidePanelBrand, type NavSidePanelBrandProps, NavSidePanelFooter, type NavSidePanelFooterProps, NavSidePanelHeader, type NavSidePanelHeaderProps, NavSidePanelItem, type NavSidePanelItemProps, NavSidePanelNav, type NavSidePanelNavProps, type NavSidePanelProps, NavSidePanelSeparator, type NavSidePanelSeparatorProps, Pagination, PaginationEllipsis, type PaginationEllipsisProps, PaginationItem, type PaginationItemProps, PaginationLink, type PaginationLinkProps, type PaginationProps, Popover, PopoverDescription, type PopoverDescriptionProps, PopoverHeader, type PopoverHeaderProps, type PopoverProps, PopoverTitle, type PopoverTitleProps, Progress, type ProgressProps, Radio, type RadioProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, type SheetProps, SheetTitle, Skeleton, Slider, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, type Theme, ThemeProvider, type ThemeProviderProps, Toaster as Toast, Toggle, type ToggleProps, Tooltip, type TooltipProps, UserAvatars, type UserAvatarsProps, UserDropdownTrigger, type UserDropdownTriggerProps, UserManagementGroup, type UserManagementGroupProps, avatarGroupVariants, badgeVariants, buttonVariants, cn, dropdownMenuItemVariants, indicatorCircleVariants, indicatorDotVariants, menubarItemVariants, menubarTriggerVariants, navHeaderItemVariants, navSidePanelItemVariants, paginationItemVariants, toggleVariants, useTheme };