@moontra/moonui-pro 2.20.2 → 2.20.3

package/src/components/ui/spotlight-card.tsx

@@ -1,119 +0,0 @@
-"use client";
-
-import * as React from "react";
-import { motion, useMotionValue, useSpring } from "framer-motion";
-import { cn } from "../../lib/utils";
-
-export interface SpotlightCardProps extends React.HTMLAttributes<HTMLDivElement> {
-  children: React.ReactNode;
-  spotlightColor?: string;
-  spotlightSize?: number;
-  spotlightIntensity?: number;
-  borderRadius?: string;
-}
-
-const SpotlightCard = React.forwardRef<HTMLDivElement, SpotlightCardProps>(
-  (
-    {
-      children,
-      className,
-      spotlightColor = "rgba(255, 255, 255, 0.15)",
-      spotlightSize = 400,
-      spotlightIntensity = 0.5,
-      borderRadius = "0.5rem",
-      style,
-      ...props
-    },
-    ref
-  ) => {
-    const cardRef = React.useRef<HTMLDivElement>(null);
-    const mouseX = useMotionValue(0);
-    const mouseY = useMotionValue(0);
-
-    const springConfig = { damping: 20, stiffness: 300 };
-    const spotlightX = useSpring(mouseX, springConfig);
-    const spotlightY = useSpring(mouseY, springConfig);
-
-    const handleMouseMove = React.useCallback(
-      (e: React.MouseEvent<HTMLDivElement>) => {
-        if (!cardRef.current) return;
-
-        const rect = cardRef.current.getBoundingClientRect();
-        const x = e.clientX - rect.left;
-        const y = e.clientY - rect.top;
-
-        mouseX.set(x);
-        mouseY.set(y);
-      },
-      [mouseX, mouseY]
-    );
-
-    const handleMouseLeave = React.useCallback(() => {
-      // Optionally fade out the spotlight on mouse leave
-      // For now, we'll keep it at the last position
-    }, []);
-
-    return (
-      <motion.div
-        ref={(el) => {
-          cardRef.current = el;
-          if (ref) {
-            if (typeof ref === "function") ref(el);
-            else ref.current = el;
-          }
-        }}
-        className={cn(
-          "relative overflow-hidden bg-card text-card-foreground",
-          className
-        )}
-        style={{
-          borderRadius,
-          ...style,
-        }}
-        onMouseMove={handleMouseMove}
-        onMouseLeave={handleMouseLeave}
-        whileHover={{ scale: 1.02 }}
-        transition={{ type: "spring", stiffness: 400, damping: 25 }}
-        {...(props as any)}
-      >
-        {/* Spotlight overlay */}
-        <motion.div
-          className="pointer-events-none absolute inset-0 opacity-0 transition-opacity duration-300 hover:opacity-100"
-          style={{
-            background: `radial-gradient(${spotlightSize}px circle at var(--x) var(--y), ${spotlightColor}, transparent ${spotlightIntensity * 100}%)`,
-            "--x": spotlightX,
-            "--y": spotlightY,
-          } as React.CSSProperties}
-        />
-
-        {/* Border glow effect */}
-        <motion.div
-          className="pointer-events-none absolute inset-0 opacity-0 transition-opacity duration-300 hover:opacity-100"
-          style={{
-            background: `radial-gradient(${spotlightSize * 1.5}px circle at var(--x) var(--y), ${spotlightColor}, transparent 40%)`,
-            "--x": spotlightX,
-            "--y": spotlightY,
-            filter: "blur(40px)",
-          } as React.CSSProperties}
-        />
-
-        {/* Card border */}
-        <div
-          className="absolute inset-0 rounded-[inherit] border border-border/50"
-          style={{
-            background: `radial-gradient(${spotlightSize * 2}px circle at var(--x) var(--y), rgba(255,255,255,0.1), transparent 40%)`,
-            "--x": spotlightX,
-            "--y": spotlightY,
-          } as React.CSSProperties}
-        />
-
-        {/* Content */}
-        <div className="relative z-10">{children}</div>
-      </motion.div>
-    );
-  }
-);
-
-SpotlightCard.displayName = "SpotlightCard";
-
-export { SpotlightCard };

package/src/components/ui/switch.tsx

@@ -1,86 +0,0 @@
-"use client"
-
-import * as React from "react"
-import * as SwitchPrimitives from "@radix-ui/react-switch"
-
-import { cn } from "../../lib/utils"
-
-type SwitchSize = "sm" | "md" | "lg";
-type SwitchVariant = "primary" | "success" | "warning" | "danger" | "secondary";
-
-export interface MoonUISwitchProProps extends React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> {
-  /** Switch boyutu */
-  size?: SwitchSize;
-  /** Switch renk varyantı */
-  variant?: SwitchVariant;
-  /** Yükleniyor durumunu gösterir */
-  loading?: boolean;
-  /** Sol tarafta gösterilecek ikon */
-  leftIcon?: React.ReactNode;
-  /** Sağ tarafta gösterilecek ikon */
-  rightIcon?: React.ReactNode;
-  /** Switch açıklaması */
-  description?: string;
-}
-
-const MoonUISwitchPro = React.forwardRef<
-  React.ElementRef<typeof SwitchPrimitives.Root>,
-  MoonUISwitchProProps
->(({ className, size = "md", variant = "primary", loading, leftIcon, rightIcon, description, ...props }, ref) => (
-  <div className="inline-flex items-center gap-2">
-    {leftIcon && <span className="text-muted-foreground">{leftIcon}</span>}
-    <SwitchPrimitives.Root
-      className={cn(
-        "peer relative inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 dark:data-[state=unchecked]:bg-gray-700/70 dark:focus-visible:ring-primary/40 dark:focus-visible:ring-offset-gray-950",
-        
-        // Boyutlar
-        size === "sm" && "h-4 w-8",
-        size === "md" && "h-6 w-11", 
-        size === "lg" && "h-7 w-14",
-        
-        // Varyantlar (checked durumunda)
-        variant === "primary" && "data-[state=checked]:bg-primary",
-        variant === "success" && "data-[state=checked]:bg-success",
-        variant === "warning" && "data-[state=checked]:bg-warning",
-        variant === "danger" && "data-[state=checked]:bg-error",
-        variant === "secondary" && "data-[state=checked]:bg-accent",
-        
-        // Unchecked durumu
-        "data-[state=unchecked]:bg-input",
-        
-        // Loading durumu
-        loading && "opacity-80 cursor-wait",
-        
-        className
-      )}
-      disabled={loading || props.disabled}
-      {...props}
-      ref={ref}
-    >
-      {loading ? (
-        <div className="absolute inset-0 flex items-center justify-center">
-          <div className="h-3 w-3 animate-spin rounded-full border-2 border-gray-300 border-t-primary"></div>
-        </div>
-      ) : null}
-      
-      <SwitchPrimitives.Thumb
-        className={cn(
-          "pointer-events-none block rounded-full bg-background shadow-lg ring-0 transition-transform",
-          // Boyuta göre thumb boyutları
-          size === "sm" && "h-3 w-3 data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0",
-          size === "md" && "h-5 w-5 data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0",
-          size === "lg" && "h-6 w-6 data-[state=checked]:translate-x-7 data-[state=unchecked]:translate-x-0",
-        )}
-      />
-    </SwitchPrimitives.Root>
-    {rightIcon && <span className="text-muted-foreground">{rightIcon}</span>}
-    {description && <span className="text-sm text-muted-foreground">{description}</span>}
-  </div>
-))
-MoonUISwitchPro.displayName = SwitchPrimitives.Root.displayName
-
-export { MoonUISwitchPro  };
-
-// Backward compatibility exports
-export { MoonUISwitchPro as Switch }
-export type { SwitchSize, SwitchVariant }

package/src/components/ui/table.tsx

@@ -1,331 +0,0 @@
-"use client"
-
-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 };