@moontra/moonui 6.19.0 → 6.19.2

package/dist/index.mjs

@@ -2548,10 +2548,70 @@ var sliderRangeVariants = cva(
         // tüketici --secondary-500'ü ezerek özelleştirebilir.
         // Regresyon: __tests__/slider-secondary-contrast.test.ts
         secondary: "bg-[rgb(var(--secondary-500))]",
-        accent: "bg-accent",
+        // #448 (#389/#407'nin `accent` kardeşi — ama ÇÖZÜM SINIFI farklı): range
+        // `bg-accent`, track `bg-accent/20` idi — aynı yüzey token'ının iki alfası.
+        // `--accent` HER İKİ temada da kusurluydu (warning/error'dan ağır: onlar
+        // yalnız light'ta kusurluydu): A ekseni light 1.123 · dark 1.303 · gerçek
+        // docs kartı (#111827) 1.162. Eşik 3:1 (WCAG 1.4.11 non-text).
+        //
+        // KÖK NEDEN: `--accent` bir YÜZEY token'ı — `hover:bg-accent` tinti olarak
+        // tasarlanmış ve iki temada da kendi zeminine BİTİŞİK duruyor (light
+        // rgb(235,239,245) beyaz üstünde, dark rgb(29,40,58) rgb(3,7,17) üstünde).
+        // Dolgu/kenarlık rolüne yapısal olarak uygun değil; bu yüzden track'i
+        // değiştirerek onarmak da MÜMKÜN DEĞİL (light'ta accent'ten 3:1 uzakta
+        // duran daha açık bir yüzey yok).
+        //
+        // #389'un tek-orta-ton kademe araması AYNEN uygulanamadı: tokens.css'te
+        // `--accent-50 … --accent-950` skalası YOK (skalası olan aileler:
+        // primary/secondary/success/warning/error/brand/brand-accent).
+        // `bg-accent-foreground` de elendi — `--accent-foreground` iki temada da
+        // `--primary` ile BİREBİR aynı değer (varyant primary klonuna dönerdi) ve
+        // 7 tema preset'inin 2'sinde beyaz (Creative/Nature), yani tek başına
+        // dolgu olamaz.
+        //
+        // ÇÖZÜM: sistemin TEK nötr skalası olan slate (`--secondary-*`) — `--accent`
+        // ile aynı hue ailesi (216° ↔ 215°), üstelik light temada `--accent` ile
+        // `--secondary` BİREBİR aynı token değerini taşıyor. Tema-kör tek kademe
+        // SEÇİLEMEDİ: bu ailede iki temayı birden geçen tek kademe 500'dür, o da
+        // `secondary` varyantının kendi rengi (ΔE*ab = 0.0 — iki varyant klon olurdu).
+        // Bu yüzden #442'nin `dark:` ayrımı deseni kullanıldı, tema başına ayrı kademe.
+        // Tam tarama (11 kademe × 2 tema × 3 zemin × 2 eksen): DARK'ta eşiği geçen VE
+        // kardeş varyantlardan ayırt edilebilen (ΔE*ab ≥ 10) TEK kademe 400
+        // (500 = secondary klonu · ≤300 `default`/`primary` ile çakışıyor · ≥600 eşiğin
+        // altında). LIGHT'ta {600,700,800} uygun; 700 kardeş ayrımını maksimize eder
+        // (ΔE 21.2 · 600→12.7 · 800→14.9).
+        // Ölçülen — A: light 1.123 → 10.081 ✓ · dark 1.303 → 7.533 ✓ · docs kartı
+        // 1.162 → 6.717 ✓. Track `bg-accent/20` DEĞİŞMEDİ (yedi varyantın ortak deseni).
+        // Regresyon: __tests__/slider-accent-contrast.test.ts
+        accent: "bg-[rgb(var(--secondary-700))] dark:bg-[rgb(var(--secondary-400))]",
         success: "bg-success",
-        warning: "bg-warning",
-        error: "bg-error"
+        // #442 (#424/PR #440'ın slider ikizi): range `bg-warning`/`bg-error` idi —
+        // track (`bg-warning/20` · `bg-error/20`) AYNI token'ın alfalı hâli olduğundan
+        // LIGHT temada ayrım kayboluyordu: warning 1.835 · error 2.893 (eşik 3:1,
+        // WCAG 1.4.11 non-text). DARK tema zaten temizdi (warning 6.97 · error 4.46).
+        //
+        // KÖK NEDEN: `--warning` ve `--error` tokens.css'in `.dark` bloğunda
+        // EZİLMİYOR — iki temada aynı renk. Kardeşleri tema-uyarlanabilir olduğu
+        // için geçiyor (`--success` light %29 → dark %36; ölçüm: success A ekseni
+        // light 3.73 / dark 4.83). Bu iki aile o uyarlamadan yoksun.
+        //
+        // ÇÖZÜM: eksik tema-uyarlamasını component düzeyinde ver — light'ta skalanın
+        // -700 kademesine in, dark'ta semantik token'a DOKUNMA (dark render bit-bit
+        // aynı kalır, regresyon yüzeyi sıfır). Tema-KÖR bir -700 ataması dark'ı
+        // kırardı: gerçek docs kartı (#111827) üstünde warning 2.499 ✗ · error 2.232 ✗.
+        // Tam skala taraması (11 kademe × 2 aile × 3 zemin × 2 tema) track `/20` iken
+        // iki temayı birden geçen kademe kümesini BOŞ buluyor → `dark:` ayrımı ZORUNLU;
+        // #389'un tek-orta-ton (`--secondary-500`) çözümü burada uygulanamaz, çünkü
+        // orada `--secondary` temaya göre değişiyordu. Aynı `dark:` deseni badge.tsx:51-63
+        // ve progress.tsx:110-111'de zaten kullanılıyor.
+        // Ölçülen sonuç — warning: light 1.835 → 4.235 ✓ · error: light 2.893 → 4.950 ✓
+        // (dark değişmedi: 6.97 / 4.46; docs kartı 5.77 / 3.82).
+        // Skala token'ları RGB üçlüsüdür (semantiklerin HSL'inden farklı) →
+        // `rgb(var(--x-700))` kompozisyonu; `bg-warning-700` YAZILMADI, preset bu
+        // ailelere sayısal skala açmıyor (#307 ölü-sınıf tuzağı).
+        // Regresyon: __tests__/slider-warning-error-contrast.test.ts
+        warning: "bg-[rgb(var(--warning-700))] dark:bg-warning",
+        error: "bg-[rgb(var(--error-700))] dark:bg-error"
       }
     },
     defaultVariants: {
@@ -2578,10 +2638,36 @@ var sliderThumbVariants = cva(
         // aynı kademe: tutamaç ve dolgu tek renkte okunur.
         // Regresyon: __tests__/slider-secondary-contrast.test.ts
         secondary: "border-[rgb(var(--secondary-500))] bg-background",
-        accent: "border-accent bg-background",
+        // #448 EKSEN B (range'den FARKLI eksen: bileşen↔sayfa-zemini) — tutamacın
+        // dolgusu `bg-background`, yani zeminin kendisi; ayırt edilebilirliğini
+        // YALNIZ kenarlık taşır → non-text UI bileşeni, WCAG 1.4.11 ≥3:1.
+        // `border-accent` iki temada da kayboluyordu: light 1.154 · dark 1.359 ·
+        // gerçek docs kartı 1.197. Range ile AYNI kademeler seçildi — #407'nin
+        // gerekçesi burada da geçerli: "tutamaç ve dolgu tek renkte okunur".
+        // Ölçülen — light 1.154 → 10.355 ✓ · dark 1.359 → 7.857 ✓ · docs kartı
+        // 1.197 → 6.919 ✓.
+        // Regresyon: __tests__/slider-accent-contrast.test.ts
+        accent: "border-[rgb(var(--secondary-700))] dark:border-[rgb(var(--secondary-400))] bg-background",
         success: "border-success bg-background",
-        warning: "border-warning bg-background",
-        error: "border-error bg-background"
+        // #442 EKSEN B (range'den FARKLI eksen: bileşen↔sayfa-zemini) — #407'de
+        // `secondary` için açılan eksenin warning/error karşılığı. Tutamacın dolgusu
+        // `bg-background`, yani zeminin kendisi; ayırt edilebilirliği YALNIZ kenarlık
+        // taşır → non-text UI bileşeni, WCAG 1.4.11 ≥3:1.
+        // ÖLÇÜLEN (eski değerler): warning light **2.133 ✗** · error light 3.781 ✓;
+        // dark ikisi de rahat geçiyordu (9.45 / 5.33).
+        //
+        // `warning` KUSURLUYDU, düzeltildi. `error` bu eksende zaten geçiyordu ama
+        // yine de aynı ifadeye çekildi: range light'ta -700'e indiği için kenarlık
+        // `border-error`da bırakılsaydı LIGHT temada dolgu rgb(185,28,28), tutamaç
+        // rgb(239,67,67) olurdu — düzeltmenin KENDİSİ iki-tonlu bir görünüm üretirdi.
+        // #407'nin gerekçesi birebir geçerli: "tutamaç ve dolgu tek renkte okunur".
+        // Değişim kontrastı düşürmüyor, artırıyor: error light 3.781 → 6.470.
+        // Dark'ta `dark:border-*` semantik token'ı koruduğu için render bit-bit aynı.
+        // Ölçülen sonuç — warning: light 2.133 → 4.923 ✓ · error: light 3.781 → 6.470 ✓
+        // (dark değişmedi: 9.45 / 5.33; docs kartı 8.32 / 4.69).
+        // Regresyon: __tests__/slider-warning-error-contrast.test.ts
+        warning: "border-[rgb(var(--warning-700))] dark:border-warning bg-background",
+        error: "border-[rgb(var(--error-700))] dark:border-error bg-background"
       },
       size: {
         sm: "h-3 w-3",
@@ -3773,6 +3859,8 @@ var CommandShortcut = ({
 };
 CommandShortcut.displayName = "CommandShortcut";
 var TableSortContext = React12.createContext(null);
+var TableStripedContext = React12.createContext(false);
+var STRIPED_ROW_CLASSES = "odd:bg-muted/50 hover:bg-accent";
 function nextSortDirection(current) {
   if (current === "asc")
     return "desc";
@@ -3825,6 +3913,7 @@ var Table = React12.forwardRef(({
   onRowSelectionChange: _onRowSelectionChange,
   disableRowSelection: _disableRowSelection,
   getRowId: _getRowId,
+  children,
   ...props
 }, ref) => {
   const striped = variant === "striped";
@@ -3832,20 +3921,9 @@ var Table = React12.forwardRef(({
     () => ({ sortColumn, sortDirection, onSortChange }),
     [sortColumn, sortDirection, onSortChange]
   );
-  const childrenWithProps = React12.Children.map(props.children, (child) => {
-    if (React12.isValidElement(child)) {
-      if (child.type === "tbody") {
-        const tbodyProps = child.props;
-        return React12.cloneElement(child, {
-          className: cn(tbodyProps.className, striped && "even:[&>tr]:bg-muted/50")
-        });
-      }
-    }
-    return child;
-  });
   return /* @__PURE__ */ jsxs("div", { className: "relative w-full overflow-auto", children: [
     loading && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-background/60 flex items-center justify-center z-10", children: /* @__PURE__ */ jsx("div", { className: "h-8 w-8 animate-spin rounded-full border-2 border-primary border-t-transparent" }) }),
-    /* @__PURE__ */ jsx(TableSortContext.Provider, { value: sortContextValue, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(TableSortContext.Provider, { value: sortContextValue, children: /* @__PURE__ */ jsx(TableStripedContext.Provider, { value: striped, children: /* @__PURE__ */ jsx(
       "table",
       {
         ref,
@@ -3855,13 +3933,13 @@ var Table = React12.forwardRef(({
           className
         ),
         ...props,
-        children: childrenWithProps
+        children
       }
-    ) })
+    ) }) })
   ] });
 });
 Table.displayName = "Table";
-var TableHeader = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className: cn("moonui-theme", "[&_tr]:border-b", className), ...props }));
+var TableHeader = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("thead", { ref, className: cn("moonui-theme", "[&_tr]:border-b", className), ...props, children: /* @__PURE__ */ jsx(TableStripedContext.Provider, { value: false, children }) }));
 TableHeader.displayName = "TableHeader";
 var TableBody = React12.forwardRef(({ className, emptyContent, emptyMessage = "No data available", children, ...props }, ref) => {
   const hasChildren = React12.Children.count(children) > 0;
@@ -3876,26 +3954,31 @@ var TableBody = React12.forwardRef(({ className, emptyContent, emptyMessage = "N
   );
 });
 TableBody.displayName = "TableBody";
-var TableFooter = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var TableFooter = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
   "tfoot",
   {
     ref,
     className: cn("moonui-theme", "bg-primary text-primary-foreground font-medium", className),
-    ...props
+    ...props,
+    children: /* @__PURE__ */ jsx(TableStripedContext.Provider, { value: false, children })
   }
 ));
 TableFooter.displayName = "TableFooter";
-var TableRow = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  "tr",
-  {
-    ref,
-    className: cn(
-      "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
-      className
-    ),
-    ...props
-  }
-));
+var TableRow = React12.forwardRef(({ className, ...props }, ref) => {
+  const striped = React12.useContext(TableStripedContext);
+  return /* @__PURE__ */ jsx(
+    "tr",
+    {
+      ref,
+      className: cn(
+        "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
+        striped && STRIPED_ROW_CLASSES,
+        className
+      ),
+      ...props
+    }
+  );
+});
 TableRow.displayName = "TableRow";
 var TableHead = React12.forwardRef(
   ({ className, sortable, sorted, onSort, columnId, align = "left", children, ...props }, ref) => {
@@ -4910,8 +4993,31 @@ var progressIndicatorVariants = cva(
         // Regresyon: __tests__/progress-secondary-contrast.test.ts
         secondary: "bg-[rgb(var(--secondary-500))]",
         success: "bg-success",
-        warning: "bg-warning",
-        error: "bg-error"
+        // #424 (#372'nin kardeşi): dolgu `bg-warning`/`bg-error` idi — track
+        // (`bg-warning/20` · `bg-error/20`) AYNI token'ın alfalı hâli olduğundan
+        // LIGHT temada ayrım kayboluyordu: warning 1.83 · error 2.89 (eşik 3:1,
+        // WCAG 1.4.11). DARK tema zaten temizdi (warning 6.97 · error 4.46).
+        //
+        // KÖK NEDEN: `--warning` ve `--error` tokens.css'te `.dark` bloğunda
+        // EZİLMİYOR — iki temada aynı renk. Kardeşleri `--success` (light 29% →
+        // dark 36%) ve `--primary` tema-uyarlanabilir olduğu için eşiği geçiyor;
+        // bu iki aile o uyarlamadan yoksun kaldığı için light'ta kalıyor.
+        //
+        // ÇÖZÜM: eksik tema-uyarlamasını component düzeyinde ver — light'ta
+        // skalanın -700 kademesine in, dark'ta semantik token'a DOKUNMA.
+        // Tema-KÖR bir -700 ataması dark'ı kırardı (docs kartında warning 2.50 ✗
+        // · error 2.23 ✗); `dark:` ayrımı tam olarak bunu önler ve dark render'ı
+        // bit-bit aynı bırakır. Aynı desen badge.tsx:51-63'te zaten kullanılıyor.
+        // Track alfaları BİLEREK `/20` kaldı: altı varyantın tamamı o konvansiyonu
+        // paylaşıyor ve alfayı düşürmek track↔zemin ayrımını zayıflatırdı
+        // (warning 1.162 → 1.081). Ölçülen sonuç — warning: light 4.24 ✓ /
+        // dark 6.97 ✓ (docs kartı #111827: 5.77) · error: light 4.95 ✓ /
+        // dark 4.46 ✓ (docs kartı 3.82). Skala token'ları RGB üçlüsüdür
+        // (semantiklerin HSL'inden farklı) → `rgb(var(--x-700))` kompozisyonu;
+        // `bg-warning-700` YAZILMADI, preset o sınıfı üretmez (#307 ölü-sınıf).
+        // Regresyon: __tests__/progress-warning-error-contrast.test.ts
+        warning: "bg-[rgb(var(--warning-700))] dark:bg-warning",
+        error: "bg-[rgb(var(--error-700))] dark:bg-error"
       },
       animation: {
         default: "transition-all duration-500",
@@ -8016,12 +8122,53 @@ var switchVariants = cva(
         md: "h-6 w-11",
         lg: "h-7 w-14"
       },
+      // #454 — checked track'in İKİ ekseni de ölçüldü (eşik 3:1, WCAG 1.4.11
+      // non-text UI). Switch'te bu iki eksen AYNI sayıyı verir, çünkü thumb
+      // `bg-background` taşır (switchThumbVariants tabanı):
+      //   A) checked track ↔ sayfa/kart zemini  → kontrol "açık" okunuyor mu?
+      //   B) thumb ↔ checked track              → tutamacın KONUMU görülüyor mu?
+      // Ölçüm zeminleri: `--background` · `--card` · docs kabuğunun gerçek koyu
+      // kartı (#111827). Regresyon: __tests__/switch-variant-contrast.test.tsx
       variant: {
         primary: "data-[state=checked]:bg-primary",
+        // light 4.920 · dark 19.256 ✓
         success: "data-[state=checked]:bg-success",
-        warning: "data-[state=checked]:bg-warning",
+        // light 4.904 · dark  6.043 ✓
+        // #454 kardeş kusuru (#424/PR #440 progress · #442/PR #446 slider ile AYNI
+        // sınıf, üçüncü component): `--warning` tokens.css'in `.dark` bloğunda
+        // EZİLMİYOR, yani iki temada da aynı turuncu. Dark'ta zemin koyu olduğu
+        // için geçiyor (9.446), LIGHT'ta beyaz üstünde 2.133 ✗ — açık temada
+        // checked warning switch'in tutamacı da kayboluyordu (B ekseni 2.133).
+        // ÇÖZÜM (emsalle birebir aynı şekil): eksik tema-uyarlamasını component
+        // düzeyinde ver — light'ta skalanın -700 kademesine in, dark'ta semantik
+        // token'a DOKUNMA (dark render bit-bit aynı kalır, regresyon yüzeyi sıfır).
+        // Light'ta eşiği geçen kademe kümesi {700,800,900,950}; en açık olanı
+        // seçildi (turuncu kimliğini en çok koruyan). Ölçülen: 2.133 → 4.923 ✓.
+        warning: "data-[state=checked]:bg-[rgb(var(--warning-700))] dark:data-[state=checked]:bg-warning",
         destructive: "data-[state=checked]:bg-error",
-        secondary: "data-[state=checked]:bg-accent"
+        // light 3.781 · dark 5.328 ✓ (dokunulmadı)
+        // #454 asıl kusuru: `secondary` varyantı `bg-accent` kullanıyordu — ADI
+        // `secondary`, TOKEN'ı `accent`. `--accent` bir YÜZEY token'ı (`hover:bg-accent`
+        // tinti) ve iki temada da kendi zeminine bitişik: light rgb(235,239,245)
+        // beyaz üstünde 1.154 · dark rgb(29,40,58) 1.359 · docs kartı 1.197.
+        // Yani checked switch hem sayfadan hem de kendi tutamacından ayrışmıyordu:
+        // "açık" durum GÖRÜNMÜYORDU (switch'in tek işi durumu göstermek).
+        //
+        // AD ↔ TOKEN KARARI: varyant kendi ailesine, `--secondary-*` slate skalasına
+        // bağlandı. `bg-secondary` (semantik) BİLEREK seçilmedi — light'ta `--accent`
+        // ile BİREBİR aynı değer (1.154), dark'ta daha da kötü (1.007). Skala
+        // taraması (11 kademe × 2 tema × 3 zemin × 2 eksen + kardeş ΔE*ab ≥ 10 klon
+        // filtresi): light {500,600,700,800,900,950} · dark {300,400,500} → iki
+        // temayı birden geçen TEK kademe **500**, yani `dark:` ayrımına gerek yok.
+        // #448'in slider'daki 700/400 ayrımı burada GEREKMEZ ve İSTENMEZ: orada 500
+        // elenmişti çünkü slider'ın `secondary` varyantı zaten o rengi kullanıyordu
+        // (ΔE = 0.0 → klon). Switch'in `accent` adlı bir varyantı YOK, dolayısıyla
+        // 500 serbest ve kardeşlerden ayrık (ΔE: primary 69.5/51.6 · success
+        // 63.6/74.8 · warning 96.0 · destructive 85.0 — hepsi ≥ 10).
+        // Yan fayda: slider'ın `secondary` varyantı da #389/PR #406'da aynı kademeye
+        // sabitlenmişti → aynı varyant adı artık iki component'te aynı rengi veriyor.
+        // Ölçülen: A/B light 1.154 → 4.759 ✓ · dark 1.359 → 4.234 ✓ · kart 1.197 → 3.728 ✓.
+        secondary: "data-[state=checked]:bg-[rgb(var(--secondary-500))]"
       }
     },
     defaultVariants: {