@moontra/moonui 2.1.3 → 2.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moontra/moonui",
-  "version": "2.1.3",
+  "version": "2.1.5",
   "description": "Premium React component library with modern design and customization",
   "author": "MoonUI",
   "license": "MIT",

package/src/components/ui/avatar.tsx

@@ -45,15 +45,15 @@ export interface MoonUIAvatarProps
 
 const MoonUIAvatar = React.forwardRef<
   React.ElementRef<typeof AvatarPrimitive.Root>,
-  AvatarProps
+  MoonUIAvatarProps
 >(({ className, size, radius, variant, ...props }, ref) => (
   <AvatarPrimitive.Root
     ref={ref}
-    className={cn(avatarVariants({ size, radius, variant }), className)}
+    className={cn(moonUIAvatarVariants({ size, radius, variant }), className)}
     {...props}
   />
 ));
-Avatar.displayName = AvatarPrimitive.Root.displayName;
+MoonUIAvatar.displayName = AvatarPrimitive.Root.displayName;
 
 const MoonUIAvatarImage = React.forwardRef<
   React.ElementRef<typeof AvatarPrimitive.Image>,
@@ -65,7 +65,7 @@ const MoonUIAvatarImage = React.forwardRef<
     {...props}
   />
 ));
-AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+MoonUIAvatarImage.displayName = AvatarPrimitive.Image.displayName;
 
 const MoonUIAvatarFallback = React.forwardRef<
   React.ElementRef<typeof AvatarPrimitive.Fallback>,
@@ -80,7 +80,7 @@ const MoonUIAvatarFallback = React.forwardRef<
     {...props}
   />
 ));
-AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+MoonUIAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
 
 // Avatar Group Component for displaying multiple avatars
 interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -89,7 +89,7 @@ interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
   overlapOffset?: number;
 }
 
-const AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(
+const MoonUIAvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(
   ({ className, limit, avatars, overlapOffset = -8, ...props }, ref) => {
     const visibleAvatars = limit ? avatars.slice(0, limit) : avatars;
     const remainingCount = limit ? Math.max(0, avatars.length - limit) : 0;
@@ -118,11 +118,11 @@ const AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(
               className="relative z-0"
               style={{ marginLeft: `${overlapOffset}px` }}
             >
-              <Avatar variant="border">
-                <AvatarFallback>
+              <MoonUIAvatar variant="border">
+                <MoonUIAvatarFallback>
                   +{remainingCount}
-                </AvatarFallback>
-              </Avatar>
+                </MoonUIAvatarFallback>
+              </MoonUIAvatar>
             </div>
           )}
         </div>
@@ -130,9 +130,9 @@ const AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(
     );
   }
 );
-AvatarGroup.displayName = "AvatarGroup";
+MoonUIAvatarGroup.displayName = "AvatarGroup";
 
-export { MoonUIAvatar, MoonUIAvatarImage, MoonUIAvatarFallback, AvatarGroup  };
+export { MoonUIAvatar, MoonUIAvatarImage, MoonUIAvatarFallback, MoonUIAvatarGroup  };
 
 // Backward compatibility exports
-export { MoonUIAvatar as Avatar, MoonUIAvatarImage as AvatarImage, MoonUIAvatarFallback as AvatarFallback };
+export { MoonUIAvatar as Avatar, MoonUIAvatarImage as AvatarImage, MoonUIAvatarFallback as AvatarFallback, MoonUIAvatarGroup as AvatarGroup };

package/src/components/ui/badge.tsx

@@ -120,7 +120,7 @@ export interface MoonUIBadgeProps
  * @param props.leftIcon - Badge'in solunda görüntülenecek ikon
  * @param props.rightIcon - Badge'in sağında görüntülenecek ikon
  */
-function Badge({
+function MoonUIBadge({
   className,
   variant,
   size,

package/src/components/ui/checkbox.tsx

@@ -114,7 +114,7 @@ const MoonUICheckbox = React.forwardRef<
     </CheckboxPrimitive.Root>
   );
 });
-Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+MoonUICheckbox.displayName = CheckboxPrimitive.Root.displayName;
 
 // CheckboxGroup bileşeni
 interface CheckboxGroupProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -132,7 +132,7 @@ interface CheckboxGroupProps extends React.HTMLAttributes<HTMLDivElement> {
   children: React.ReactNode;
 }
 
-const CheckboxGroup = React.forwardRef<HTMLDivElement, CheckboxGroupProps>(
+const MoonUICheckboxGroup = React.forwardRef<HTMLDivElement, CheckboxGroupProps>(
   ({ className, orientation = "vertical", spacing = "1rem", children, ...props }, ref) => {
     return (
       <div
@@ -151,7 +151,7 @@ const CheckboxGroup = React.forwardRef<HTMLDivElement, CheckboxGroupProps>(
     );
   }
 );
-CheckboxGroup.displayName = "CheckboxGroup";
+MoonUICheckboxGroup.displayName = "CheckboxGroup";
 
 // CheckboxLabel bileşeni
 interface CheckboxLabelProps extends React.HTMLAttributes<HTMLLabelElement> {
@@ -173,7 +173,7 @@ interface CheckboxLabelProps extends React.HTMLAttributes<HTMLLabelElement> {
   disabled?: boolean;
 }
 
-const CheckboxLabel = React.forwardRef<HTMLLabelElement, CheckboxLabelProps>(
+const MoonUICheckboxLabel = React.forwardRef<HTMLLabelElement, CheckboxLabelProps>(
   ({ className, htmlFor, children, position = "end", disabled = false, ...props }, ref) => {
     return (
       <label
@@ -192,7 +192,7 @@ const CheckboxLabel = React.forwardRef<HTMLLabelElement, CheckboxLabelProps>(
     );
   }
 );
-CheckboxLabel.displayName = "CheckboxLabel";
+MoonUICheckboxLabel.displayName = "CheckboxLabel";
 
 // Checkbox ve Label içeren bileşen
 interface CheckboxWithLabelProps extends CheckboxProps {
@@ -210,7 +210,7 @@ interface CheckboxWithLabelProps extends CheckboxProps {
   labelClassName?: string;
 }
 
-const CheckboxWithLabel = React.forwardRef<
+const MoonUICheckboxWithLabel = React.forwardRef<
   React.ElementRef<typeof CheckboxPrimitive.Root>,
   CheckboxWithLabelProps
 >(({ 
@@ -251,7 +251,7 @@ const CheckboxWithLabel = React.forwardRef<
     </div>
   );
 });
-CheckboxWithLabel.displayName = "CheckboxWithLabel";
+MoonUICheckboxWithLabel.displayName = "CheckboxWithLabel";
 
 export { MoonUICheckbox, CheckboxGroup, CheckboxLabel, CheckboxWithLabel  };
 

package/src/components/ui/collapsible.tsx

@@ -72,7 +72,7 @@ const MoonUICollapsibleTrigger = React.forwardRef<
     </CollapsiblePrimitive.Trigger>
   )
 })
-CollapsibleTrigger.displayName = CollapsiblePrimitive.Trigger.displayName
+MoonUICollapsibleTrigger.displayName = CollapsiblePrimitive.Trigger.displayName
 
 const collapsibleContentVariants = cva(
   "overflow-hidden transition-all data-[state=closed]:animate-collapse-up data-[state=open]:animate-collapse-down",
@@ -113,7 +113,7 @@ const MoonUICollapsibleContent = React.forwardRef<
     <div className="p-4">{children}</div>
   </CollapsiblePrimitive.Content>
 ))
-CollapsibleContent.displayName = CollapsiblePrimitive.Content.displayName
+MoonUICollapsibleContent.displayName = CollapsiblePrimitive.Content.displayName
 
 export { MoonUICollapsible,
   MoonUICollapsibleTrigger,

package/src/components/ui/command.tsx

@@ -52,7 +52,7 @@ const MoonUICommand = React.forwardRef<
     {...props}
   />
 ))
-Command.displayName = CommandPrimitive.displayName
+MoonUICommand.displayName = CommandPrimitive.displayName
 
 // CommandDialog bileşeni
 interface CommandDialogProps extends React.ComponentProps<typeof Dialog> {
@@ -100,7 +100,7 @@ const MoonUICommandInput = React.forwardRef<
     />
   </div>
 ))
-CommandInput.displayName = CommandPrimitive.Input.displayName
+MoonUICommandInput.displayName = CommandPrimitive.Input.displayName
 
 // CommandList bileşeni
 interface MoonUICommandListProps 
@@ -116,7 +116,7 @@ const MoonUICommandList = React.forwardRef<
     {...props}
   />
 ))
-CommandList.displayName = CommandPrimitive.List.displayName
+MoonUICommandList.displayName = CommandPrimitive.List.displayName
 
 // CommandEmpty bileşeni
 interface MoonUICommandEmptyProps 
@@ -132,7 +132,7 @@ const MoonUICommandEmpty = React.forwardRef<
     {...props}
   />
 ))
-CommandEmpty.displayName = CommandPrimitive.Empty.displayName
+MoonUICommandEmpty.displayName = CommandPrimitive.Empty.displayName
 
 // CommandGroup bileşeni
 interface MoonUICommandGroupProps 
@@ -151,7 +151,7 @@ const MoonUICommandGroup = React.forwardRef<
     {...props}
   />
 ))
-CommandGroup.displayName = CommandPrimitive.Group.displayName
+MoonUICommandGroup.displayName = CommandPrimitive.Group.displayName
 
 // CommandSeparator bileşeni
 interface MoonUICommandSeparatorProps 
@@ -167,7 +167,7 @@ const MoonUICommandSeparator = React.forwardRef<
     {...props}
   />
 ))
-CommandSeparator.displayName = CommandPrimitive.Separator.displayName
+MoonUICommandSeparator.displayName = CommandPrimitive.Separator.displayName
 
 // CommandItem bileşeni
 interface MoonUICommandItemProps 
@@ -186,7 +186,7 @@ const MoonUICommandItem = React.forwardRef<
     {...props}
   />
 ))
-CommandItem.displayName = CommandPrimitive.Item.displayName
+MoonUICommandItem.displayName = CommandPrimitive.Item.displayName
 
 // CommandShortcut bileşeni - utility component
 const MoonUICommandShortcut = ({

package/src/components/ui/dialog.tsx

@@ -17,7 +17,7 @@ import { cn } from "../../lib/utils";
 
 const MoonUIDialog = DialogPrimitive.Root;
 const MoonUIDialogTrigger = DialogPrimitive.Trigger;
-const DialogPortal = DialogPrimitive.Portal;
+const MoonUIDialogPortal = DialogPrimitive.Portal;
 const MoonUIDialogClose = DialogPrimitive.Close;
 
 const overlayVariants = cva(
@@ -47,7 +47,7 @@ interface DialogOverlayProps
     extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>,
         VariantProps<typeof overlayVariants> {}
 
-const DialogOverlay = React.forwardRef<
+const MoonUIDialogOverlay = React.forwardRef<
     React.ElementRef<typeof DialogPrimitive.Overlay>,
     DialogOverlayProps
 >(({ className, variant, animation, ...props }, ref) => (
@@ -57,7 +57,7 @@ const DialogOverlay = React.forwardRef<
         {...props}
     />
 ));
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+MoonUIDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 
 const dialogContentVariants = cva(
     "fixed left-[50%] top-[50%] z-50 grid w-full translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background shadow-lg",
@@ -243,7 +243,7 @@ const MoonUIDialogContent = React.forwardRef<
         );
     }
 );
-DialogContent.displayName = DialogPrimitive.Content.displayName;
+MoonUIDialogContent.displayName = DialogPrimitive.Content.displayName;
 
 const MoonUIDialogHeader = ({
     className,
@@ -286,7 +286,7 @@ const MoonUIDialogTitle = React.forwardRef<
         {...props}
     />
 ));
-DialogTitle.displayName = DialogPrimitive.Title.displayName;
+MoonUIDialogTitle.displayName = DialogPrimitive.Title.displayName;
 
 const MoonUIDialogDescription = React.forwardRef<
     React.ElementRef<typeof DialogPrimitive.Description>,
@@ -301,13 +301,13 @@ const MoonUIDialogDescription = React.forwardRef<
         {...props}
     />
 ));
-DialogDescription.displayName = DialogPrimitive.Description.displayName;
+MoonUIDialogDescription.displayName = DialogPrimitive.Description.displayName;
 
 /**
  * Dialog-Form integration for use with form support
  * Used to integrate form submission processes into the modal
  */
-const DialogForm = React.forwardRef<
+const MoonUIDialogForm = React.forwardRef<
     HTMLFormElement,
     React.HTMLAttributes<HTMLFormElement>
 >(({ className, ...props }, ref) => (
@@ -317,7 +317,7 @@ const DialogForm = React.forwardRef<
         {...props}
     />
 ));
-DialogForm.displayName = "DialogForm";
+MoonUIDialogForm.displayName = "DialogForm";
 
 export { MoonUIDialog,
     MoonUIDialogTrigger,

package/src/components/ui/dropdown-menu.tsx

@@ -37,7 +37,7 @@ const MoonUIDropdownMenuSubTrigger = React.forwardRef<
     <ChevronRight className="ml-auto h-4 w-4" />
   </DropdownMenuPrimitive.SubTrigger>
 ))
-DropdownMenuSubTrigger.displayName =
+MoonUIDropdownMenuSubTrigger.displayName =
   DropdownMenuPrimitive.SubTrigger.displayName
 
 const MoonUIDropdownMenuSubContent = React.forwardRef<
@@ -53,7 +53,7 @@ const MoonUIDropdownMenuSubContent = React.forwardRef<
     {...props}
   />
 ))
-DropdownMenuSubContent.displayName =
+MoonUIDropdownMenuSubContent.displayName =
   DropdownMenuPrimitive.SubContent.displayName
 
 const MoonUIDropdownMenuContent = React.forwardRef<
@@ -72,7 +72,7 @@ const MoonUIDropdownMenuContent = React.forwardRef<
     />
   </DropdownMenuPrimitive.Portal>
 ))
-DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
+MoonUIDropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
 
 const MoonUIDropdownMenuItem = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Item>,
@@ -90,7 +90,7 @@ const MoonUIDropdownMenuItem = React.forwardRef<
     {...props}
   />
 ))
-DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
+MoonUIDropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
 
 const MoonUIDropdownMenuCheckboxItem = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,
@@ -113,7 +113,7 @@ const MoonUIDropdownMenuCheckboxItem = React.forwardRef<
     {children}
   </DropdownMenuPrimitive.CheckboxItem>
 ))
-DropdownMenuCheckboxItem.displayName =
+MoonUIDropdownMenuCheckboxItem.displayName =
   DropdownMenuPrimitive.CheckboxItem.displayName
 
 const MoonUIDropdownMenuRadioItem = React.forwardRef<
@@ -136,7 +136,7 @@ const MoonUIDropdownMenuRadioItem = React.forwardRef<
     {children}
   </DropdownMenuPrimitive.RadioItem>
 ))
-DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
+MoonUIDropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
 
 const MoonUIDropdownMenuLabel = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Label>,
@@ -154,7 +154,7 @@ const MoonUIDropdownMenuLabel = React.forwardRef<
     {...props}
   />
 ))
-DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
+MoonUIDropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
 
 const MoonUIDropdownMenuSeparator = React.forwardRef<
   React.ElementRef<typeof DropdownMenuPrimitive.Separator>,
@@ -166,7 +166,7 @@ const MoonUIDropdownMenuSeparator = React.forwardRef<
     {...props}
   />
 ))
-DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
+MoonUIDropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
 
 const MoonUIDropdownMenuShortcut = ({
   className,

package/src/components/ui/label.tsx

@@ -21,7 +21,7 @@ const MoonUILabel = React.forwardRef<
     {...props}
   />
 ))
-Label.displayName = LabelPrimitive.Root.displayName
+MoonUILabel.displayName = LabelPrimitive.Root.displayName
 
 export { MoonUILabel  };
 

package/src/components/ui/pagination.tsx

@@ -13,7 +13,7 @@ const MoonUIPagination = ({ className, ...props }: React.ComponentProps<"nav">)
 )
 MoonUIPagination.displayName = "MoonUIPagination"
 
-const PaginationContent = React.forwardRef<
+const MoonUIPaginationContent = React.forwardRef<
   HTMLUListElement,
   React.ComponentProps<"ul">
 >(({ className, ...props }, ref) => (
@@ -23,22 +23,22 @@ const PaginationContent = React.forwardRef<
     {...props}
   />
 ))
-PaginationContent.displayName = "PaginationContent"
+MoonUIPaginationContent.displayName = "PaginationContent"
 
-const PaginationItem = React.forwardRef<
+const MoonUIPaginationItem = React.forwardRef<
   HTMLLIElement,
   React.ComponentProps<"li">
 >(({ className, ...props }, ref) => (
   <li ref={ref} className={cn("", className)} {...props} />
 ))
-PaginationItem.displayName = "PaginationItem"
+MoonUIPaginationItem.displayName = "PaginationItem"
 
 type PaginationLinkProps = {
   isActive?: boolean
 } & Pick<ButtonProps, "size"> &
   React.ComponentProps<"a">
 
-const PaginationLink = ({
+const MoonUIPaginationLink = ({
   className,
   isActive,
   size = "icon",
@@ -56,9 +56,9 @@ const PaginationLink = ({
     {...props}
   />
 )
-PaginationLink.displayName = "PaginationLink"
+MoonUIPaginationLink.displayName = "PaginationLink"
 
-const PaginationPrevious = ({
+const MoonUIPaginationPrevious = ({
   className,
   ...props
 }: React.ComponentProps<typeof PaginationLink>) => (
@@ -72,9 +72,9 @@ const PaginationPrevious = ({
     <span>Previous</span>
   </PaginationLink>
 )
-PaginationPrevious.displayName = "PaginationPrevious"
+MoonUIPaginationPrevious.displayName = "PaginationPrevious"
 
-const PaginationNext = ({
+const MoonUIPaginationNext = ({
   className,
   ...props
 }: React.ComponentProps<typeof PaginationLink>) => (
@@ -88,9 +88,9 @@ const PaginationNext = ({
     <ChevronRight className="h-4 w-4" />
   </PaginationLink>
 )
-PaginationNext.displayName = "PaginationNext"
+MoonUIPaginationNext.displayName = "PaginationNext"
 
-const PaginationEllipsis = ({
+const MoonUIPaginationEllipsis = ({
   className,
   ...props
 }: React.ComponentProps<"span">) => (
@@ -103,7 +103,7 @@ const PaginationEllipsis = ({
     <span className="sr-only">More pages</span>
   </span>
 )
-PaginationEllipsis.displayName = "PaginationEllipsis"
+MoonUIPaginationEllipsis.displayName = "PaginationEllipsis"
 
 export { MoonUIPagination,
   PaginationContent,

package/src/components/ui/popover.tsx

@@ -130,7 +130,7 @@ const MoonUIPopoverContent = React.forwardRef<
     />
   </>
 ));
-PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+MoonUIPopoverContent.displayName = PopoverPrimitive.Content.displayName;
 
 /**
  * PopoverClose bileşeni
@@ -140,35 +140,35 @@ const PopoverClose = PopoverPrimitive.Close;
 /**
  * Popover için bölüm ayırıcı
  */
-const PopoverSeparator = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+const MoonUIPopoverSeparator = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn("my-2 h-px bg-border", className)}
     {...props}
   />
 );
-PopoverSeparator.displayName = "PopoverSeparator";
+MoonUIPopoverSeparator.displayName = "PopoverSeparator";
 
 /**
  * Popover başlık bileşeni
  */
-const PopoverHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+const MoonUIPopoverHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn("-mx-4 -mt-4 mb-3 px-4 pt-4 pb-3 border-b border-border", className)}
     {...props}
   />
 );
-PopoverHeader.displayName = "PopoverHeader";
+MoonUIPopoverHeader.displayName = "PopoverHeader";
 
 /**
  * Popover footer bileşeni
  */
-const PopoverFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
+const MoonUIPopoverFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn("-mx-4 -mb-4 mt-3 px-4 pt-3 pb-4 border-t border-border", className)}
     {...props}
   />
 );
-PopoverFooter.displayName = "PopoverFooter";
+MoonUIPopoverFooter.displayName = "PopoverFooter";
 
 export { MoonUIPopover,
   MoonUIPopoverTrigger,

package/src/components/ui/radio-group.tsx

@@ -173,7 +173,7 @@ interface RadioLabelProps extends React.HTMLAttributes<HTMLLabelElement> {
   disabled?: boolean;
 }
 
-const RadioLabel = React.forwardRef<HTMLLabelElement, RadioLabelProps>(
+const MoonUIRadioLabel = React.forwardRef<HTMLLabelElement, RadioLabelProps>(
   ({ className, htmlFor, children, disabled = false, ...props }, ref) => {
     return (
       <label
@@ -191,7 +191,7 @@ const RadioLabel = React.forwardRef<HTMLLabelElement, RadioLabelProps>(
     );
   }
 );
-RadioLabel.displayName = "RadioLabel";
+MoonUIRadioLabel.displayName = "RadioLabel";
 
 // Radio Item and Label combination
 interface RadioItemWithLabelProps extends RadioGroupItemProps {
@@ -213,7 +213,7 @@ interface RadioItemWithLabelProps extends RadioGroupItemProps {
   disabled?: boolean;
 }
 
-const RadioItemWithLabel = React.forwardRef<
+const MoonUIRadioItemWithLabel = React.forwardRef<
   HTMLInputElement,
   RadioItemWithLabelProps
 >(({ 
@@ -238,7 +238,7 @@ const RadioItemWithLabel = React.forwardRef<
     </div>
   );
 });
-RadioItemWithLabel.displayName = "RadioItemWithLabel";
+MoonUIRadioItemWithLabel.displayName = "RadioItemWithLabel";
 
 export { MoonUIRadioGroup, MoonUIRadioGroupItem, RadioLabel, RadioItemWithLabel  };
 

package/src/components/ui/select.tsx

@@ -97,12 +97,12 @@ const MoonUISelectTrigger = React.forwardRef<
     )}
   </SelectPrimitive.Trigger>
 ))
-SelectTrigger.displayName = SelectPrimitive.Trigger.displayName
+MoonUISelectTrigger.displayName = SelectPrimitive.Trigger.displayName
 
 /**
  * Scroll Up Button Component
  */
-const SelectScrollUpButton = React.forwardRef<
+const MoonUISelectScrollUpButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
   React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
 >(({ className, ...props }, ref) => (
@@ -117,12 +117,12 @@ const SelectScrollUpButton = React.forwardRef<
     <ChevronUp className="h-4 w-4" />
   </SelectPrimitive.ScrollUpButton>
 ))
-SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
+MoonUISelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName
 
 /**
  * Scroll Down Button Component
  */
-const SelectScrollDownButton = React.forwardRef<
+const MoonUISelectScrollDownButton = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
   React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
 >(({ className, ...props }, ref) => (
@@ -137,7 +137,7 @@ const SelectScrollDownButton = React.forwardRef<
     <ChevronDown className="h-4 w-4" />
   </SelectPrimitive.ScrollDownButton>
 ))
-SelectScrollDownButton.displayName =
+MoonUISelectScrollDownButton.displayName =
   SelectPrimitive.ScrollDownButton.displayName
 
 const MoonUISelectContent = React.forwardRef<
@@ -177,7 +177,7 @@ const MoonUISelectContent = React.forwardRef<
     </SelectPrimitive.Content>
   </SelectPrimitive.Portal>
 ))
-SelectContent.displayName = SelectPrimitive.Content.displayName
+MoonUISelectContent.displayName = SelectPrimitive.Content.displayName
 
 const MoonUISelectLabel = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Label>,
@@ -189,7 +189,7 @@ const MoonUISelectLabel = React.forwardRef<
     {...props}
   />
 ))
-SelectLabel.displayName = SelectPrimitive.Label.displayName
+MoonUISelectLabel.displayName = SelectPrimitive.Label.displayName
 
 type SelectItemVariant = "default" | "subtle" | "destructive" | "success" | "warning";
 type SelectItemSize = "sm" | "md" | "lg";
@@ -245,7 +245,7 @@ const MoonUISelectItem = React.forwardRef<
     )}
   </SelectPrimitive.Item>
 ))
-SelectItem.displayName = SelectPrimitive.Item.displayName
+MoonUISelectItem.displayName = SelectPrimitive.Item.displayName
 
 const MoonUISelectSeparator = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Separator>,
@@ -257,7 +257,7 @@ const MoonUISelectSeparator = React.forwardRef<
     {...props}
   />
 ))
-SelectSeparator.displayName = SelectPrimitive.Separator.displayName
+MoonUISelectSeparator.displayName = SelectPrimitive.Separator.displayName
 
 export { MoonUISelect,
   MoonUISelectGroup,

package/src/components/ui/separator.tsx

@@ -135,7 +135,7 @@ const MoonUISeparator = React.forwardRef<
     />
   )
 )
-Separator.displayName = SeparatorPrimitive.Root.displayName
+MoonUISeparator.displayName = SeparatorPrimitive.Root.displayName
 
 export { MoonUISeparator, moonUISeparatorVariants  };