@moontra/moonui-pro 2.2.3 → 2.2.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moontra/moonui-pro",
-  "version": "2.2.3",
+  "version": "2.2.4",
   "description": "Premium React components for MoonUI - Advanced UI library with 50+ pro components including performance, interactive, and gesture components",
   "type": "module",
   "main": "dist/index.mjs",
@@ -71,7 +71,6 @@
   },
   "homepage": "https://moonui.dev",
   "peerDependencies": {
-    "@moontra/moonui": "^2.0.10",
     "react": ">=18.0.0 || ^19.0.0",
     "react-dom": ">=18.0.0 || ^19.0.0"
   },

package/src/components/index.ts

@@ -1,5 +1,8 @@
 // Pro Components Export - Source of Truth: packages/moonui-pro
 
+// UI Components (Enhanced versions with Pro suffix)
+export * from "./ui"
+
 // Animated Button
 export * from "./animated-button"
 
@@ -54,8 +57,7 @@ export * from "./draggable-list"
 // Advanced Forms
 export * from "./advanced-forms"
 
-// Color Picker
-export * from "./color-picker"
+// Note: ColorPicker is available in UI components
 
 // GitHub Stars
 export * from "./github-stars"

package/src/components/internal/index.ts

@@ -0,0 +1,78 @@
+// Internal Components - Used by Pro components internally
+// These are not exported to the public API
+
+// Simple re-exports of basic components for internal use
+export { 
+  MoonUIAccordionPro as Accordion,
+  MoonUIAccordionItemPro as AccordionItem,
+  MoonUIAccordionTriggerPro as AccordionTrigger,
+  MoonUIAccordionContentPro as AccordionContent,
+} from "../ui/accordion"
+
+export {
+  MoonUIAlertPro as Alert,
+  MoonUIAlertDescriptionPro as AlertDescription,
+  MoonUIAlertTitlePro as AlertTitle,
+} from "../ui/alert"
+
+export {
+  MoonUIAspectRatioPro as AspectRatio,
+} from "../ui/aspect-ratio"
+
+export {
+  MoonUIBreadcrumbPro as Breadcrumb,
+  MoonUIBreadcrumbListPro as BreadcrumbList,
+  MoonUIBreadcrumbItemPro as BreadcrumbItem,
+  MoonUIBreadcrumbLinkPro as BreadcrumbLink,
+  MoonUIBreadcrumbPagePro as BreadcrumbPage,
+  MoonUIBreadcrumbSeparatorPro as BreadcrumbSeparator,
+  MoonUIBreadcrumbEllipsisPro as BreadcrumbEllipsis,
+} from "../ui/breadcrumb"
+
+export {
+  MoonUICollapsiblePro as Collapsible,
+  MoonUICollapsibleTriggerPro as CollapsibleTrigger,
+  MoonUICollapsibleContentPro as CollapsibleContent,
+} from "../ui/collapsible"
+
+export {
+  MoonUICommandPro as Command,
+  MoonUICommandDialogPro as CommandDialog,
+  MoonUICommandInputPro as CommandInput,
+  MoonUICommandListPro as CommandList,
+  MoonUICommandEmptyPro as CommandEmpty,
+  MoonUICommandGroupPro as CommandGroup,
+  MoonUICommandItemPro as CommandItem,
+  MoonUICommandShortcutPro as CommandShortcut,
+  MoonUICommandSeparatorPro as CommandSeparator,
+} from "../ui/command"
+
+export {
+  MoonUITablePro as Table,
+  MoonUITableHeaderPro as TableHeader,
+  MoonUITableBodyPro as TableBody,
+  MoonUITableFooterPro as TableFooter,
+  MoonUITableHeadPro as TableHead,
+  MoonUITableRowPro as TableRow,
+  MoonUITableCellPro as TableCell,
+  MoonUITableCaptionPro as TableCaption,
+} from "../ui/table"
+
+export {
+  MoonUITogglePro as Toggle,
+} from "../ui/toggle"
+
+export {
+  MoonUIPaginationPro as Pagination,
+  MoonUIPaginationContentPro as PaginationContent,
+  MoonUIPaginationEllipsisPro as PaginationEllipsis,
+  MoonUIPaginationItemPro as PaginationItem,
+  MoonUIPaginationLinkPro as PaginationLink,
+  MoonUIPaginationNextPro as PaginationNext,
+  MoonUIPaginationPreviousPro as PaginationPrevious,
+} from "../ui/pagination"
+
+export {
+  MoonUIRadioGroupPro as RadioGroup,
+  MoonUIRadioGroupItemPro as RadioGroupItem,
+} from "../ui/radio-group"

package/src/components/ui/accordion.tsx

@@ -0,0 +1,73 @@
+"use client"
+
+import * as React from "react"
+import * as AccordionPrimitive from "@radix-ui/react-accordion"
+import { ChevronDown } from "lucide-react"
+
+import { cn } from "../../lib/utils"
+
+const MoonUIAccordionPro = AccordionPrimitive.Root
+
+const MoonUIAccordionItemPro = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
+>(({ className, ...props }, ref) => (
+  <AccordionPrimitive.Item
+    ref={ref}
+    className={cn("border-b border-gray-200 dark:border-gray-800", className)}
+    {...props}
+  />
+))
+MoonUIAccordionItemPro.displayName = "MoonUIAccordionItemPro"
+
+const MoonUIAccordionTriggerPro = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
+>(({ className, children, ...props }, ref) => (
+  <AccordionPrimitive.Header className="flex">
+    <AccordionPrimitive.Trigger
+      ref={ref}
+      className={cn(
+        "flex flex-1 items-center justify-between py-4 font-medium transition-all dark:text-gray-100",
+        "hover:underline hover:text-primary dark:hover:text-primary-400",
+        "[&[data-state=open]>svg]:rotate-180",
+        className
+      )}
+      {...props}
+    >
+      {children}
+      <ChevronDown className="h-4 w-4 shrink-0 transition-transform duration-200 opacity-70 group-hover:opacity-100" />
+    </AccordionPrimitive.Trigger>
+  </AccordionPrimitive.Header>
+))
+MoonUIAccordionTriggerPro.displayName = "MoonUIAccordionTriggerPro"
+
+const MoonUIAccordionContentPro = React.forwardRef<
+  React.ElementRef<typeof AccordionPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
+>(({ className, children, ...props }, ref) => (
+  <AccordionPrimitive.Content
+    ref={ref}
+    className={cn(
+      "overflow-hidden text-sm text-gray-700 dark:text-gray-300 transition-all", 
+      "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
+      className
+    )}
+    {...props}
+  >
+    <div className="pb-4 pt-0">{children}</div>
+  </AccordionPrimitive.Content>
+))
+MoonUIAccordionContentPro.displayName = "MoonUIAccordionContentPro"
+
+// Internal aliases for Pro component usage
+export const AccordionInternal = MoonUIAccordionPro
+export const AccordionItemInternal = MoonUIAccordionItemPro
+export const AccordionTriggerInternal = MoonUIAccordionTriggerPro
+export const AccordionContentInternal = MoonUIAccordionContentPro
+
+// Pro exports
+export { MoonUIAccordionPro, MoonUIAccordionItemPro, MoonUIAccordionTriggerPro, MoonUIAccordionContentPro }
+
+// Clean exports (without MoonUI prefix for easier usage)
+export { MoonUIAccordionPro as Accordion, MoonUIAccordionItemPro as AccordionItem, MoonUIAccordionTriggerPro as AccordionTrigger, MoonUIAccordionContentPro as AccordionContent }

package/src/components/ui/alert.tsx

@@ -0,0 +1,142 @@
+"use client";
+
+import * as React from "react";
+import { cva, type VariantProps } from "class-variance-authority";
+import { AlertCircle, AlertTriangle, Info, Check, X } from "lucide-react";
+
+import { cn } from "../../lib/utils";
+
+/**
+ * Alert Component
+ *
+ * Yüksek kaliteli, özelleştirilebilir ve erişilebilir alert bileşeni.
+ * Bildirim, uyarı ve dikkat çekmek gereken içerikler için kullanılır.
+ */
+
+const MoonUIalertVariantsPro = cva(
+  "relative w-full flex items-center gap-3 p-4 border text-foreground [&>svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "bg-background text-foreground border-border",
+        primary: "bg-primary/10 text-primary border-primary/30",
+        success: "bg-success/10 text-success border-success/30",
+        warning: "bg-warning/10 text-warning border-warning/30",
+        error: "bg-destructive/10 text-destructive border-destructive/30",
+        info: "bg-blue-500/10 text-blue-500 border-blue-500/30",
+      },
+      size: {
+        sm: "py-2 text-xs",
+        default: "py-3 text-sm",
+        lg: "py-4 text-base",
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        default: "rounded-md",
+        lg: "rounded-lg",
+        full: "rounded-full",
+      },
+      withClose: {
+        true: "pr-10",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      radius: "default",
+      withClose: false,
+    },
+  }
+);
+
+export interface AlertProps
+  extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof MoonUIalertVariantsPro> {
+  /** Alert ikonunu gizler */
+  hideIcon?: boolean;
+  /** Kapatma butonu ekler */
+  closable?: boolean;
+  /** Kapatma butonu tıklandığında çalışacak fonksiyon */
+  onClose?: () => void;
+}
+
+const MoonUIAlertPro = React.forwardRef<HTMLDivElement, AlertProps>(
+  ({ className, variant = "default", size, radius, hideIcon = false, closable = false, onClose, children, ...props }, ref) => {
+    // Alert türüne göre ikon belirleme
+    const MoonUIIconPro = React.useMemo(() => {
+      switch (variant) {
+        case "success":
+          return Check;
+        case "warning":
+          return AlertTriangle;
+        case "error":
+          return AlertCircle;
+        case "info":
+          return Info;
+        default:
+          return Info;
+      }
+    }, [variant]);
+
+    return (
+      <div
+        ref={ref}
+        role="alert"
+        className={cn(MoonUIalertVariantsPro({ variant, size, radius, withClose: closable }), className)}
+        {...props}
+      >
+        {!hideIcon && <MoonUIIconPro className="h-5 w-5" />}
+        <div className="flex-1">{children}</div>
+        {closable && onClose && (
+          <button
+            onClick={onClose}
+            className="absolute right-3 top-3 inline-flex h-6 w-6 items-center justify-center rounded-full opacity-70 transition-opacity hover:opacity-100"
+            aria-label="Kapat"
+          >
+            <X className="h-4 w-4" />
+          </button>
+        )}
+      </div>
+    );
+  }
+);
+MoonUIAlertPro.displayName = "AlertPro";
+
+const MoonUIAlertTitlePro = React.forwardRef<
+  HTMLParagraphElement,
+  React.HTMLAttributes<HTMLHeadingElement>
+>(({ className, ...props }, ref) => (
+  <h5
+    ref={ref}
+    className={cn("font-semibold leading-tight tracking-tight mb-1", className)}
+    {...props}
+  />
+));
+MoonUIAlertTitlePro.displayName = "AlertTitlePro";
+
+const MoonUIAlertDescriptionPro = React.forwardRef<
+  HTMLParagraphElement,
+  React.HTMLAttributes<HTMLParagraphElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("text-sm leading-5 text-muted-foreground", className)}
+    {...props}
+  />
+));
+MoonUIAlertDescriptionPro.displayName = "AlertDescriptionPro";
+
+
+// Internal aliases for Pro component usage
+export const alertVariantsInternal = MoonUIalertVariantsPro
+export const AlertInternal = MoonUIAlertPro
+export const IconInternal = MoonUIIconPro
+export const AlertTitleInternal = MoonUIAlertTitlePro
+export const AlertDescriptionInternal = MoonUIAlertDescriptionPro
+
+// Pro exports  
+export { MoonUIalertVariantsPro, MoonUIAlertPro, MoonUIIconPro, MoonUIAlertTitlePro, MoonUIAlertDescriptionPro }
+
+// Clean exports (without MoonUI prefix for easier usage)
+export { MoonUIalertVariantsPro as alertVariants, MoonUIAlertPro as Alert, MoonUIIconPro as Icon, MoonUIAlertTitlePro as AlertTitle, MoonUIAlertDescriptionPro as AlertDescription };

package/src/components/ui/aspect-ratio.tsx

@@ -0,0 +1,81 @@
+"use client"
+
+import * as React from "react"
+import { cva, type VariantProps } from "class-variance-authority"
+
+import { cn } from "../../lib/utils"
+
+/**
+ * Aspect Ratio Component
+ * 
+ * A component that maintains a specific aspect ratio for content.
+ * Particularly useful for images, videos, and media content in responsive designs.
+ * Fully integrated with the theme system, accessible and customizable.
+ */
+
+const MoonUIaspectRatioVariantsPro = cva(
+  "relative overflow-hidden",
+  {
+    variants: {
+      variant: {
+        default: "rounded-md bg-muted/10",
+        ghost: "bg-transparent",
+        outline: "rounded-md border border-border",
+        card: "rounded-md bg-card shadow-sm",
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        md: "rounded-md",
+        lg: "rounded-lg",
+        full: "rounded-full",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  }
+)
+
+interface AspectRatioProps 
+  extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof MoonUIaspectRatioVariantsPro> {
+  /**
+   * Aspect ratio (width/height). For example 16/9, 4/3, 1/1 etc.
+   * @default 16/9
+   */
+  ratio?: number
+}
+
+const MoonUIAspectRatioPro = React.forwardRef<
+  HTMLDivElement,
+  AspectRatioProps
+>(({ className, variant, radius, ratio = 16 / 9, style, children, ...props }, ref) => (
+  <div
+    ref={ref} 
+    className={cn(MoonUIaspectRatioVariantsPro({ variant, radius }), className)}
+    style={{
+      position: "relative",
+      paddingBottom: `${(1 / ratio) * 100}%`,
+      ...style
+    }}
+    {...props}
+  >
+    <div className="absolute inset-0">
+      {children}
+    </div>
+  </div>
+))
+MoonUIAspectRatioPro.displayName = "AspectRatioPro"
+
+
+// Internal aliases for Pro component usage
+export const aspectRatioVariantsInternal = MoonUIaspectRatioVariantsPro
+export const AspectRatioInternal = MoonUIAspectRatioPro
+
+// Pro exports  
+export { MoonUIaspectRatioVariantsPro, MoonUIAspectRatioPro }
+
+// Clean exports (without MoonUI prefix for easier usage)
+export { MoonUIaspectRatioVariantsPro as aspectRatioVariants, MoonUIAspectRatioPro as AspectRatio }
+export type { AspectRatioProps }

package/src/components/ui/breadcrumb.tsx

@@ -0,0 +1,221 @@
+import * as React from "react";
+import { ChevronRight, MoreHorizontal } from "lucide-react";
+import { cva, type VariantProps } from "class-variance-authority";
+
+import { cn } from "../../lib/utils";
+
+const MoonUIbreadcrumbVariantsPro = cva(
+  "flex items-center gap-1.5 text-sm",
+  {
+    variants: {
+      variant: {
+        default: "dark:text-gray-100 transition-colors",
+        muted: "text-muted-foreground dark:text-gray-400 transition-colors",
+        ghost: "text-foreground/60 dark:text-gray-300/60 transition-colors",
+      },
+      size: {
+        default: "text-sm",
+        sm: "text-xs",
+        lg: "text-base",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  }
+);
+
+interface BreadcrumbProps
+  extends React.HTMLAttributes<HTMLElement>,
+    VariantProps<typeof MoonUIbreadcrumbVariantsPro> {
+  separator?: React.ReactNode;
+  showHomeIcon?: boolean;
+}
+
+interface BreadcrumbListProps extends React.HTMLAttributes<HTMLOListElement> {
+  collapsed?: boolean;
+  collapsedWidth?: number;
+}
+
+interface BreadcrumbItemProps extends React.HTMLAttributes<HTMLLIElement> {
+  isCurrent?: boolean;
+  href?: string;
+  asChild?: boolean;
+}
+
+interface BreadcrumbSeparatorProps extends React.HTMLAttributes<HTMLSpanElement> {
+  /** Custom separator icon or text */
+  icon?: React.ReactNode;
+}
+
+interface BreadcrumbEllipsisProps extends React.HTMLAttributes<HTMLSpanElement> {
+  /** Custom ellipsis icon */
+  icon?: React.ReactNode;
+}
+
+const MoonUIBreadcrumbPro = React.forwardRef<HTMLElement, BreadcrumbProps>(
+  ({ className, variant, size, ...props }, ref) => (
+    <nav
+      ref={ref}
+      className={cn(MoonUIbreadcrumbVariantsPro({ variant, size }), className)}
+      aria-label="breadcrumb"
+      {...props}
+    />
+  )
+);
+MoonUIBreadcrumbPro.displayName = "BreadcrumbPro";
+
+const MoonUIBreadcrumbListPro = React.forwardRef<HTMLOListElement, BreadcrumbListProps>(
+  ({ className, collapsed, collapsedWidth = 3, ...props }, ref) => {
+    const MoonUIchildrenArrayPro = React.Children.toArray(props.children).filter(Boolean);
+    const MoonUIchildCountPro = childrenArray.length;
+
+    if (collapsed && childCount > collapsedWidth) {
+      const MoonUIfirstItemPro = childrenArray[0];
+      // const MoonUImiddleItemsPro = childrenArray.slice(1, -2); // Uncomment when needed
+      const MoonUIlastTwoItemsPro = childrenArray.slice(-2);
+
+      return (
+        <ol
+          ref={ref}
+          className={cn(
+            "flex flex-wrap items-center gap-1.5 sm:gap-2.5",
+            className
+          )}
+          {...props}
+        >
+          {firstItem}
+          <BreadcrumbEllipsis />
+          {lastTwoItems}
+        </ol>
+      );
+    }
+
+    return (
+      <ol
+        ref={ref}
+        className={cn(
+          "flex flex-wrap items-center gap-1.5 sm:gap-2.5",
+          className
+        )}
+        {...props}
+      />
+    );
+  }
+);
+MoonUIBreadcrumbListPro.displayName = "BreadcrumbListPro";
+
+const MoonUIBreadcrumbItemPro = React.forwardRef<HTMLLIElement, BreadcrumbItemProps>(
+  ({ className, isCurrent, href, asChild = false, ...props }, ref) => {
+    const MoonUICompPro = asChild ? React.Fragment : href ? "a" : "span";
+    const MoonUIitemPropsPro = asChild ? {} : href ? { href } : {};
+
+    return (
+      <li
+        ref={ref}
+        className={cn("inline-flex items-center gap-1.5", className)}
+        aria-current={isCurrent ? "page" : undefined}
+        {...props}
+      >
+        <Comp 
+          className={cn(
+            "transition-colors duration-200 hover:text-foreground",
+            isCurrent 
+              ? "font-medium text-foreground dark:text-white dark:text-opacity-95" 
+              : "text-muted-foreground hover:text-foreground dark:text-gray-400 dark:hover:text-gray-200 dark:hover:text-opacity-95 hover:underline hover:underline-offset-4 hover:decoration-gray-300/30"
+          )}
+          {...itemProps}
+        >
+          {props.children}
+        </Comp>
+      </li>
+    );
+  }
+);
+MoonUIBreadcrumbItemPro.displayName = "BreadcrumbItemPro";
+
+const MoonUIBreadcrumbSeparatorPro = ({
+  children,
+  className,
+  ...props
+}: BreadcrumbSeparatorProps) => (
+  <span
+    role="presentation"
+    aria-hidden="true"
+    className={cn("text-muted-foreground dark:text-gray-500 opacity-70", className)}
+    {...props}
+  >
+    {children || <ChevronRight className="h-3.5 w-3.5" />}
+  </span>
+);
+MoonUIBreadcrumbSeparatorPro.displayName = "BreadcrumbSeparatorPro";
+
+const MoonUIBreadcrumbEllipsisPro = ({
+  className,
+  ...props
+}: BreadcrumbEllipsisProps) => (
+  <span
+    role="presentation"
+    aria-hidden="true"
+    className={cn("flex items-center text-muted-foreground dark:text-gray-500 dark:hover:text-gray-400 transition-colors duration-200", className)}
+    {...props}
+  >
+    <MoreHorizontal className="h-4 w-4" />
+    <span className="sr-only">More pages</span>
+  </span>
+);
+MoonUIBreadcrumbEllipsisPro.displayName = "BreadcrumbEllipsisPro";
+
+const MoonUIBreadcrumbLinkPro = React.forwardRef<HTMLAnchorElement, React.AnchorHTMLAttributes<HTMLAnchorElement>>(
+  ({ className, href, ...props }, ref) => (
+    <a
+      ref={ref}
+      href={href}
+      className={cn(
+        "transition-colors duration-200 hover:text-foreground text-muted-foreground hover:underline hover:underline-offset-4 hover:decoration-gray-300/30 dark:text-gray-400 dark:hover:text-gray-200",
+        className
+      )}
+      {...props}
+    />
+  )
+);
+MoonUIBreadcrumbLinkPro.displayName = "BreadcrumbLinkPro";
+
+const MoonUIBreadcrumbPagePro = React.forwardRef<HTMLSpanElement, React.HTMLAttributes<HTMLSpanElement>>(
+  ({ className, ...props }, ref) => (
+    <span
+      ref={ref}
+      className={cn(
+        "font-medium text-foreground dark:text-white dark:text-opacity-95",
+        className
+      )}
+      {...props}
+    />
+  )
+);
+MoonUIBreadcrumbPagePro.displayName = "BreadcrumbPagePro";
+
+
+// Internal aliases for Pro component usage
+export const breadcrumbVariantsInternal = MoonUIbreadcrumbVariantsPro
+export const BreadcrumbInternal = MoonUIBreadcrumbPro
+export const BreadcrumbListInternal = MoonUIBreadcrumbListPro
+export const childrenArrayInternal = MoonUIchildrenArrayPro
+export const childCountInternal = MoonUIchildCountPro
+export const firstItemInternal = MoonUIfirstItemPro
+export const middleItemsInternal = MoonUImiddleItemsPro
+export const lastTwoItemsInternal = MoonUIlastTwoItemsPro
+export const BreadcrumbItemInternal = MoonUIBreadcrumbItemPro
+export const CompInternal = MoonUICompPro
+export const itemPropsInternal = MoonUIitemPropsPro
+export const BreadcrumbSeparatorInternal = MoonUIBreadcrumbSeparatorPro
+export const BreadcrumbEllipsisInternal = MoonUIBreadcrumbEllipsisPro
+export const BreadcrumbLinkInternal = MoonUIBreadcrumbLinkPro
+export const BreadcrumbPageInternal = MoonUIBreadcrumbPagePro
+
+// Pro exports  
+export { MoonUIbreadcrumbVariantsPro, MoonUIBreadcrumbPro, MoonUIBreadcrumbListPro, MoonUIchildrenArrayPro, MoonUIchildCountPro, MoonUIfirstItemPro, MoonUImiddleItemsPro, MoonUIlastTwoItemsPro, MoonUIBreadcrumbItemPro, MoonUICompPro, MoonUIitemPropsPro, MoonUIBreadcrumbSeparatorPro, MoonUIBreadcrumbEllipsisPro, MoonUIBreadcrumbLinkPro, MoonUIBreadcrumbPagePro }
+
+// Clean exports (without MoonUI prefix for easier usage)
+export { MoonUIbreadcrumbVariantsPro as breadcrumbVariants, MoonUIBreadcrumbPro as Breadcrumb, MoonUIBreadcrumbListPro as BreadcrumbList, MoonUIchildrenArrayPro as childrenArray, MoonUIchildCountPro as childCount, MoonUIfirstItemPro as firstItem, MoonUImiddleItemsPro as middleItems, MoonUIlastTwoItemsPro as lastTwoItems, MoonUIBreadcrumbItemPro as BreadcrumbItem, MoonUICompPro as Comp, MoonUIitemPropsPro as itemProps, MoonUIBreadcrumbSeparatorPro as BreadcrumbSeparator, MoonUIBreadcrumbEllipsisPro as BreadcrumbEllipsis, MoonUIBreadcrumbLinkPro as BreadcrumbLink, MoonUIBreadcrumbPagePro as BreadcrumbPage };

package/src/components/ui/checkbox.tsx

@@ -255,5 +255,5 @@ MoonUICheckboxWithLabel.displayName = "CheckboxWithLabel";
 
 export { MoonUICheckboxPro, CheckboxGroup, CheckboxLabel, CheckboxWithLabel  };
 
-// Backward compatibility exports
-export { MoonUICheckboxPro as Checkbox, MoonUILabelPro as Label };
+// Clean exports (only checkbox specific)
+export { MoonUICheckboxPro as Checkbox };