@moontra/moonui 6.19.1 → 6.19.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +89 -4
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +89 -4
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/components/ui/__tests__/slider-accent-contrast.test.ts +553 -0
- package/src/components/ui/__tests__/switch-variant-contrast.test.tsx +460 -0
- package/src/components/ui/__tests__/switch.test.tsx +11 -2
- package/src/components/ui/slider.tsx +46 -2
- package/src/components/ui/switch.tsx +44 -5
package/dist/index.js
CHANGED
|
@@ -2586,7 +2586,42 @@ var sliderRangeVariants = classVarianceAuthority.cva(
|
|
|
2586
2586
|
// tüketici --secondary-500'ü ezerek özelleştirebilir.
|
|
2587
2587
|
// Regresyon: __tests__/slider-secondary-contrast.test.ts
|
|
2588
2588
|
secondary: "bg-[rgb(var(--secondary-500))]",
|
|
2589
|
-
accent:
|
|
2589
|
+
// #448 (#389/#407'nin `accent` kardeşi — ama ÇÖZÜM SINIFI farklı): range
|
|
2590
|
+
// `bg-accent`, track `bg-accent/20` idi — aynı yüzey token'ının iki alfası.
|
|
2591
|
+
// `--accent` HER İKİ temada da kusurluydu (warning/error'dan ağır: onlar
|
|
2592
|
+
// yalnız light'ta kusurluydu): A ekseni light 1.123 · dark 1.303 · gerçek
|
|
2593
|
+
// docs kartı (#111827) 1.162. Eşik 3:1 (WCAG 1.4.11 non-text).
|
|
2594
|
+
//
|
|
2595
|
+
// KÖK NEDEN: `--accent` bir YÜZEY token'ı — `hover:bg-accent` tinti olarak
|
|
2596
|
+
// tasarlanmış ve iki temada da kendi zeminine BİTİŞİK duruyor (light
|
|
2597
|
+
// rgb(235,239,245) beyaz üstünde, dark rgb(29,40,58) rgb(3,7,17) üstünde).
|
|
2598
|
+
// Dolgu/kenarlık rolüne yapısal olarak uygun değil; bu yüzden track'i
|
|
2599
|
+
// değiştirerek onarmak da MÜMKÜN DEĞİL (light'ta accent'ten 3:1 uzakta
|
|
2600
|
+
// duran daha açık bir yüzey yok).
|
|
2601
|
+
//
|
|
2602
|
+
// #389'un tek-orta-ton kademe araması AYNEN uygulanamadı: tokens.css'te
|
|
2603
|
+
// `--accent-50 … --accent-950` skalası YOK (skalası olan aileler:
|
|
2604
|
+
// primary/secondary/success/warning/error/brand/brand-accent).
|
|
2605
|
+
// `bg-accent-foreground` de elendi — `--accent-foreground` iki temada da
|
|
2606
|
+
// `--primary` ile BİREBİR aynı değer (varyant primary klonuna dönerdi) ve
|
|
2607
|
+
// 7 tema preset'inin 2'sinde beyaz (Creative/Nature), yani tek başına
|
|
2608
|
+
// dolgu olamaz.
|
|
2609
|
+
//
|
|
2610
|
+
// ÇÖZÜM: sistemin TEK nötr skalası olan slate (`--secondary-*`) — `--accent`
|
|
2611
|
+
// ile aynı hue ailesi (216° ↔ 215°), üstelik light temada `--accent` ile
|
|
2612
|
+
// `--secondary` BİREBİR aynı token değerini taşıyor. Tema-kör tek kademe
|
|
2613
|
+
// SEÇİLEMEDİ: bu ailede iki temayı birden geçen tek kademe 500'dür, o da
|
|
2614
|
+
// `secondary` varyantının kendi rengi (ΔE*ab = 0.0 — iki varyant klon olurdu).
|
|
2615
|
+
// Bu yüzden #442'nin `dark:` ayrımı deseni kullanıldı, tema başına ayrı kademe.
|
|
2616
|
+
// Tam tarama (11 kademe × 2 tema × 3 zemin × 2 eksen): DARK'ta eşiği geçen VE
|
|
2617
|
+
// kardeş varyantlardan ayırt edilebilen (ΔE*ab ≥ 10) TEK kademe 400
|
|
2618
|
+
// (500 = secondary klonu · ≤300 `default`/`primary` ile çakışıyor · ≥600 eşiğin
|
|
2619
|
+
// altında). LIGHT'ta {600,700,800} uygun; 700 kardeş ayrımını maksimize eder
|
|
2620
|
+
// (ΔE 21.2 · 600→12.7 · 800→14.9).
|
|
2621
|
+
// Ölçülen — A: light 1.123 → 10.081 ✓ · dark 1.303 → 7.533 ✓ · docs kartı
|
|
2622
|
+
// 1.162 → 6.717 ✓. Track `bg-accent/20` DEĞİŞMEDİ (yedi varyantın ortak deseni).
|
|
2623
|
+
// Regresyon: __tests__/slider-accent-contrast.test.ts
|
|
2624
|
+
accent: "bg-[rgb(var(--secondary-700))] dark:bg-[rgb(var(--secondary-400))]",
|
|
2590
2625
|
success: "bg-success",
|
|
2591
2626
|
// #442 (#424/PR #440'ın slider ikizi): range `bg-warning`/`bg-error` idi —
|
|
2592
2627
|
// track (`bg-warning/20` · `bg-error/20`) AYNI token'ın alfalı hâli olduğundan
|
|
@@ -2641,7 +2676,16 @@ var sliderThumbVariants = classVarianceAuthority.cva(
|
|
|
2641
2676
|
// aynı kademe: tutamaç ve dolgu tek renkte okunur.
|
|
2642
2677
|
// Regresyon: __tests__/slider-secondary-contrast.test.ts
|
|
2643
2678
|
secondary: "border-[rgb(var(--secondary-500))] bg-background",
|
|
2644
|
-
|
|
2679
|
+
// #448 EKSEN B (range'den FARKLI eksen: bileşen↔sayfa-zemini) — tutamacın
|
|
2680
|
+
// dolgusu `bg-background`, yani zeminin kendisi; ayırt edilebilirliğini
|
|
2681
|
+
// YALNIZ kenarlık taşır → non-text UI bileşeni, WCAG 1.4.11 ≥3:1.
|
|
2682
|
+
// `border-accent` iki temada da kayboluyordu: light 1.154 · dark 1.359 ·
|
|
2683
|
+
// gerçek docs kartı 1.197. Range ile AYNI kademeler seçildi — #407'nin
|
|
2684
|
+
// gerekçesi burada da geçerli: "tutamaç ve dolgu tek renkte okunur".
|
|
2685
|
+
// Ölçülen — light 1.154 → 10.355 ✓ · dark 1.359 → 7.857 ✓ · docs kartı
|
|
2686
|
+
// 1.197 → 6.919 ✓.
|
|
2687
|
+
// Regresyon: __tests__/slider-accent-contrast.test.ts
|
|
2688
|
+
accent: "border-[rgb(var(--secondary-700))] dark:border-[rgb(var(--secondary-400))] bg-background",
|
|
2645
2689
|
success: "border-success bg-background",
|
|
2646
2690
|
// #442 EKSEN B (range'den FARKLI eksen: bileşen↔sayfa-zemini) — #407'de
|
|
2647
2691
|
// `secondary` için açılan eksenin warning/error karşılığı. Tutamacın dolgusu
|
|
@@ -8116,12 +8160,53 @@ var switchVariants = classVarianceAuthority.cva(
|
|
|
8116
8160
|
md: "h-6 w-11",
|
|
8117
8161
|
lg: "h-7 w-14"
|
|
8118
8162
|
},
|
|
8163
|
+
// #454 — checked track'in İKİ ekseni de ölçüldü (eşik 3:1, WCAG 1.4.11
|
|
8164
|
+
// non-text UI). Switch'te bu iki eksen AYNI sayıyı verir, çünkü thumb
|
|
8165
|
+
// `bg-background` taşır (switchThumbVariants tabanı):
|
|
8166
|
+
// A) checked track ↔ sayfa/kart zemini → kontrol "açık" okunuyor mu?
|
|
8167
|
+
// B) thumb ↔ checked track → tutamacın KONUMU görülüyor mu?
|
|
8168
|
+
// Ölçüm zeminleri: `--background` · `--card` · docs kabuğunun gerçek koyu
|
|
8169
|
+
// kartı (#111827). Regresyon: __tests__/switch-variant-contrast.test.tsx
|
|
8119
8170
|
variant: {
|
|
8120
8171
|
primary: "data-[state=checked]:bg-primary",
|
|
8172
|
+
// light 4.920 · dark 19.256 ✓
|
|
8121
8173
|
success: "data-[state=checked]:bg-success",
|
|
8122
|
-
|
|
8174
|
+
// light 4.904 · dark 6.043 ✓
|
|
8175
|
+
// #454 kardeş kusuru (#424/PR #440 progress · #442/PR #446 slider ile AYNI
|
|
8176
|
+
// sınıf, üçüncü component): `--warning` tokens.css'in `.dark` bloğunda
|
|
8177
|
+
// EZİLMİYOR, yani iki temada da aynı turuncu. Dark'ta zemin koyu olduğu
|
|
8178
|
+
// için geçiyor (9.446), LIGHT'ta beyaz üstünde 2.133 ✗ — açık temada
|
|
8179
|
+
// checked warning switch'in tutamacı da kayboluyordu (B ekseni 2.133).
|
|
8180
|
+
// ÇÖZÜM (emsalle birebir aynı şekil): eksik tema-uyarlamasını component
|
|
8181
|
+
// düzeyinde ver — light'ta skalanın -700 kademesine in, dark'ta semantik
|
|
8182
|
+
// token'a DOKUNMA (dark render bit-bit aynı kalır, regresyon yüzeyi sıfır).
|
|
8183
|
+
// Light'ta eşiği geçen kademe kümesi {700,800,900,950}; en açık olanı
|
|
8184
|
+
// seçildi (turuncu kimliğini en çok koruyan). Ölçülen: 2.133 → 4.923 ✓.
|
|
8185
|
+
warning: "data-[state=checked]:bg-[rgb(var(--warning-700))] dark:data-[state=checked]:bg-warning",
|
|
8123
8186
|
destructive: "data-[state=checked]:bg-error",
|
|
8124
|
-
|
|
8187
|
+
// light 3.781 · dark 5.328 ✓ (dokunulmadı)
|
|
8188
|
+
// #454 asıl kusuru: `secondary` varyantı `bg-accent` kullanıyordu — ADI
|
|
8189
|
+
// `secondary`, TOKEN'ı `accent`. `--accent` bir YÜZEY token'ı (`hover:bg-accent`
|
|
8190
|
+
// tinti) ve iki temada da kendi zeminine bitişik: light rgb(235,239,245)
|
|
8191
|
+
// beyaz üstünde 1.154 · dark rgb(29,40,58) 1.359 · docs kartı 1.197.
|
|
8192
|
+
// Yani checked switch hem sayfadan hem de kendi tutamacından ayrışmıyordu:
|
|
8193
|
+
// "açık" durum GÖRÜNMÜYORDU (switch'in tek işi durumu göstermek).
|
|
8194
|
+
//
|
|
8195
|
+
// AD ↔ TOKEN KARARI: varyant kendi ailesine, `--secondary-*` slate skalasına
|
|
8196
|
+
// bağlandı. `bg-secondary` (semantik) BİLEREK seçilmedi — light'ta `--accent`
|
|
8197
|
+
// ile BİREBİR aynı değer (1.154), dark'ta daha da kötü (1.007). Skala
|
|
8198
|
+
// taraması (11 kademe × 2 tema × 3 zemin × 2 eksen + kardeş ΔE*ab ≥ 10 klon
|
|
8199
|
+
// filtresi): light {500,600,700,800,900,950} · dark {300,400,500} → iki
|
|
8200
|
+
// temayı birden geçen TEK kademe **500**, yani `dark:` ayrımına gerek yok.
|
|
8201
|
+
// #448'in slider'daki 700/400 ayrımı burada GEREKMEZ ve İSTENMEZ: orada 500
|
|
8202
|
+
// elenmişti çünkü slider'ın `secondary` varyantı zaten o rengi kullanıyordu
|
|
8203
|
+
// (ΔE = 0.0 → klon). Switch'in `accent` adlı bir varyantı YOK, dolayısıyla
|
|
8204
|
+
// 500 serbest ve kardeşlerden ayrık (ΔE: primary 69.5/51.6 · success
|
|
8205
|
+
// 63.6/74.8 · warning 96.0 · destructive 85.0 — hepsi ≥ 10).
|
|
8206
|
+
// Yan fayda: slider'ın `secondary` varyantı da #389/PR #406'da aynı kademeye
|
|
8207
|
+
// sabitlenmişti → aynı varyant adı artık iki component'te aynı rengi veriyor.
|
|
8208
|
+
// Ölçülen: A/B light 1.154 → 4.759 ✓ · dark 1.359 → 4.234 ✓ · kart 1.197 → 3.728 ✓.
|
|
8209
|
+
secondary: "data-[state=checked]:bg-[rgb(var(--secondary-500))]"
|
|
8125
8210
|
}
|
|
8126
8211
|
},
|
|
8127
8212
|
defaultVariants: {
|