@moontra/moonui 6.23.0 → 6.25.0

package/src/components/ui/__tests__/slider-accent-contrast.test.ts

@@ -45,12 +45,12 @@ const KOK = path.resolve(__dirname, '../../..')
 const tokens = fs.readFileSync(path.join(KOK, 'styles/tokens.css'), 'utf8')
 
 /** "H S% L%" biçimindeki token değerini oku (light = :root, dark = .dark bloğu) */
-function tokenOku(ad: string, blok: 'light' | 'dark'): string | null {
-  const kaynak =
+function tokenOku(name: string, blok: 'light' | 'dark'): string | null {
+  const source =
     blok === 'dark'
       ? tokens.slice(tokens.indexOf('.dark'))
       : tokens.slice(0, tokens.indexOf('.dark'))
-  return kaynak.match(new RegExp(`--${ad}:\\s*([^;]+);`))?.[1].trim() ?? null
+  return source.match(new RegExp(`--${name}:\\s*([^;]+);`))?.[1].trim() ?? null
 }
 
 function hslToRgb(h: number, s: number, l: number): [number, number, number] {
@@ -80,7 +80,7 @@ const rgbTokenRgb = (v: string): [number, number, number] => {
   return [p[0], p[1], p[2]]
 }
 
-function bagilParlaklik([r, g, b]: [number, number, number]): number {
+function relativeLuminance([r, g, b]: [number, number, number]): number {
   const c = (v: number) => {
     const x = v / 255
     return x <= 0.03928 ? x / 12.92 : Math.pow((x + 0.055) / 1.055, 2.4)
@@ -89,8 +89,8 @@ function bagilParlaklik([r, g, b]: [number, number, number]): number {
 }
 
 function rgbKontrast(a: [number, number, number], b: [number, number, number]): number {
-  const la = bagilParlaklik(a)
-  const lb = bagilParlaklik(b)
+  const la = relativeLuminance(a)
+  const lb = relativeLuminance(b)
   const [hi, lo] = la > lb ? [la, lb] : [lb, la]
   return (hi + 0.05) / (lo + 0.05)
 }
@@ -127,12 +127,12 @@ function deltaE(a: [number, number, number], b: [number, number, number]): numbe
 function alfaBileske(
   ust: [number, number, number],
   alfa: number,
-  zemin: [number, number, number]
+  background: [number, number, number]
 ): [number, number, number] {
   return [
-    Math.round(alfa * ust[0] + (1 - alfa) * zemin[0]),
-    Math.round(alfa * ust[1] + (1 - alfa) * zemin[1]),
-    Math.round(alfa * ust[2] + (1 - alfa) * zemin[2]),
+    Math.round(alfa * ust[0] + (1 - alfa) * background[0]),
+    Math.round(alfa * ust[1] + (1 - alfa) * background[1]),
+    Math.round(alfa * ust[2] + (1 - alfa) * background[2]),
   ]
 }
 
@@ -140,20 +140,20 @@ function alfaBileske(
  * Docs kabuğunda ölçülen GERÇEK koyu kart zemini (#111827 = rgb(17,24,39)) —
  * #284/#368 konvansiyonu. Bu bulguda DARBOĞAZ: en düşük dark oranlarını o veriyor.
  */
-const KART_GERCEK_DARK: [number, number, number] = [17, 24, 39]
+const CARD_ACTUAL_DARK: [number, number, number] = [17, 24, 39]
 
 /** Semantik token'ın ilgili temadaki değeri — `.dark` ezmesi YOKSA light'a düşer */
-function semantikRgb(ad: string, blok: 'light' | 'dark'): [number, number, number] {
-  return hslTokenRgb(tokenOku(ad, blok) ?? tokenOku(ad, 'light')!)
+function semanticRgb(name: string, blok: 'light' | 'dark'): [number, number, number] {
+  return hslTokenRgb(tokenOku(name, blok) ?? tokenOku(name, 'light')!)
 }
 
 /** O temada slider'ın oturabileceği tüm zeminler */
-function zeminler(blok: 'light' | 'dark'): Array<[string, [number, number, number]]> {
+function backgrounds(blok: 'light' | 'dark'): Array<[string, [number, number, number]]> {
   const z: Array<[string, [number, number, number]]> = [
-    ['--background', semantikRgb('background', blok)],
-    ['--card', semantikRgb('card', blok)],
+    ['--background', semanticRgb('background', blok)],
+    ['--card', semanticRgb('card', blok)],
   ]
-  if (blok === 'dark') z.push(['gerçek kart #111827', KART_GERCEK_DARK])
+  if (blok === 'dark') z.push(['gerçek kart #111827', CARD_ACTUAL_DARK])
   return z
 }
 
@@ -161,29 +161,29 @@ function zeminler(blok: 'light' | 'dark'): Array<[string, [number, number, numbe
 // PR #440'ın dersi: ölçümü "-700/-400" VARSAYIMINA göre yaparsan, biri değeri
 // eskiye döndürdüğünde kriter testleri yeşil kalır (boş-yeşil). Bu yüzden renkler
 // slider.tsx'in O ANKİ CVA sınıf dizgelerinden çözülür — track alfası dahil.
-const kaynak = fs.readFileSync(path.join(KOK, 'components/ui/slider.tsx'), 'utf8')
-const iTrack = kaynak.indexOf('sliderTrackVariants')
-const iRange = kaynak.indexOf('sliderRangeVariants')
-const iThumb = kaynak.indexOf('sliderThumbVariants')
-const iSon = kaynak.indexOf('SliderBaseProps')
-const TRACK_BLOK = kaynak.slice(iTrack, iRange)
-const RANGE_BLOK = kaynak.slice(iRange, iThumb)
-const THUMB_BLOK = kaynak.slice(iThumb, iSon)
+const source = fs.readFileSync(path.join(KOK, 'components/ui/slider.tsx'), 'utf8')
+const iTrack = source.indexOf('sliderTrackVariants')
+const iRange = source.indexOf('sliderRangeVariants')
+const iThumb = source.indexOf('sliderThumbVariants')
+const iSon = source.indexOf('SliderBaseProps')
+const TRACK_BLOK = source.slice(iTrack, iRange)
+const RANGE_BLOK = source.slice(iRange, iThumb)
+const THUMB_BLOK = source.slice(iThumb, iSon)
 
 /** CVA bloğundan `<varyant>: "<sınıflar>"` değerini oku */
-function varyantSinifi(blok: string, varyant: string): string {
-  const m = blok.match(new RegExp(`\\n\\s*${varyant}:\\s*"([^"]+)"`))
-  if (!m) throw new Error(`${varyant} varyantı bulunamadı`)
+function variantClass(blok: string, variant: string): string {
+  const m = blok.match(new RegExp(`\\n\\s*${variant}:\\s*"([^"]+)"`))
+  if (!m) throw new Error(`${variant} varyantı bulunamadı`)
   return m[1]
 }
 
 /** Tek bir Tailwind sınıfını renge çevir (arbitrary skala VEYA semantik token) */
-function sinifRengi(sinif: string, blok: 'light' | 'dark'): [number, number, number] {
-  const skala = sinif.match(/^(?:bg|border)-\[rgb\(var\(--([a-z0-9-]+)\)\)\]$/)
-  if (skala) return rgbTokenRgb(tokenOku(skala[1], 'light')!) // skala yalnız :root'ta
-  const semantik = sinif.match(/^(?:bg|border)-([a-z-]+)$/)
-  if (semantik) return semantikRgb(semantik[1], blok)
-  throw new Error(`çözülemeyen sınıf: ${sinif}`)
+function classColor(cls: string, blok: 'light' | 'dark'): [number, number, number] {
+  const scale = cls.match(/^(?:bg|border)-\[rgb\(var\(--([a-z0-9-]+)\)\)\]$/)
+  if (scale) return rgbTokenRgb(tokenOku(scale[1], 'light')!) // skala yalnız :root'ta
+  const semantic = cls.match(/^(?:bg|border)-([a-z-]+)$/)
+  if (semantic) return semanticRgb(semantic[1], blok)
+  throw new Error(`çözülemeyen sınıf: ${cls}`)
 }
 
 /**
@@ -191,47 +191,47 @@ function sinifRengi(sinif: string, blok: 'light' | 'dark'): [number, number, num
  * `dark:` önekli sınıf dark temada kazanır; `onek` ile eksen seçilir (thumb dizgesi
  * `border-*` yanında `bg-background` da taşır).
  */
-function uygulananRenk(
+function appliedColor(
   cvaBlok: string,
-  varyant: string,
+  variant: string,
   onek: 'bg' | 'border',
   blok: 'light' | 'dark'
 ): [number, number, number] {
-  const siniflar = varyantSinifi(cvaBlok, varyant)
+  const classNames = variantClass(cvaBlok, variant)
     .split(/\s+/)
     .filter((s) => s.replace(/^dark:/, '').startsWith(`${onek}-`))
-  const darkSinif = siniflar.find((s) => s.startsWith('dark:'))?.slice('dark:'.length)
-  const lightSinif = siniflar.find((s) => !s.startsWith('dark:'))
-  if (!lightSinif) throw new Error(`${varyant}/${onek}: temel (light) sınıf yok`)
-  return sinifRengi(blok === 'dark' ? darkSinif ?? lightSinif : lightSinif, blok)
+  const darkClass = classNames.find((s) => s.startsWith('dark:'))?.slice('dark:'.length)
+  const lightClass = classNames.find((s) => !s.startsWith('dark:'))
+  if (!lightClass) throw new Error(`${variant}/${onek}: temel (light) sınıf yok`)
+  return classColor(blok === 'dark' ? darkClass ?? lightClass : lightClass, blok)
 }
 
-const rangeRengi = (v: string, blok: 'light' | 'dark') => uygulananRenk(RANGE_BLOK, v, 'bg', blok)
-const thumbKenarRengi = (v: string, blok: 'light' | 'dark') =>
-  uygulananRenk(THUMB_BLOK, v, 'border', blok)
+const rangeRengi = (v: string, blok: 'light' | 'dark') => appliedColor(RANGE_BLOK, v, 'bg', blok)
+const thumbBorderColor = (v: string, blok: 'light' | 'dark') =>
+  appliedColor(THUMB_BLOK, v, 'border', blok)
 
 /** Track'in her zemin üstündeki bileşkesi — alfa da KAYNAKTAN okunur */
-function trackler(varyant: string, blok: 'light' | 'dark') {
-  const sinif = varyantSinifi(TRACK_BLOK, varyant)
-  const m = sinif.match(/^bg-([a-z-]+)\/(\d+)$/)
-  if (!m) throw new Error(`track sınıfı çözülemedi: ${sinif}`)
-  const taban = semantikRgb(m[1], blok)
+function trackler(variant: string, blok: 'light' | 'dark') {
+  const cls = variantClass(TRACK_BLOK, variant)
+  const m = cls.match(/^bg-([a-z-]+)\/(\d+)$/)
+  if (!m) throw new Error(`track sınıfı çözülemedi: ${cls}`)
+  const base = semanticRgb(m[1], blok)
   const alfa = Number(m[2]) / 100
-  return zeminler(blok).map(([ad, z]) => [ad, alfaBileske(taban, alfa, z)] as const)
+  return backgrounds(blok).map(([name, z]) => [name, alfaBileske(base, alfa, z)] as const)
 }
 
 /** `accent` DIŞINDAKİ slider varyantlarının o temada gerçekten uygulanan dolgu renkleri */
 const KARDESLER = ['default', 'primary', 'secondary', 'success', 'warning', 'error'] as const
-const kardesRenkleri = (blok: 'light' | 'dark') =>
+const siblingColors = (blok: 'light' | 'dark') =>
   KARDESLER.map((v) => [v, rangeRengi(v, blok)] as const)
 
 const KADEMELER = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950]
 /** Ayırt edilebilirlik eşiği (CIE76). Eşiğin yeri sonucu DEĞİŞTİRMİYOR: elenen
  *  tek-orta-ton adayı 500, kardeşine ΔE = 0.0 ile birebir AYNI renk. */
-const DELTAE_ESIK = 10
+const DELTAE_THRESHOLD = 10
 
 /** Slider DOM'u: kök > .moonui-theme > track > range; thumb'lar track'in KARDEŞİ */
-function parcalar(container: HTMLElement) {
+function parts(container: HTMLElement) {
   const kabuk = container.querySelector('.moonui-theme') as HTMLElement
   expect(kabuk).not.toBeNull()
   const track = kabuk.firstElementChild as HTMLElement
@@ -246,8 +246,8 @@ describe('#448 hesaplayıcı çapaları', () => {
   it('kontrast hesaplayıcısı DOĞRU — belgelenmiş token çifti beklenen oranı veriyor', () => {
     // tokens.css `--info-subtle` çiftini 9.52:1 diye belgeliyor.
     const oran = rgbKontrast(
-      semantikRgb('info-subtle', 'light'),
-      semantikRgb('info-subtle-foreground', 'light')
+      semanticRgb('info-subtle', 'light'),
+      semanticRgb('info-subtle-foreground', 'light')
     )
     expect(oran).toBeGreaterThan(9.3)
     expect(oran).toBeLessThan(9.7)
@@ -262,20 +262,20 @@ describe('#448 hesaplayıcı çapaları', () => {
     // Çapraz doğrulama: issue tablosu (A: 1.12/1.30/1.16 · B: 1.15/1.36/1.20) bu
     // dosyadan BAĞIMSIZ olarak PR #446 çalışmasında ölçülmüştü. Model onları
     // tutturamıyorsa aşağıdaki tüm oranlar anlamsızdır.
-    const eskiA = (blok: 'light' | 'dark') =>
+    const oldA = (blok: 'light' | 'dark') =>
       trackler('accent', blok).map(([, t]) =>
-        Number(rgbKontrast(semantikRgb('accent', blok), t).toFixed(2))
+        Number(rgbKontrast(semanticRgb('accent', blok), t).toFixed(2))
       )
-    expect(eskiA('light')[0]).toBe(1.12)
-    expect(eskiA('dark')[0]).toBe(1.3)
-    expect(eskiA('dark')[2]).toBe(1.16) // gerçek docs kartı
-    const eskiB = (blok: 'light' | 'dark') =>
-      zeminler(blok).map(([, z]) =>
-        Number(rgbKontrast(semantikRgb('accent', blok), z).toFixed(2))
+    expect(oldA('light')[0]).toBe(1.12)
+    expect(oldA('dark')[0]).toBe(1.3)
+    expect(oldA('dark')[2]).toBe(1.16) // gerçek docs kartı
+    const oldB = (blok: 'light' | 'dark') =>
+      backgrounds(blok).map(([, z]) =>
+        Number(rgbKontrast(semanticRgb('accent', blok), z).toFixed(2))
       )
-    expect(eskiB('light')[0]).toBe(1.15)
-    expect(eskiB('dark')[0]).toBe(1.36)
-    expect(eskiB('dark')[2]).toBe(1.2)
+    expect(oldB('light')[0]).toBe(1.15)
+    expect(oldB('dark')[0]).toBe(1.36)
+    expect(oldB('dark')[2]).toBe(1.2)
   })
 })
 
@@ -305,43 +305,49 @@ describe('#448 kök neden — `--accent` YÜZEY token’ı, skalası YOK', () =>
     // Track'i değiştirerek onarmanın neden imkânsız olduğunun kanıtı: dolgu rengi
     // zeminden ayrışmıyorsa, altına konacak hiçbir track 3:1 üretemez.
     for (const blok of ['light', 'dark'] as const) {
-      for (const [, z] of zeminler(blok)) {
-        expect(rgbKontrast(semantikRgb('accent', blok), z)).toBeLessThan(1.5)
+      for (const [, z] of backgrounds(blok)) {
+        expect(rgbKontrast(semanticRgb('accent', blok), z)).toBeLessThan(1.5)
       }
     }
   })
 })
 
 describe('#448 reddedilen alternatifler (seçimin gerekçesi)', () => {
-  it('`bg-accent-foreground` ELENDİ — iki temada da `--primary` ile BİREBİR aynı', () => {
+  it('`bg-accent-foreground` ELENDİ — dark birebir, light NEREDEYSE aynı `--primary` klonu', () => {
     // #389'un `secondary` için verdiği kararın aynısı: varyant primary klonuna dönerdi.
-    for (const blok of ['light', 'dark'] as const) {
-      expect(tokenOku('accent-foreground', blok)).toBe(tokenOku('primary', blok))
-    }
+    // #647: light'ta `--accent-foreground` AA için 51%→49% oldu (--primary 51%te
+    // kaldı) — `slider-secondary-contrast.test.ts`'teki aynı desen (ΔL=%2, kontrast
+    // ~1.07, ayırt edilemez ama artık bit-bit eşit değil). Dark hiç dokunulmadı.
+    const lightOran = rgbKontrast(
+      hslTokenRgb(tokenOku('accent-foreground', 'light')!),
+      hslTokenRgb(tokenOku('primary', 'light')!)
+    )
+    expect(lightOran).toBeLessThan(1.3) // ayırt edilemez — near-identical
+    expect(tokenOku('accent-foreground', 'dark')).toBe(tokenOku('primary', 'dark'))
   })
 
   it('`bg-accent-foreground` AYRICA tek başına dolgu olamaz — preset’lerin 2’sinde BEYAZ', () => {
     // Creative + Nature preset'lerinde accentForeground "0 0% 100%": beyaz sayfada
     // beyaz dolgu. Token, accent YÜZEYİNİN mürekkebi; bağımsız dolgu rengi değil.
     const presetler = fs.readFileSync(path.join(KOK, 'lib/theme-presets.ts'), 'utf8')
-    const beyazlar = [...presetler.matchAll(/accentForeground:\s*"([^"]+)"/g)].filter(
+    const whites = [...presetler.matchAll(/accentForeground:\s*"([^"]+)"/g)].filter(
       (m) => m[1] === '0 0% 100%'
     )
-    expect(beyazlar.length).toBeGreaterThanOrEqual(2)
+    expect(whites.length).toBeGreaterThanOrEqual(2)
   })
 
   it('slate ailesinde TEMA-KÖR geçen tek kademe 500 — o da `secondary` varyantının KLONU', () => {
     // #385/#406/#389'un çözüm şeklinin burada neden uygulanamadığının kanıtı.
-    const gecenler = KADEMELER.filter((k) => {
+    const passingOnes = KADEMELER.filter((k) => {
       const ham = tokenOku(`secondary-${k}`, 'light')
       if (!ham) return false
       const c = rgbTokenRgb(ham)
       return (['light', 'dark'] as const).every((blok) =>
         trackler('accent', blok).every(([, t]) => rgbKontrast(c, t) >= 3.0) &&
-        zeminler(blok).every(([, z]) => rgbKontrast(c, z) >= 3.0)
+        backgrounds(blok).every(([, z]) => rgbKontrast(c, z) >= 3.0)
       )
     })
-    expect(gecenler).toEqual([500])
+    expect(passingOnes).toEqual([500])
     // ...ve 500, `secondary` varyantının o anki rengiyle BİREBİR aynı (ΔE = 0).
     const k500 = rgbTokenRgb(tokenOku('secondary-500', 'light')!)
     expect(deltaE(k500, rangeRengi('secondary', 'light'))).toBeCloseTo(0, 6)
@@ -351,49 +357,49 @@ describe('#448 reddedilen alternatifler (seçimin gerekçesi)', () => {
   it('DARK temada eşiği geçen VE kardeşlerden ayırt edilebilen TEK kademe 400', () => {
     // Seçimin zorunlu olduğunun kanıtı: dark tarafta serbestlik YOK.
     // ≤300 `default`/`primary` ile çakışır, 500 `secondary` klonu, ≥600 eşiğin altı.
-    const uygun = KADEMELER.filter((k) => {
+    const suitable = KADEMELER.filter((k) => {
       const ham = tokenOku(`secondary-${k}`, 'light')
       if (!ham) return false
       const c = rgbTokenRgb(ham)
-      const esik =
+      const threshold =
         trackler('accent', 'dark').every(([, t]) => rgbKontrast(c, t) >= 3.0) &&
-        zeminler('dark').every(([, z]) => rgbKontrast(c, z) >= 3.0)
-      const ayirt = kardesRenkleri('dark').every(([, r]) => deltaE(c, r) >= DELTAE_ESIK)
-      return esik && ayirt
+        backgrounds('dark').every(([, z]) => rgbKontrast(c, z) >= 3.0)
+      const ayirt = siblingColors('dark').every(([, r]) => deltaE(c, r) >= DELTAE_THRESHOLD)
+      return threshold && ayirt
     })
-    expect(uygun).toEqual([400])
+    expect(suitable).toEqual([400])
   })
 
   it('LIGHT temada {600,700,800} uygun; 700 kardeş ayrımını MAKSİMİZE ediyor', () => {
-    const skor = (k: number) => {
+    const score = (k: number) => {
       const c = rgbTokenRgb(tokenOku(`secondary-${k}`, 'light')!)
-      return Math.min(...kardesRenkleri('light').map(([, r]) => deltaE(c, r)))
+      return Math.min(...siblingColors('light').map(([, r]) => deltaE(c, r)))
     }
-    const uygun = KADEMELER.filter((k) => {
+    const suitable = KADEMELER.filter((k) => {
       const c = rgbTokenRgb(tokenOku(`secondary-${k}`, 'light')!)
-      const esik =
+      const threshold =
         trackler('accent', 'light').every(([, t]) => rgbKontrast(c, t) >= 3.0) &&
-        zeminler('light').every(([, z]) => rgbKontrast(c, z) >= 3.0)
-      return esik && skor(k) >= DELTAE_ESIK
+        backgrounds('light').every(([, z]) => rgbKontrast(c, z) >= 3.0)
+      return threshold && score(k) >= DELTAE_THRESHOLD
     })
-    expect(uygun).toEqual([600, 700, 800])
-    expect(Math.max(...uygun.map(skor))).toBeCloseTo(skor(700), 6)
+    expect(suitable).toEqual([600, 700, 800])
+    expect(Math.max(...suitable.map(score))).toBeCloseTo(score(700), 6)
   })
 })
 
 describe('#448 kaynak sözleşmesi — slider.tsx', () => {
   it('track `accent` sınıfı `/20` alfasını KORUYOR (yedi varyantın ortak deseni)', () => {
-    expect(varyantSinifi(TRACK_BLOK, 'accent')).toBe('bg-accent/20')
+    expect(variantClass(TRACK_BLOK, 'accent')).toBe('bg-accent/20')
   })
 
   it('EKSEN A: range `accent` light’ta -700, dark’ta -400', () => {
-    expect(varyantSinifi(RANGE_BLOK, 'accent')).toBe(
+    expect(variantClass(RANGE_BLOK, 'accent')).toBe(
       'bg-[rgb(var(--secondary-700))] dark:bg-[rgb(var(--secondary-400))]'
     )
   })
 
   it('EKSEN B: thumb `accent` kenarlığı light’ta -700, dark’ta -400', () => {
-    expect(varyantSinifi(THUMB_BLOK, 'accent')).toBe(
+    expect(variantClass(THUMB_BLOK, 'accent')).toBe(
       'border-[rgb(var(--secondary-700))] dark:border-[rgb(var(--secondary-400))] bg-background'
     )
   })
@@ -401,27 +407,27 @@ describe('#448 kaynak sözleşmesi — slider.tsx', () => {
   it('KAPSAM KİLİDİ: diğer altı varyant DOKUNULMADI', () => {
     // #424/#442 (warning/error) ve #389/#407 (secondary) kararları korunuyor;
     // primary/success/default zaten eşiği geçiyor. Gereksiz değişiklik = regresyon riski.
-    expect(varyantSinifi(RANGE_BLOK, 'default')).toBe('bg-foreground')
-    expect(varyantSinifi(RANGE_BLOK, 'primary')).toBe('bg-primary')
-    expect(varyantSinifi(RANGE_BLOK, 'secondary')).toBe('bg-[rgb(var(--secondary-500))]')
-    expect(varyantSinifi(RANGE_BLOK, 'success')).toBe('bg-success')
-    expect(varyantSinifi(RANGE_BLOK, 'warning')).toBe(
+    expect(variantClass(RANGE_BLOK, 'default')).toBe('bg-foreground')
+    expect(variantClass(RANGE_BLOK, 'primary')).toBe('bg-primary')
+    expect(variantClass(RANGE_BLOK, 'secondary')).toBe('bg-[rgb(var(--secondary-500))]')
+    expect(variantClass(RANGE_BLOK, 'success')).toBe('bg-success')
+    expect(variantClass(RANGE_BLOK, 'warning')).toBe(
       'bg-[rgb(var(--warning-700))] dark:bg-warning'
     )
-    expect(varyantSinifi(RANGE_BLOK, 'error')).toBe('bg-[rgb(var(--error-700))] dark:bg-error')
+    expect(variantClass(RANGE_BLOK, 'error')).toBe('bg-[rgb(var(--error-700))] dark:bg-error')
   })
 
   it('zemin denkliği: `.moonui-theme` paket CSS’inde token yeniden tanımlamıyor', () => {
     // Hesap, track'in/tutamacın altındaki yüzeyin --background/--card olduğunu
     // VARSAYAR. Biri `.moonui-theme`i token kapsamına çevirirse o varsayım sessizce
     // yanlışlanır — o an burası kırmızı olur (#389 deseni).
-    const stilDizini = path.join(KOK, 'styles')
-    const stiller = fs
-      .readdirSync(stilDizini)
+    const styleDir = path.join(KOK, 'styles')
+    const styles = fs
+      .readdirSync(styleDir)
       .filter((f) => f.endsWith('.css'))
-      .map((f) => fs.readFileSync(path.join(stilDizini, f), 'utf8'))
+      .map((f) => fs.readFileSync(path.join(styleDir, f), 'utf8'))
       .join('\n')
-    expect(stiller).not.toMatch(/\.moonui-theme[^{]*\{[^}]*--(accent|secondary|background|card)/)
+    expect(styles).not.toMatch(/\.moonui-theme[^{]*\{[^}]*--(accent|secondary|background|card)/)
   })
 })
 
@@ -430,7 +436,7 @@ describe('#448 render sözleşmesi — <Slider />', () => {
     const { container } = render(
       React.createElement(Slider, { trackVariant: 'accent', rangeVariant: 'accent' })
     )
-    const { track, range } = parcalar(container)
+    const { track, range } = parts(container)
     expect(track).toHaveClass('bg-accent/20')
     expect(range.className).toContain('bg-[rgb(var(--secondary-700))]')
     expect(range.className).toContain('dark:bg-[rgb(var(--secondary-400))]')
@@ -440,7 +446,7 @@ describe('#448 render sözleşmesi — <Slider />', () => {
 
   it('accent: thumb kenarlığı yeni ifadeyle iniyor, dolgusu bg-background kalıyor', () => {
     const { container } = render(React.createElement(Slider, { thumbVariant: 'accent' }))
-    const { thumb } = parcalar(container)
+    const { thumb } = parts(container)
     expect(thumb.className).toContain('border-[rgb(var(--secondary-700))]')
     expect(thumb.className).toContain('dark:border-[rgb(var(--secondary-400))]')
     expect(thumb.className).toContain('bg-background')
@@ -451,7 +457,7 @@ describe('#448 render sözleşmesi — <Slider />', () => {
     // `trackVariant || thumbVariant || "default"` ve `rangeVariant || thumbVariant ||
     // "primary"` düşüşleri değişmedi; en yaygın kullanım bu yoldan geçer.
     const { container } = render(React.createElement(Slider, { thumbVariant: 'accent' }))
-    const { track, range, thumb } = parcalar(container)
+    const { track, range, thumb } = parts(container)
     expect(track).toHaveClass('bg-accent/20')
     expect(range.className).toContain('bg-[rgb(var(--secondary-700))]')
     expect(thumb.className).toContain('border-[rgb(var(--secondary-700))]')
@@ -461,7 +467,7 @@ describe('#448 render sözleşmesi — <Slider />', () => {
     const { container } = render(
       React.createElement(Slider, { thumbVariant: 'accent', rangeVariant: 'success' })
     )
-    const { range, thumb } = parcalar(container)
+    const { range, thumb } = parts(container)
     expect(range.className).toContain('bg-success')
     expect(range.className).not.toContain('--secondary-700')
     // Eksenler bağımsız: tutamaç kendi varyantını korur.
@@ -472,13 +478,13 @@ describe('#448 render sözleşmesi — <Slider />', () => {
     const { container: c1 } = render(
       React.createElement(Slider, { rangeVariant: 'secondary', thumbVariant: 'secondary' })
     )
-    const p1 = parcalar(c1)
+    const p1 = parts(c1)
     expect(p1.range.className).toContain('bg-[rgb(var(--secondary-500))]')
     expect(p1.range.className).not.toContain('--secondary-700')
     const { container: c2 } = render(
       React.createElement(Slider, { rangeVariant: 'primary', thumbVariant: 'primary' })
     )
-    const p2 = parcalar(c2)
+    const p2 = parts(c2)
     expect(p2.range.className).toContain('bg-primary')
     expect(p2.thumb.className).toContain('border-primary')
   })
@@ -487,28 +493,28 @@ describe('#448 render sözleşmesi — <Slider />', () => {
 describe.each(['light', 'dark'] as const)('#448 %s tema — kabul kriteri ≥3:1 (WCAG 1.4.11)', (blok) => {
   it('EKSEN A (range↔track): TÜM zeminlerde geçiyor', () => {
     // Ölçülen: light 10.081 · dark 7.533 · gerçek docs kartı 6.717
-    const dolgu = rangeRengi('accent', blok)
-    for (const [ad, track] of trackler('accent', blok)) {
-      const oran = rgbKontrast(dolgu, track)
-      expect({ eksen: 'A', tema: blok, zemin: ad, gecti: oran >= 3.0 }).toEqual({
-        eksen: 'A',
-        tema: blok,
-        zemin: ad,
-        gecti: true,
+    const fill = rangeRengi('accent', blok)
+    for (const [name, track] of trackler('accent', blok)) {
+      const oran = rgbKontrast(fill, track)
+      expect({ axis: 'A', theme: blok, background: name, didPass: oran >= 3.0 }).toEqual({
+        axis: 'A',
+        theme: blok,
+        background: name,
+        didPass: true,
       })
     }
   })
 
   it('EKSEN B (thumb kenarlığı↔zemin): TÜM zeminlerde geçiyor', () => {
     // Ölçülen: light 10.355 · dark 7.857 · gerçek docs kartı 6.919
-    const kenar = thumbKenarRengi('accent', blok)
-    for (const [ad, zemin] of zeminler(blok)) {
-      const oran = rgbKontrast(kenar, zemin)
-      expect({ eksen: 'B', tema: blok, zemin: ad, gecti: oran >= 3.0 }).toEqual({
-        eksen: 'B',
-        tema: blok,
-        zemin: ad,
-        gecti: true,
+    const border = thumbBorderColor('accent', blok)
+    for (const [name, background] of backgrounds(blok)) {
+      const oran = rgbKontrast(border, background)
+      expect({ axis: 'B', theme: blok, background: name, didPass: oran >= 3.0 }).toEqual({
+        axis: 'B',
+        theme: blok,
+        background: name,
+        didPass: true,
       })
     }
   })
@@ -516,27 +522,27 @@ describe.each(['light', 'dark'] as const)('#448 %s tema — kabul kriteri ≥3:1
   it('ESKİ değer (`bg-accent`/`border-accent`) BU temada başarısızdı — bug’ın belgesi', () => {
     // Düzeltmenin GEREKLİLİĞİNİ sabitler. warning/error'dan farkı: orada yalnız
     // light kırıktı, burada İKİ tema da.
-    const eski = semantikRgb('accent', blok)
+    const old = semanticRgb('accent', blok)
     for (const [, track] of trackler('accent', blok)) {
-      expect(rgbKontrast(eski, track)).toBeLessThan(3.0)
+      expect(rgbKontrast(old, track)).toBeLessThan(3.0)
     }
-    for (const [, zemin] of zeminler(blok)) {
-      expect(rgbKontrast(eski, zemin)).toBeLessThan(3.0)
+    for (const [, background] of backgrounds(blok)) {
+      expect(rgbKontrast(old, background)).toBeLessThan(3.0)
     }
   })
 
   it('TEK RENK: tutamaç kenarlığı ile range dolgusu AYNI renk', () => {
     // #407'nin gerekçesi: "tutamaç ve dolgu tek renkte okunur".
-    expect(thumbKenarRengi('accent', blok)).toEqual(rangeRengi('accent', blok))
+    expect(thumbBorderColor('accent', blok)).toEqual(rangeRengi('accent', blok))
   })
 
   it('KLON DEĞİL: accent, altı kardeş varyanttan da ayırt edilebiliyor (ΔE ≥ 10)', () => {
     // Bu iş sırasında `--secondary-500`e eşlemenin neden REDDEDİLDİĞİNİN kilidi.
     // Biri ileride accent'i secondary'nin kademesine çekerse burası kırmızı olur.
-    const dolgu = rangeRengi('accent', blok)
-    for (const [ad, renk] of kardesRenkleri(blok)) {
-      expect({ kardes: ad, ayirt: deltaE(dolgu, renk) >= DELTAE_ESIK }).toEqual({
-        kardes: ad,
+    const fill = rangeRengi('accent', blok)
+    for (const [name, color] of siblingColors(blok)) {
+      expect({ kardes: name, ayirt: deltaE(fill, color) >= DELTAE_THRESHOLD }).toEqual({
+        kardes: name,
         ayirt: true,
       })
     }