@moontra/moonui 6.6.0 → 6.7.0

package/package.json

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

package/src/components/ui/__tests__/dead-code-group-b.test.tsx

@@ -0,0 +1,105 @@
+import { render, screen, waitFor } from '@testing-library/react'
+import * as React from 'react'
+import { Popover, PopoverTrigger, PopoverContent } from '../popover'
+import { Progress } from '../progress'
+import { Card } from '../card'
+import { Accordion, AccordionItem, AccordionTrigger } from '../accordion'
+import '@testing-library/jest-dom'
+
+/**
+ * Kalite grubu B — "deklare edilmiş ama çalışmıyor" sınıfı (#307/#310/#316/#318).
+ *
+ * Bu suite ÖLÜ SINIF/PROP'ların geri gelmesini engeller. Ölü sınıf sinsi bir
+ * regresyondur: kod niyeti taşır, tsc geçer, test yazılmamışsa kimse fark etmez.
+ */
+
+describe('#316 popover — `side` Radix\'e gerçekten ulaşıyor', () => {
+  it('side="right" verilince içerik data-side="right" taşır', async () => {
+    render(
+      <Popover defaultOpen>
+        <PopoverTrigger>aç</PopoverTrigger>
+        <PopoverContent side="right">içerik</PopoverContent>
+      </Popover>
+    )
+    // ÖNCESİ: `side` yalnız CVA className seçiyordu, Radix'e hiç geçmiyordu →
+    // data-side her zaman varsayılan "bottom" kalıyordu.
+    await waitFor(() => {
+      const content = screen.getByText('içerik')
+      expect(content).toHaveAttribute('data-side', 'right')
+    })
+  })
+
+  it('side verilmezse Radix varsayılanı korunur', async () => {
+    render(
+      <Popover defaultOpen>
+        <PopoverTrigger>aç</PopoverTrigger>
+        <PopoverContent>içerik</PopoverContent>
+      </Popover>
+    )
+    await waitFor(() => {
+      expect(screen.getByText('içerik')).toHaveAttribute('data-side', 'bottom')
+    })
+  })
+
+  it('overlayBackdrop ÖLÜ OLMAYAN bir zemin sınıfı basar', async () => {
+    const { container } = render(
+      <Popover defaultOpen>
+        <PopoverTrigger>aç</PopoverTrigger>
+        <PopoverContent overlayBackdrop>içerik</PopoverContent>
+      </Popover>
+    )
+    const backdrop = container.querySelector('.fixed.inset-0')
+    expect(backdrop).toBeTruthy()
+    // ÖNCESİ: `bg-overlay` — `overlay` diye bir renk tanımlı olmadığı için
+    // Tailwind hiç CSS üretmiyordu, backdrop sessizce görünmezdi.
+    expect(backdrop!.className).not.toContain('bg-overlay')
+    expect(backdrop!.className).toContain('bg-black/50')
+  })
+})
+
+describe('#318 progress — `variant` dolguya da uygulanıyor', () => {
+  const fill = (c: HTMLElement) => c.querySelector('[class*="bg-"][style*="transform"], [class*="bg-success"], [class*="bg-warning"]')
+
+  it('variant="success" dolguyu da yeşile boyar', () => {
+    const { container } = render(<Progress value={50} variant="success" />)
+    // ÖNCESİ: track bg-success/20 olurken dolgu sabit "primary" kalıyordu.
+    const hasSuccessFill = container.innerHTML.includes('bg-success"') ||
+      /class="[^"]*\bbg-success\b[^"]*"/.test(container.innerHTML)
+    expect(hasSuccessFill).toBe(true)
+  })
+
+  it('indicatorVariant açıkça verilince variant\'ı EZER', () => {
+    const { container } = render(
+      <Progress value={50} variant="success" indicatorVariant="warning" />
+    )
+    expect(/\bbg-warning\b/.test(container.innerHTML)).toBe(true)
+  })
+
+  it('ikisi de verilmezse primary varsayılanı korunur', () => {
+    const { container } = render(<Progress value={50} />)
+    expect(/\bbg-primary\b/.test(container.innerHTML)).toBe(true)
+  })
+})
+
+describe('#307/#310 — ölü sınıflar kaldırıldı', () => {
+  it('accordion tetikleyicisi ölü `text-primary-400` taşımaz', () => {
+    render(
+      <Accordion type="single" collapsible>
+        <AccordionItem value="a">
+          <AccordionTrigger>başlık</AccordionTrigger>
+        </AccordionItem>
+      </Accordion>
+    )
+    const el = screen.getByText('başlık').closest('button') ?? screen.getByText('başlık')
+    expect(el.className).not.toContain('primary-400')
+    // hover:text-primary korunmalı — her iki temada çalışır
+    expect(el.className).toContain('hover:text-primary')
+  })
+
+  it('card elevated varyantı ölü `gray-850` taşımaz', () => {
+    const { container } = render(<Card variant="elevated">içerik</Card>)
+    const card = container.firstElementChild as HTMLElement
+    expect(card.className).not.toContain('gray-850')
+    expect(card.className).toContain('dark:bg-card')
+  })
+})

package/src/components/ui/accordion.tsx

@@ -6,6 +6,12 @@ import { ChevronDown } from "lucide-react"
 
 import { cn } from "../../lib/utils"
 
+// #307: `dark:hover:text-primary-400` ÖLÜ SINIFTI — tailwind-preset'te `primary`
+// yalnız DEFAULT+foreground içeriyor, `400` ölçeği SADECE `brand` ailesinde tanımlı.
+// Sınıf hiç CSS üretmiyordu, yani karanlık modda hover rengi işlevsizdi.
+// Kaldırıldı: `hover:text-primary` zaten yeterli — `--primary` hem :root hem .dark
+// bloğunda tanımlı olduğu için her iki temada doğru rengi verir.
+
 const Accordion = AccordionPrimitive.Root
 
 const AccordionItem = React.forwardRef<
@@ -29,7 +35,7 @@ const AccordionTrigger = React.forwardRef<
       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",
+        "hover:underline hover:text-primary",
         "[&[data-state=open]>svg]:rotate-180",
         className
       )}

package/src/components/ui/card.tsx

@@ -6,6 +6,22 @@ import { motion, type HTMLMotionProps } from "framer-motion";
 import { cn } from "../../lib/utils";
 import { microInteractionVariants, hoverAnimations, tapAnimations } from "@/lib/micro-interactions";
 
+// #310: `dark:bg-gray-850` ÖLÜ SINIFTI — Tailwind gri ölçeğinde 850 basamağı yok
+// (50…800, 900, 950) ve preset de eklemiyor. `elevated` varyantının karanlık zemini
+// hiç uygulanmıyordu; kart kökün `dark:bg-gray-900` değerinde kalıyordu.
+// Semantik `bg-card` token'ına bağlandı.
+//
+// NOT — `size` ve `asChild` (aynı issue'da raporlandı) BİLİNÇLİ olarak
+// değiştirilmedi, ayrı gerekçelerle:
+//   • `size`: CVA'da dört değerin dördü de boş string ve `compoundVariants` YOK
+//     (separator'ın aksine gizli bir çalışma yolu yok). Doğal hedefi de yok —
+//     padding kökte değil CardHeader/Content/Footer'ın kendi `p-6`'sında. Anlamlı
+//     kılmak alt-component'lerin padding'ini yeniden tasarlamak demek: görsel
+//     değişim + API kararı, bu PR'ın kapsamı dışı.
+//   • `asChild`: yalnız tipte var, gövdede hiç okunmuyor. Gerçekten uygulamak
+//     Radix `Slot` bağımlılığı + child-tek-eleman sözleşmesi demek.
+// İkisi de #310'da açık kalıyor; bu PR ölü SINIF kısmını kapatıyor.
+
 const cardVariants = cva(
   "rounded-lg border bg-card text-card-foreground shadow-sm dark:shadow-gray-900/20 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-100 transition-all duration-200",
   {
@@ -14,7 +30,7 @@ const cardVariants = cva(
         default: "",
         outline: "border border-border shadow-none bg-transparent dark:border-gray-700 dark:bg-transparent dark:text-gray-200",
         filled: "border-none bg-secondary dark:bg-gray-800 dark:text-gray-100 dark:shadow-inner dark:shadow-gray-950/10",
-        elevated: "border-none shadow-md dark:shadow-lg dark:shadow-gray-900/30 dark:bg-gray-850 dark:text-gray-100",
+        elevated: "border-none shadow-md dark:shadow-lg dark:shadow-gray-900/30 dark:bg-card dark:text-gray-100",
         gradient: "border-none bg-gradient-to-br from-primary/5 to-primary/10 dark:from-primary/10 dark:to-primary/20",
         glass: "border border-white/20 bg-white/10 backdrop-blur-md dark:border-gray-700/30 dark:bg-gray-800/10",
       },

package/src/components/ui/popover.tsx

@@ -68,7 +68,7 @@ const PopoverTrigger = PopoverPrimitive.Trigger;
 const PopoverAnchor = PopoverPrimitive.Anchor;
 
 export interface PopoverContentProps 
-  extends Omit<React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>, 'side'>,
+  extends React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>,
     VariantProps<typeof popoverContentVariants> {
   /**
    * Popover'ın arka plan bulanıklığı etkin mi
@@ -103,10 +103,20 @@ const PopoverContent = React.forwardRef<
 }, ref) => (
   <>
     {overlayBackdrop && (
-      <div className="fixed inset-0 z-40 bg-overlay opacity-30" />
+      <div
+          /* #316: `bg-overlay` ÖLÜ SINIFTI — `overlay` adında bir renk ne
+             tailwind-preset.js'te ne tokens.css'te tanımlı (ikisinde de 0 geçiş).
+             Sınıf hiç CSS üretmiyordu, yani `overlayBackdrop` sessizce kapalıydı. */
+          className="fixed inset-0 z-40 bg-black/50"
+        />
     )}
     <PopoverPrimitive.Content
       ref={ref}
+      /* #316: `side` yalnız CVA'da animasyon sınıfı seçiyordu, Radix'e HİÇ
+         ulaşmıyordu — konumlandırma prop'u fiilen işlevsizdi. Artık gerçekten
+         geçiriliyor; CVA'daki `data-[side=…]` animasyonları da ancak bu öznitelik
+         basıldığında eşleşiyor. */
+      side={side}
       sideOffset={sideOffset}
       collisionPadding={8}
       onInteractOutside={(e) => {

package/src/components/ui/progress.tsx

@@ -5,6 +5,11 @@ import { cva, type VariantProps } from "class-variance-authority";
 
 import { cn } from "../../lib/utils";
 
+// #318: `variant` TRACK'i boyuyordu, dolguyu ise bağımsız `indicatorVariant`
+// boyuyordu ve varsayılanı sabit "primary" idi. Sonuç: `<Progress variant="success" />`
+// yeşil track + MAVİ dolgu üretiyordu — deklare edilen varyant dolguya hiç ulaşmıyordu.
+// Artık `indicatorVariant` verilmezse `variant`e düşer; açıkça verildiğinde yine ezer.
+
 /**
  * Progress Bileşeni
  *
@@ -164,7 +169,7 @@ const Progress = React.forwardRef<
       >
         <div
           className={cn(
-            progressIndicatorVariants({ variant: indicatorVariant || "primary", animation }),
+            progressIndicatorVariants({ variant: indicatorVariant ?? variant ?? "primary", animation }),
             indeterminate && "animate-indeterminate-progress"
           )}
           style={indeterminate ? {} : { transform: `translateX(-${100 - percentage}%)` }}