@moontra/moonui-pro 2.20.1 → 2.20.3

package/src/components/ui/table.tsx

@@ -1,329 +0,0 @@
-import * as React from "react";
-import { cva, type VariantProps } from "class-variance-authority";
-
-import { cn } from "../../lib/utils";
-
-export type SortDirection = "asc" | "desc" | null;
-
-const MoonUItableVariantsPro = cva(
-  "w-full caption-bottom text-sm",
-  {
-    variants: {
-      variant: {
-        default: "dark:text-gray-200",
-        bordered: "border border-border dark:border-gray-700",
-        striped: "dark:text-gray-200",
-        card: "border border-border dark:border-gray-700 rounded-md shadow-sm dark:shadow-gray-900/20",
-        minimal: "border-none dark:text-gray-200",
-      },
-      size: {
-        sm: "text-xs",
-        default: "text-sm",
-        lg: "text-base",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  }
-);
-
-export interface ColumnDefinition<T> {
-  id: string;
-  header: React.ReactNode;
-  accessorKey?: keyof T;
-  cell?: (row: T) => React.ReactNode;
-  sortable?: boolean;
-}
-
-interface TableProps<T>
-  extends React.HTMLAttributes<HTMLTableElement>,
-    VariantProps<typeof MoonUItableVariantsPro> {
-  /** Veri yükleniyor durumunu gösterir */
-  loading?: boolean;
-  /** Sıralama için kullanılan sütun */
-  sortColumn?: string;
-  /** Sıralama yönü */
-  sortDirection?: SortDirection;
-  /** Sıralama değiştiğinde çağrılacak fonksiyon */
-  onSortChange?: (column: string, direction: SortDirection) => void;
-  /** Boş durum için özel içerik */
-  emptyContent?: React.ReactNode;
-  /** Seçili satır id'leri */
-  selectedRowIds?: string[];
-  /** Satır seçim değiştiğinde çağrılacak fonksiyon */
-  onRowSelectionChange?: (selectedRowIds: string[]) => void;
-  /** Satır seçim devre dışı */
-  disableRowSelection?: boolean;
-  /** Her satır için benzersiz id çıkarma fonksiyonu */
-  getRowId?: (row: T) => string;
-}
-
-// Tip parametresiz Table bileşeni için varsayılan tip, herhangi bir veri tipini kabul edebilmesi için
-const MoonUITablePro = React.forwardRef<
-  HTMLTableElement,
-  TableProps<unknown>
->(({ 
-  className, 
-  variant, 
-  size, 
-  loading, 
-  emptyContent,
-  // Kullanılmayan özellikleri yoruma alarak lint uyarılarını önlüyoruz
-  // sortColumn,
-  // sortDirection,
-  // onSortChange,
-  // selectedRowIds,
-  // onRowSelectionChange,
-  // disableRowSelection,
-  // getRowId,
-  ...props 
-}, ref) => {
-  // Apply striped styles to the tbody via a class name
-  const MoonUIstripedPro = variant === "striped";
-  
-  // Çocukları güvenli bir şekilde işle ve tip kontrollerini doğru yap
-  const MoonUIchildrenWithPropsPro = React.Children.map(props.children, (child) => {
-    if (React.isValidElement(child)) {
-      if (child.type === "tbody") {
-        // Tip güvenliği için props'ları düzgün şekilde ele alıyoruz
-        const MoonUItbodyPropsPro = child.props as Record<string, unknown>;
-        return React.cloneElement(child as React.ReactElement<React.HTMLAttributes<HTMLTableSectionElement>>, {
-          className: cn(MoonUItbodyPropsPro.className as string | undefined, MoonUIstripedPro && "even:[&>tr]:bg-muted/50")
-        });
-      }
-    }
-    return child;
-  });
-  
-  return (
-    <div className="relative w-full overflow-auto">
-      {/* Yükleniyor durumu için overlay */}
-      {loading && (
-        <div className="absolute inset-0 bg-background/60 flex items-center justify-center z-10">
-          <div className="h-8 w-8 animate-spin rounded-full border-2 border-primary border-t-transparent"></div>
-        </div>
-      )}
-      
-      <table
-        ref={ref}
-        className={cn(
-          MoonUItableVariantsPro({ variant, size }),
-          loading && "opacity-70",
-          className
-        )}
-        {...props}
-      >
-        {MoonUIchildrenWithPropsPro}
-      </table>
-      
-    </div>
-  );
-});
-MoonUITablePro.displayName = "TablePro";
-
-const MoonUITableHeaderPro = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
-));
-MoonUITableHeaderPro.displayName = "TableHeaderPro";
-
-interface TableBodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {
-  /** Veri yoksa gösterilecek boş durum içeriği */
-  emptyContent?: React.ReactNode;
-  /** Varsayılan boş durum mesajı */
-  emptyMessage?: string;
-}
-
-const MoonUITableBodyPro = React.forwardRef<
-  HTMLTableSectionElement,
-  TableBodyProps
->(({ className, emptyContent, emptyMessage = "No data available", children, ...props }, ref) => {
-  // Çocuk elementlerin varlığını kontrol et
-  const MoonUIhasChildrenPro = React.Children.count(children) > 0;
-  
-  return (
-    <tbody
-      ref={ref}
-      className={cn("[&_tr:last-child]:border-0", className)}
-      {...props}
-    >
-      {MoonUIhasChildrenPro ? (
-        children
-      ) : (
-        <tr>
-          <td colSpan={100} className="h-24 text-center">
-            {emptyContent || (
-              <div className="py-6 text-muted-foreground">
-                <div className="text-sm">
-                  {emptyMessage}
-                </div>
-              </div>
-            )}
-          </td>
-        </tr>
-      )}
-    </tbody>
-  )
-});
-MoonUITableBodyPro.displayName = "TableBodyPro";
-
-const MoonUITableFooterPro = React.forwardRef<
-  HTMLTableSectionElement,
-  React.HTMLAttributes<HTMLTableSectionElement>
->(({ className, ...props }, ref) => (
-  <tfoot
-    ref={ref}
-    className={cn("bg-primary text-primary-foreground font-medium", className)}
-    {...props}
-  />
-));
-MoonUITableFooterPro.displayName = "TableFooterPro";
-
-const MoonUITableRowPro = React.forwardRef<
-  HTMLTableRowElement,
-  React.HTMLAttributes<HTMLTableRowElement>
->(({ className, ...props }, ref) => (
-  <tr
-    ref={ref}
-    className={cn(
-      "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
-      className
-    )}
-    {...props}
-  />
-));
-MoonUITableRowPro.displayName = "TableRowPro";
-
-interface TableHeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
-  /** Bu sütun için sıralama durumu */
-  sortable?: boolean;
-  /** Bu sütunun sıralanma durumu */
-  sorted?: SortDirection;
-  /** Sıralama değiştiğinde çağrılacak fonksiyon */
-  onSort?: () => void;
-}
-
-const MoonUITableHeadPro = React.forwardRef<HTMLTableCellElement, TableHeadProps>(
-  ({ className, sortable, sorted, onSort, children, ...props }, ref) => {
-    // Sıralama için simgeler
-    const MoonUIrenderSortIconPro = () => {
-      if (!sortable) return null;
-      
-      if (sorted === "asc") {
-        return (
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            className="ml-1 h-4 w-4 inline-block"
-            viewBox="0 0 20 20"
-            fill="currentColor"
-          >
-            <path
-              fillRule="evenodd"
-              d="M14.707 10.293a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 111.414-1.414L9 12.586V5a1 1 0 012 0v7.586l2.293-2.293a1 1 0 011.414 0z"
-              clipRule="evenodd"
-            />
-          </svg>
-        );
-      }
-      
-      if (sorted === "desc") {
-        return (
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            className="ml-1 h-4 w-4 inline-block"
-            viewBox="0 0 20 20"
-            fill="currentColor"
-          >
-            <path
-              fillRule="evenodd"
-              d="M5.293 9.707a1 1 0 010-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L11 7.414V15a1 1 0 11-2 0V7.414L6.707 9.707a1 1 0 01-1.414 0z"
-              clipRule="evenodd"
-            />
-          </svg>
-        );
-      }
-      
-      return (
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          className="ml-1 h-4 w-4 inline-block opacity-30"
-          viewBox="0 0 20 20"
-          fill="currentColor"
-        >
-          <path
-            fillRule="evenodd"
-            d="M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z"
-            clipRule="evenodd"
-          />
-        </svg>
-      );
-    };
-    
-    return (
-      <th
-        ref={ref}
-        className={cn(
-          "h-10 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
-          sortable && "cursor-pointer hover:text-foreground select-none",
-          className
-        )}
-        onClick={sortable ? onSort : undefined}
-        {...props}
-      >
-        <div className="flex items-center">
-          {children}
-          {sortable && MoonUIrenderSortIconPro()}
-        </div>
-      </th>
-    );
-  }
-);
-MoonUITableHeadPro.displayName = "TableHeadPro";
-
-const MoonUITableCellPro = React.forwardRef<
-  HTMLTableCellElement,
-  React.TdHTMLAttributes<HTMLTableCellElement>
->(({ className, ...props }, ref) => (
-  <td
-    ref={ref}
-    className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
-    {...props}
-  />
-));
-MoonUITableCellPro.displayName = "TableCellPro";
-
-const MoonUITableCaptionPro = React.forwardRef<
-  HTMLTableCaptionElement,
-  React.HTMLAttributes<HTMLTableCaptionElement>
->(({ className, ...props }, ref) => (
-  <caption
-    ref={ref}
-    className={cn("mt-4 text-sm text-muted-foreground", className)}
-    {...props}
-  />
-));
-MoonUITableCaptionPro.displayName = "TableCaptionPro";
-
-
-// Internal aliases for Pro component usage
-export const tableVariantsInternal = MoonUItableVariantsPro
-export const TableInternal = MoonUITablePro
-export const TableHeaderInternal = MoonUITableHeaderPro
-export const TableBodyInternal = MoonUITableBodyPro
-export const TableFooterInternal = MoonUITableFooterPro
-export const TableRowInternal = MoonUITableRowPro
-export const TableHeadInternal = MoonUITableHeadPro
-export const TableCellInternal = MoonUITableCellPro
-export const TableCaptionInternal = MoonUITableCaptionPro
-
-// Pro exports  
-export { MoonUItableVariantsPro, MoonUITablePro, MoonUITableHeaderPro, MoonUITableBodyPro, MoonUITableFooterPro, MoonUITableRowPro, MoonUITableHeadPro, MoonUITableCellPro, MoonUITableCaptionPro }
-
-// Clean exports (without MoonUI prefix for easier usage)
-export { MoonUItableVariantsPro as tableVariants, MoonUITablePro as Table, MoonUITableHeaderPro as TableHeader, MoonUITableBodyPro as TableBody, MoonUITableFooterPro as TableFooter, MoonUITableRowPro as TableRow, MoonUITableHeadPro as TableHead, MoonUITableCellPro as TableCell, MoonUITableCaptionPro as TableCaption };
-
-export type { TableBodyProps };

package/src/components/ui/tabs.tsx

@@ -1,198 +0,0 @@
-import * as React from "react";
-import * as TabsPrimitive from "@radix-ui/react-tabs";
-import { cva, type VariantProps } from "class-variance-authority";
-
-import { cn } from "../../lib/utils";
-
-/* -------------------------------------------------------------------------------------------------
- * Tabs Root
- * -----------------------------------------------------------------------------------------------*/
-interface MoonUITabsProProps extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> {
-  /** Mobil görünümde dikey düzen için */
-  vertical?: boolean;
-}
-
-const MoonUITabsPro = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Root>,
-  MoonUITabsProProps
->(({ vertical = false, ...props }, ref) => (
-  <TabsPrimitive.Root
-    ref={ref}
-    orientation={vertical ? "vertical" : "horizontal"}
-    {...props}
-  />
-));
-
-MoonUITabsPro.displayName = TabsPrimitive.Root.displayName;
-
-/* -------------------------------------------------------------------------------------------------
- * TabsList
- * -----------------------------------------------------------------------------------------------*/
-const tabsListVariants = cva(
-  "flex items-center justify-start transition-all duration-200",
-  {
-    variants: {
-      variant: {
-        default: "bg-muted rounded-md p-1 text-muted-foreground dark:bg-gray-800/80 dark:text-gray-400",
-        pills: "bg-transparent gap-2 p-0 dark:text-gray-400", 
-        underline: "bg-transparent border-b border-border dark:border-gray-700 gap-4 dark:text-gray-400",
-        cards: "bg-transparent gap-2 p-0 dark:text-gray-400",
-        minimal: "bg-transparent gap-1 p-0 dark:text-gray-400",
-      },
-      orientation: {
-        horizontal: "flex-row",
-        vertical: "flex-col items-start gap-1"
-      },
-      fullWidth: {
-        true: "w-full"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      orientation: "horizontal",
-      fullWidth: false
-    }
-  }
-);
-
-interface MoonUITabsListProProps 
-  extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>,
-    VariantProps<typeof tabsListVariants> {
-  /** Dikey düzende göster */
-  orientation?: "horizontal" | "vertical";
-}
-
-const MoonUITabsListPro = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.List>,
-  MoonUITabsListProProps
->(({ className, variant, orientation, fullWidth, ...props }, ref) => (
-  <TabsPrimitive.List
-    ref={ref}
-    className={cn(tabsListVariants({ variant, orientation, fullWidth, className }))}
-    {...props}
-  />
-));
-
-MoonUITabsListPro.displayName = TabsPrimitive.List.displayName;
-
-/* -------------------------------------------------------------------------------------------------
- * TabsTrigger
- * -----------------------------------------------------------------------------------------------*/
-const tabsTriggerVariants = cva(
-  "inline-flex items-center justify-center whitespace-nowrap font-medium ring-offset-background transition-all duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
-  {
-    variants: {
-      variant: {
-        default: "rounded-md data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm dark:data-[state=active]:bg-gray-900 dark:data-[state=active]:text-gray-100 dark:data-[state=active]:shadow-gray-950/10",
-        underline: "rounded-none border-b-2 border-transparent pb-2 data-[state=active]:border-primary data-[state=active]:bg-transparent data-[state=active]:text-foreground dark:data-[state=active]:border-primary/80 dark:data-[state=active]:text-gray-100",
-        pills: "rounded-full bg-muted hover:bg-muted/80 data-[state=active]:bg-primary data-[state=active]:text-primary-foreground dark:bg-gray-800 dark:hover:bg-gray-700 dark:data-[state=active]:bg-primary/90 dark:data-[state=active]:text-white",
-        cards: "rounded-md bg-muted/50 hover:bg-muted data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-md dark:bg-gray-800/50 dark:hover:bg-gray-700/50 dark:data-[state=active]:bg-gray-900 dark:data-[state=active]:text-gray-100 dark:data-[state=active]:shadow-gray-950/20",
-        minimal: "rounded-sm bg-transparent hover:bg-muted/30 data-[state=active]:bg-transparent data-[state=active]:text-foreground data-[state=active]:underline data-[state=active]:underline-offset-4 dark:hover:bg-gray-800/30 dark:data-[state=active]:text-gray-200",
-      },
-      size: {
-        sm: "h-7 px-2 text-xs",
-        md: "h-9 px-3 py-1.5 text-sm",
-        lg: "h-10 px-4 py-2 text-base",
-      },
-      orientation: {
-        horizontal: "",
-        vertical: "justify-start w-full text-left"
-      },
-      fullWidth: {
-        true: "w-full"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "md",
-      orientation: "horizontal",
-      fullWidth: false
-    }
-  }
-);
-
-interface MoonUITabsTriggerProProps
-  extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>,
-    VariantProps<typeof tabsTriggerVariants> {
-  /** İkon konumu */
-  iconPosition?: "left" | "right" | "none";
-  /** İkon */
-  icon?: React.ReactNode;
-  /** Badge içeriği */
-  badge?: React.ReactNode;
-  /** Aktif olmayan durumda yarı saydam */
-  fadeTabs?: boolean;
-  /** Dikey düzende göster */
-  orientation?: "horizontal" | "vertical";
-}
-
-const MoonUITabsTriggerPro = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Trigger>,
-  MoonUITabsTriggerProProps
->(({ 
-  className, 
-  variant, 
-  size, 
-  icon, 
-  iconPosition = "left", 
-  badge,
-  fadeTabs = false,
-  orientation,
-  fullWidth,
-  children, 
-  ...props 
-}, ref) => (
-  <TabsPrimitive.Trigger
-    ref={ref}
-    className={cn(
-      tabsTriggerVariants({ variant, size, orientation, fullWidth }),
-      fadeTabs && "data-[state=inactive]:opacity-60",
-      className
-    )}
-    {...props}
-  >
-    {icon && iconPosition === "left" && (
-      <span className="mr-2">{icon}</span>
-    )}
-    {children}
-    {icon && iconPosition === "right" && (
-      <span className="ml-2">{icon}</span>
-    )}
-    {badge && (
-      <span className="ml-2">{badge}</span>
-    )}
-  </TabsPrimitive.Trigger>
-));
-
-MoonUITabsTriggerPro.displayName = TabsPrimitive.Trigger.displayName;
-
-/* -------------------------------------------------------------------------------------------------
- * TabsContent
- * -----------------------------------------------------------------------------------------------*/
-interface MoonUITabsContentProProps 
-  extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content> {
-  /** İçerik animasyonu */
-  animated?: boolean;
-}
-
-const MoonUITabsContentPro = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Content>,
-  MoonUITabsContentProProps
->(({ className, animated = false, ...props }, ref) => (
-  <TabsPrimitive.Content
-    ref={ref}
-    className={cn(
-      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-      animated && "data-[state=active]:animate-fadeIn data-[state=inactive]:animate-fadeOut",
-      className
-    )}
-    {...props}
-  />
-));
-
-MoonUITabsContentPro.displayName = TabsPrimitive.Content.displayName;
-
-export { MoonUITabsPro, MoonUITabsListPro, MoonUITabsTriggerPro, MoonUITabsContentPro  };
-
-// Backward compatibility exports
-export { MoonUITabsPro as Tabs, MoonUITabsListPro as TabsList, MoonUITabsTriggerPro as TabsTrigger, MoonUITabsContentPro as TabsContent };

package/src/components/ui/textarea.tsx

@@ -1,28 +0,0 @@
-"use client"
-
-import React from "react"
-import { cn } from "../../lib/utils"
-
-export interface MoonUITextareaProProps
-  extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
-
-const MoonUITextareaPro = React.forwardRef<HTMLTextAreaElement, MoonUITextareaProProps>(
-  ({ className, ...props }, ref) => {
-    return (
-      <textarea
-        className={cn(
-          "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-          className
-        )}
-        ref={ref}
-        {...props}
-      />
-    )
-  }
-)
-MoonUITextareaPro.displayName = "MoonUITextareaPro"
-
-export { MoonUITextareaPro  };
-
-// Backward compatibility exports
-export { MoonUITextareaPro as Textarea }