tamga-ui 0.4.3 → 0.5.0

package/dist/components/chrome.d.ts

@@ -1,27 +1,16 @@
 import { type ComponentType, type ReactNode } from "react";
 /**
- * Açık/koyu tema düğmesi.
+ * Açık/koyu tema düğmesi · sunucu temayı bilmiyor, ilk kare her zaman açık
+ * çıkıyor: engelleyici script uygulamanın işi, kitin bir `<head>`i yok.
+ * `storageKey` bu yüzden prop, iki taraf aynı anahtarı okumak zorunda. İki
+ * biçim (`icon` · `switch`) bir orantı kararı.
  *
- * SUNUCU TEMAYI BİLMEZ. İlk boyama her zaman açık temayla çıkar ve tercih
- * `useEffect` içinde uygulanır — yani koyu tema seçmiş biri bir kare boyunca
- * açık ekran görür. Bunu tamamen çözmenin tek yolu `<head>`'e engelleyici bir
- * script koymak, ve o script'in yeri KİT DEĞİL uygulamadır: kitin bir
- * `<head>`'i yoktur.
- *
- * `storageKey` bu yüzden bir prop: uygulama aynı anahtarı kendi script'inde
- * de okuyabilsin diye. İki taraf farklı anahtar kullanırsa tercih sessizce
- * kaybolur.
- *
- * Metinler dışarıdan geliyor. Kit çeviri yapmaz — ve bir düğmenin adı, içinde
- * metin olmadığı için erişilebilirliğin tamamıdır.
- *
- * İKİ BİÇİM, VE SEBEBİ ORANTI. `icon` sıkışık bir araç çubuğuna girer: 40×40,
- * tek simge. Ama yanında bir dil anahtarı gibi ANAHTAR biçimli bir kontrol
- * varsa, kare düğme onun iki katı yüksekliğinde durur ve şerit dengesiz
- * görünür. `switch` biçimi aynı iskeleti kullanıyor — iki uçta birer simge,
- * ortada kayan bir anahtar — yani ikisi yan yana aynı satırda oturuyor.
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
  */
-export declare function ThemeToggle({ labels, variant, storageKey, dark: controlled, onChange, className, ...rest }: {
+/** The three answers a reader can give about theme. TR: Okuyucunun tema
+ *  hakkında verebileceği üç cevap. */
+export type ThemePreference = "light" | "dark" | "system";
+export declare function ThemeToggle({ labels, variant, preference, onPreferenceChange, storageKey, dark: controlled, onChange, className, ...rest }: {
     /**
      * `icon` and `switch` need ACTION words, `select` needs STATE words. TR: `icon` ve `switch`
      * EYLEM sözcüğü ister, `select` DURUM sözcüğü.
@@ -41,7 +30,26 @@ export declare function ThemeToggle({ labels, variant, storageKey, dark: control
     } | {
         light: string;
         dark: string;
+    } | {
+        light: string;
+        dark: string;
+        system: string;
     };
+    /**
+     * `segmented` only: which of the three the reader has chosen. TR: yalnız
+     * `segmented`: okuyucunun üçünden hangisini seçtiği.
+     *
+     * WHY IT IS SEPARATE FROM `dark`. "System" is not a third shade, it is the
+     * absence of a choice: the reader is saying "ask the machine". A boolean
+     * cannot hold that, and a control that only offers two silently turns the
+     * machine's answer into a decision the reader never made. TR: NEDEN `dark`TAN
+     * AYRI. "Sistem" üçüncü bir ton değil, bir seçimin YOKLUĞU: okuyucu "makineye
+     * sor" diyor. Bir boolean bunu tutamıyor, ve yalnız ikisini sunan bir kontrol
+     * makinenin cevabını okuyucunun hiç vermediği bir karara dönüştürüyor.
+     */
+    preference?: ThemePreference;
+    /** `segmented` only. TR: yalnız `segmented`. */
+    onPreferenceChange?: (next: ThemePreference) => void;
     /**
      * The current theme, when the PRODUCT owns it. TR: O anki tema, temayı ÜRÜN tutuyorsa.
      *
@@ -57,26 +65,17 @@ export declare function ThemeToggle({ labels, variant, storageKey, dark: control
      * says the current theme in words. TR: `icon` kare düğme · `switch` bir dil anahtarıyla aynı
      * şekil · `select` o anki temayı sözcükle yazan bir kutu.
      */
-    variant?: "icon" | "switch" | "select";
+    variant?: "icon" | "switch" | "select" | "segmented";
     storageKey?: string;
     className?: string;
     /** `data-*` hooks pass through. TR: `data-*` kancaları geçiyor. */
     [k: `data-${string}`]: unknown;
 }): import("react").JSX.Element;
 /**
- * Dil değiştirici.
- *
- * Kit YÖNLENDİRME YAPMAZ. `onChange` seçilen dili verir; nereye gidileceği —
- * `router.push`, tam sayfa yenileme, bir çerez yazıp yeniden yükleme —
- * uygulamanın kararı ve yönlendiricisine bağlı. Kitin `next/navigation`'a
- * bağlanması, onu bir framework'e bağlamak olurdu.
- *
- * Etiketler ENDONİM olmalı: "English", "İngilizce" değil. Bir dili arayan
- * kişi onu kendi dilinde arar. Kit bunu zorlayamaz ama doküman söyler.
+ * Dil değiştirici · kit YÖNLENDİRME YAPMAZ, `onChange` yalnız seçilen dili
+ * verir. Etiketler endonim. İki dilde `Segmented`, üçten fazlasında `Select`.
  *
- * İki dilde SEGMENTED, üç ve fazlasında SELECT — kendiliğinden. İki seçenek
- * yan yana sığar ve tek tıkla değişir; beş dil yan yana konursa üst şeridi
- * doldurur ve altıncı dilde taşar.
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
  */
 export declare function LocaleSwitcher({ locales, current, onChange, label, className, ...rest }: {
     /**
@@ -96,15 +95,10 @@ export declare function LocaleSwitcher({ locales, current, onChange, label, clas
     [k: `data-${string}`]: unknown;
 }): import("react").JSX.Element;
 /**
- * Kare marka karosu.
+ * Kare marka karosu · görsel yoksa baş harf. `alt` bilerek boş: karo
+ * neredeyse her zaman adı yanında yazan bir şeyin yanında duruyor.
  *
- * Bir logonun etrafındaki kutu. Görsel yoksa baş harf — `Avatar`'la aynı
- * gerekçe: gri bir yer tutucu hiçbir şeyi temsil etmez, bir harf gerçekten o
- * şeyi işaret eder.
- *
- * `alt` boş bırakılıyor ve bu bilinçli: karo neredeyse her zaman adı YANINDA
- * yazan bir şeyin yanında durur. İkisini de okutmak ekran okuyucuda adı iki
- * kez tekrarlar.
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
  */
 export declare function LogoTile({ name, src, size, className, ...rest }: {
     /**
@@ -119,20 +113,10 @@ export declare function LogoTile({ name, src, size, className, ...rest }: {
     [k: `data-${string}`]: unknown;
 }): import("react").JSX.Element;
 /**
- * Şeridin sağ ucundaki hesap düğmesi.
- *
- * NEDEN BİR BİLEŞEN, VE SAYARAK. İki panelde de aynı şey elle kuruldu:
- * `<button className="tamga-icon-btn"><Avatar bare …/></button>`. `Avatar`ın
- * `bare` prop'u tam bu iş için var ve JSDoc'u bunu anlatıyor, ama bulunmadı;
- * ikinci kurulumda avatar kendi çerçevesiyle kondu ve şeritteki öteki
- * kontrollerden farklı boyda durdu. Bulunmayan bir prop, olmayan proptur.
- *
- * ÖLÇÜ ŞERİDİN ÖLÇÜSÜ. Kare `--control` (40px), yani tema anahtarı ve öteki
- * simge düğmeleriyle birebir aynı. Bir araç çubuğunda yükseklik tek karardır;
- * tek bir kontrolün farklı durması bütün şeridi hizasız gösteriyor.
+ * Şeridin sağ ucundaki hesap düğmesi · ölçüsü şeridin ölçüsü (`--control`,
+ * 40px), fotoğraf yoksa baş harfler.
  *
- * FOTOĞRAF YOKSA BAŞ HARFLER: `Avatar` zaten öyle davranıyor, ve bir hesabın
- * fotoğrafı olmaması normal hâl.
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
  */
 export declare function AccountButton({ name, src, label, onClick, href, linkComponent: Link, className, ...rest }: {
     /** The name initials are taken from; shown when there is no photo. TR: Baş harflerin çıkarıldığı ad; fotoğraf yoksa görünen bu. */

package/dist/components/chrome.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chrome.d.ts","sourceRoot":"","sources":["../../src/components/chrome.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"chrome.d.ts","sourceRoot":"","sources":["../../src/components/chrome.tsx"],"names":[],"mappings":"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"}

package/dist/components/chrome.js

@@ -1,13 +1,14 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
 import { cn } from "../lib/cn.js";
 import { dataProps } from "../lib/data-props.js";
 import { Avatar } from "./avatar.js";
 import { Icon } from "./icon.js";
 import { Select } from "./primitives.js";
+import { Segmented } from "./segmented.js";
 import { Switch } from "./switch.js";
-import { ThemeDark, ThemeLight } from "./icons.js";
+import { ThemeDark, ThemeLight, ThemeSystem } from "./icons.js";
 /**
  * Kabuk parçaları.
  *
@@ -30,32 +31,16 @@ function write(key, value) {
         /* tercih hatırlanmaz, sayfa yine çalışır */
     }
 }
-/**
- * Açık/koyu tema düğmesi.
- *
- * SUNUCU TEMAYI BİLMEZ. İlk boyama her zaman açık temayla çıkar ve tercih
- * `useEffect` içinde uygulanır — yani koyu tema seçmiş biri bir kare boyunca
- * açık ekran görür. Bunu tamamen çözmenin tek yolu `<head>`'e engelleyici bir
- * script koymak, ve o script'in yeri KİT DEĞİL uygulamadır: kitin bir
- * `<head>`'i yoktur.
- *
- * `storageKey` bu yüzden bir prop: uygulama aynı anahtarı kendi script'inde
- * de okuyabilsin diye. İki taraf farklı anahtar kullanırsa tercih sessizce
- * kaybolur.
- *
- * Metinler dışarıdan geliyor. Kit çeviri yapmaz — ve bir düğmenin adı, içinde
- * metin olmadığı için erişilebilirliğin tamamıdır.
- *
- * İKİ BİÇİM, VE SEBEBİ ORANTI. `icon` sıkışık bir araç çubuğuna girer: 40×40,
- * tek simge. Ama yanında bir dil anahtarı gibi ANAHTAR biçimli bir kontrol
- * varsa, kare düğme onun iki katı yüksekliğinde durur ve şerit dengesiz
- * görünür. `switch` biçimi aynı iskeleti kullanıyor — iki uçta birer simge,
- * ortada kayan bir anahtar — yani ikisi yan yana aynı satırda oturuyor.
- */
-export function ThemeToggle({ labels, variant = "icon", storageKey = "tamga-theme", dark: controlled, onChange, className, ...rest }) {
-    const owned = controlled === undefined;
+export function ThemeToggle({ labels, variant = "icon", preference, onPreferenceChange, storageKey = "tamga-theme", dark: controlled, onChange, className, ...rest }) {
+    /* `segmented` TEMAYI ASLA SAHİPLENMİYOR: tercihi `preference` taşıyor, yani
+       ürün tutuyor. Sahipliği `dark`ın verilip verilmediğine bakarak ölçmek,
+       `.dark` sınıfını İŞLETİM SİSTEMİNDEN basmaya yol açıyordu.
+       Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md */
+    const owned = variant !== "segmented" && controlled === undefined;
     const [self, setSelf] = useState(false);
-    const dark = owned ? self : controlled;
+    /* `segmented` dalı buraya hiç gelmiyor (yukarıda dönüyor); `controlled`
+       yalnız orada `undefined` olabiliyor, o yüzden yedek `false`. */
+    const dark = owned ? self : (controlled ?? false);
     useEffect(() => {
         if (!owned)
             return;
@@ -75,6 +60,34 @@ export function ThemeToggle({ labels, variant = "icon", storageKey = "tamga-them
         document.documentElement.classList.toggle("dark", next);
         write(storageKey, next ? "dark" : "light");
     }
+    if (variant === "segmented") {
+        /* DURUM SÖZCÜKLERİ ŞART: eksik bir etiket, ekran okuyucuya adsız bir düğme
+           demek · kit çeviri üretmiyor (docs/08 kural 5). */
+        if (!("light" in labels) || !("dark" in labels)) {
+            throw new Error('ThemeToggle variant="segmented" için labels {light, dark} (ve tercihen system) olmalı');
+        }
+        if (preference === undefined || onPreferenceChange === undefined) {
+            throw new Error('ThemeToggle variant="segmented" `preference` ve `onPreferenceChange` ister');
+        }
+        /* SİSTEM ETİKETİ VARSA ÜÇ, YOKSA İKİ · üçlü hâli önerilen kalıyor (bkz.
+           `preference`). İkide etiketler görünüyor, üçte yalnız glif: üç metin
+           kontrolü gereksiz uzatıyor.
+           Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md */
+        const ucluMu = "system" in labels;
+        const secenek = (value, icon, text) => ({
+            value,
+            label: (_jsxs(_Fragment, { children: [_jsx(Icon, { icon: icon, size: "sm" }), ucluMu ? _jsx("span", { className: "sr-only", children: text }) : text] })),
+        });
+        return (_jsx(Segmented, { ...dataProps(rest), className: cn(ucluMu && "tamga-segment-icons", className), label: ucluMu
+                ? `${labels.light} / ${labels.dark} / ${labels.system}`
+                : `${labels.light} / ${labels.dark}`, value: preference, onChange: onPreferenceChange, options: [
+                secenek("light", ThemeLight, labels.light),
+                secenek("dark", ThemeDark, labels.dark),
+                ...(ucluMu
+                    ? [secenek("system", ThemeSystem, labels.system)]
+                    : []),
+            ] }));
+    }
     if (variant === "select") {
         /* DURUM SÖZCÜKLERİ ŞART, ve verilmediyse bu bir hata. Sessizce eylem
            sözcüklerine düşmek, kutuda kendi tersini yazan bir kontrol üretirdi. */
@@ -99,59 +112,38 @@ export function ThemeToggle({ labels, variant = "icon", storageKey = "tamga-them
     return (_jsxs("button", { type: "button", onClick: toggle, className: cn("tamga-icon-btn", className), "aria-label": "toLight" in labels ? (dark ? labels.toLight : labels.toDark) : undefined, children: [_jsx(Icon, { icon: ThemeDark, size: "sm", className: "dark:hidden" }), _jsx(Icon, { icon: ThemeLight, size: "sm", className: "hidden dark:block" })] }));
 }
 /**
- * Dil değiştirici.
+ * Dil değiştirici · kit YÖNLENDİRME YAPMAZ, `onChange` yalnız seçilen dili
+ * verir. Etiketler endonim. İki dilde `Segmented`, üçten fazlasında `Select`.
  *
- * Kit YÖNLENDİRME YAPMAZ. `onChange` seçilen dili verir; nereye gidileceği —
- * `router.push`, tam sayfa yenileme, bir çerez yazıp yeniden yükleme —
- * uygulamanın kararı ve yönlendiricisine bağlı. Kitin `next/navigation`'a
- * bağlanması, onu bir framework'e bağlamak olurdu.
- *
- * Etiketler ENDONİM olmalı: "English", "İngilizce" değil. Bir dili arayan
- * kişi onu kendi dilinde arar. Kit bunu zorlayamaz ama doküman söyler.
- *
- * İki dilde SEGMENTED, üç ve fazlasında SELECT — kendiliğinden. İki seçenek
- * yan yana sığar ve tek tıkla değişir; beş dil yan yana konursa üst şeridi
- * doldurur ve altıncı dilde taşar.
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
  */
 export function LocaleSwitcher({ locales, current, onChange, label, className, ...rest }) {
     if (locales.length <= 2) {
         return (_jsx("span", { ...dataProps(rest), className: cn("tamga-segment", className), role: "group", "aria-label": label, children: locales.map((l) => (_jsx("button", { type: "button", "data-active": l.value === current, "aria-current": l.value === current ? "true" : undefined, onClick: () => onChange(l.value), children: l.label }, l.value))) }));
     }
-    return (_jsx("select", { className: cn("tamga-input h-9 w-auto", className), "aria-label": label, value: current, onChange: (e) => onChange(e.target.value), children: locales.map((l) => (_jsx("option", { value: l.value, children: l.label }, l.value))) }));
+    /* ÜÇ VE ÜZERİ DİLDE KİTİN KENDİ SEÇİMİ, tarayıcınınki DEĞİL · bir süre düz
+       bir `<select>` çiziliyordu: oku işletim sisteminin, açılan listesi
+       işletim sisteminin, ve kitin hiçbir kuralı orada geçmiyordu. */
+    return (_jsx(Select, { className: cn("w-auto min-w-40", className), "aria-label": label, placeholder: label, options: locales, value: current, onChange: onChange }));
 }
 /**
- * Kare marka karosu.
- *
- * Bir logonun etrafındaki kutu. Görsel yoksa baş harf — `Avatar`'la aynı
- * gerekçe: gri bir yer tutucu hiçbir şeyi temsil etmez, bir harf gerçekten o
- * şeyi işaret eder.
+ * Kare marka karosu · görsel yoksa baş harf. `alt` bilerek boş: karo
+ * neredeyse her zaman adı yanında yazan bir şeyin yanında duruyor.
  *
- * `alt` boş bırakılıyor ve bu bilinçli: karo neredeyse her zaman adı YANINDA
- * yazan bir şeyin yanında durur. İkisini de okutmak ekran okuyucuda adı iki
- * kez tekrarlar.
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
  */
 export function LogoTile({ name, src, size = "base", className, ...rest }) {
-    return (_jsx("span", { ...dataProps(rest), className: cn("tamga-logo-tile", size === "sm" && "tamga-logo-tile-sm", className), children: src ? (_jsx("img", { src: src, alt: "", className: "h-full w-full object-contain p-1.5" })) : (_jsx("span", { "aria-hidden": true, className: "font-mono text-subhead font-semibold text-ink-faint", children: name.trim().charAt(0).toLocaleUpperCase() })) }));
+    return (_jsx("span", { ...dataProps(rest), className: cn("tamga-logo-tile", size === "sm" && "tamga-logo-tile-sm", className), children: src ? (_jsx("img", { src: src, alt: "", className: "h-full w-full object-contain p-1.5" })) : (_jsx("span", { "aria-hidden": true, className: "font-display text-subhead font-black text-accent", children: name.trim().charAt(0).toLocaleUpperCase() })) }));
 }
 /**
- * Şeridin sağ ucundaki hesap düğmesi.
- *
- * NEDEN BİR BİLEŞEN, VE SAYARAK. İki panelde de aynı şey elle kuruldu:
- * `<button className="tamga-icon-btn"><Avatar bare …/></button>`. `Avatar`ın
- * `bare` prop'u tam bu iş için var ve JSDoc'u bunu anlatıyor, ama bulunmadı;
- * ikinci kurulumda avatar kendi çerçevesiyle kondu ve şeritteki öteki
- * kontrollerden farklı boyda durdu. Bulunmayan bir prop, olmayan proptur.
+ * Şeridin sağ ucundaki hesap düğmesi · ölçüsü şeridin ölçüsü (`--control`,
+ * 40px), fotoğraf yoksa baş harfler.
  *
- * ÖLÇÜ ŞERİDİN ÖLÇÜSÜ. Kare `--control` (40px), yani tema anahtarı ve öteki
- * simge düğmeleriyle birebir aynı. Bir araç çubuğunda yükseklik tek karardır;
- * tek bir kontrolün farklı durması bütün şeridi hizasız gösteriyor.
- *
- * FOTOĞRAF YOKSA BAŞ HARFLER: `Avatar` zaten öyle davranıyor, ve bir hesabın
- * fotoğrafı olmaması normal hâl.
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
  */
 export function AccountButton({ name, src, label, onClick, href, linkComponent: Link, className, ...rest }) {
     const ic = (_jsx(Avatar, { name: name, src: src, size: 38, bare: true }));
-    const sinif = cn("tamga-icon-btn overflow-hidden p-0", className);
+    const sinif = cn("tamga-account-btn", className);
     if (href && Link) {
         return (_jsx(Link, { href: href, "aria-label": label, className: sinif, children: ic }));
     }

package/dist/components/combobox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../src/components/combobox.tsx"],"names":[],"mappings":"AAQA;;;;GAIG;AAEH,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,MAAM,IAAI;IAC1C,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAE5B,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,EACzC,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,MAAM,EACN,QAAgB,EAChB,OAAe,EACf,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,OAAO,EAAE,SAAS,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IACnC,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,SAAS,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAyIA"}
+{"version":3,"file":"combobox.d.ts","sourceRoot":"","sources":["../../src/components/combobox.tsx"],"names":[],"mappings":"AAQA;;;;GAIG;AAEH,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,MAAM,IAAI;IAC1C,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAuB5B,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,EACzC,OAAO,EACP,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,MAAM,EACN,QAAgB,EAChB,OAAe,EACf,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,OAAO,EAAE,SAAS,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IACnC,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,SAAS,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAyIA"}

package/dist/components/combobox.js

@@ -1,10 +1,26 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useId, useMemo, useRef, useState } from "react";
 import { cn } from "../lib/cn.js";
 import { dataProps } from "../lib/data-props.js";
 import { Icon } from "./icon.js";
 import { CaretDown, Close, Search } from "./icons.js";
+/**
+ * Eşleşen harfleri kalınlaştırır.
+ *
+ * ARAMA SONUCU NEDEN EŞLEŞTİĞİNİ SÖYLEMELİ: elli ilin arasından dördü
+ * kaldığında okuyucu "neden bunlar" diye soruyor, cevabı harflerin kendisi.
+ * Karşılaştırma Türkçe küçük harfe göre, yoksa "İ" ile "i" eşleşmiyor.
+ */
+function vurgula(metin, q) {
+    const arama = q.trim();
+    if (!arama)
+        return metin;
+    const i = metin.toLocaleLowerCase("tr").indexOf(arama.toLocaleLowerCase("tr"));
+    if (i < 0)
+        return metin;
+    return (_jsxs(_Fragment, { children: [metin.slice(0, i), _jsx("b", { className: "font-bold text-ink", children: metin.slice(i, i + arama.length) }), metin.slice(i + arama.length)] }));
+}
 export function Combobox({ options, value, onChange, onSearch, placeholder, labels, disabled = false, invalid = false, className, ...rest }) {
     const id = useId();
     const [open, setOpen] = useState(false);
@@ -56,8 +72,8 @@ export function Combobox({ options, value, onChange, onSearch, placeholder, labe
                             else if (e.key === "Escape") {
                                 setOpen(false);
                             }
-                        }, className: cn("tamga-input w-full pl-9", invalid && "tamga-input-invalid", selected && !query && "text-ink") }), _jsxs("span", { className: "absolute right-1.5 flex items-center gap-0.5", children: [selected ? (_jsx("button", { type: "button", className: "tamga-mini-btn", "aria-label": labels.clear, onClick: () => {
+                        }, className: cn("tamga-input w-full pl-9", invalid && "tamga-input-invalid", selected && !query && "text-ink") }), _jsxs("span", { className: "absolute right-1.5 flex items-center gap-0.5", children: [selected ? (_jsx("button", { type: "button", className: "tamga-mini-btn", "data-inset": "true", "aria-label": labels.clear, onClick: () => {
                                     onChange?.(undefined);
                                     setQuery("");
-                                }, children: _jsx(Icon, { icon: Close, size: "xs" }) })) : null, _jsx("button", { type: "button", className: "tamga-mini-btn", "aria-label": labels.open, "aria-expanded": open, onClick: () => setOpen((v) => !v), children: _jsx(Icon, { icon: CaretDown, size: "xs" }) })] })] }), open ? (_jsx("div", { id: `${id}-list`, role: "listbox", className: "tamga-overlay absolute z-30 mt-2 max-h-72 w-full overflow-y-auto py-1", children: shown.length === 0 ? (_jsx("p", { className: "px-3 py-2.5 text-body text-ink-faint", children: labels.empty })) : (shown.map(({ value: v, label: etiket, hint, ...rest }, i) => (_jsxs("button", { ...rest, id: `${id}-opt-${i}`, type: "button", role: "option", "aria-selected": v === value, "data-selected": v === value, "data-active": i === active, className: "tamga-option w-full text-left", onMouseEnter: () => setActive(i), onClick: () => commit(shown[i]), children: [_jsx("span", { className: "block truncate", children: etiket }), hint ? (_jsx("span", { className: "block truncate font-mono text-caption text-ink-faint", children: hint })) : null] }, v)))) })) : null] }));
+                                }, children: _jsx(Icon, { icon: Close, size: "xs" }) })) : null, _jsx("button", { type: "button", className: "tamga-mini-btn", "data-inset": "true", "aria-label": labels.open, "aria-expanded": open, onClick: () => setOpen((v) => !v), children: _jsx(Icon, { icon: CaretDown, size: "xs" }) })] })] }), open ? (_jsx("div", { id: `${id}-list`, role: "listbox", className: "tamga-overlay tamga-menu absolute z-30 mt-2 max-h-72 w-full overflow-y-auto", children: shown.length === 0 ? (_jsx("p", { className: "px-3 py-2.5 text-body text-ink-faint", children: labels.empty })) : (shown.map(({ value: v, label: etiket, hint, ...rest }, i) => (_jsxs("button", { ...rest, id: `${id}-opt-${i}`, type: "button", role: "option", "aria-selected": v === value, "data-selected": v === value, "data-active": i === active, className: "tamga-option w-full text-left", onMouseEnter: () => setActive(i), onClick: () => commit(shown[i]), children: [_jsx("span", { className: "block truncate", children: vurgula(etiket, query) }), hint ? (_jsx("span", { className: "block truncate font-mono text-caption text-ink-faint", children: hint })) : null] }, v)))) })) : null] }));
 }

package/dist/components/data-table.d.ts

@@ -44,11 +44,11 @@ export declare function SelectRow({ checked, onChange, label, ...rest }: {
     [k: `data-${string}`]: unknown;
 }): import("react").JSX.Element;
 /**
- * Seçim çubuğu — "3 kayıt seçildi" ve yanındaki toplu eylemler.
+ * Seçim çubuğu · bir şerit değil bir ADA: kendi genişliği kadar, ortalanmış,
+ * ters zeminde. `sticky`, yani kaydırılan bir alanın içindeyse altta asılı
+ * kalıyor. Seçim boşken hiç render edilmiyor.
  *
- * Tablonun ÜSTÜNDE durur, altında değil: seçim yukarıdan yapılır ve eylem
- * gözün gittiği yerde olmalı. Ve seçim boşken hiç render edilmez — boş bir
- * çubuk yer kaplar, bilgi vermez.
+ * Gerekçe: docs/gerekce/02-veri-ve-liste.md
  */
 export declare function SelectionBar({ count, onClear, children, labels, className, ...rest }: {
     count: number;

package/dist/components/data-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/components/data-table.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC;;;;GAIG;AAEH,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,MAAM,CAAC;AAE3C;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,SAAS,EACT,MAAM,EACN,KAAc,EACd,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,2FAA2F;IAC3F,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IACvC,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC,+BA+B3D;AAED;;;;;;GAMG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,aAAa,EACb,QAAQ,EACR,KAAK,EACL,GAAG,IAAI,EACR,EAAE;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BA4BA;AAED,sDAAsD;AACtD,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,QAAQ,EACR,KAAK,EACL,GAAG,IAAI,EACR,EAAE;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAEA;AAED;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,MAAM,EAAE;QAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,SAAS,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,sCAwBA"}
+{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/components/data-table.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC;;;;GAIG;AAEH,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,MAAM,CAAC;AAE3C;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,SAAS,EACT,MAAM,EACN,KAAc,EACd,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,2FAA2F;IAC3F,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IACvC,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC,+BAoC3D;AAED;;;;;;GAMG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,aAAa,EACb,QAAQ,EACR,KAAK,EACL,GAAG,IAAI,EACR,EAAE;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAgBA;AAED,sDAAsD;AACtD,wBAAgB,SAAS,CAAC,EACxB,OAAO,EACP,QAAQ,EACR,KAAK,EACL,GAAG,IAAI,EACR,EAAE;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAUA;AAED;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,MAAM,EAAE;QAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,SAAS,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,sCAsBA"}

package/dist/components/data-table.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "../lib/cn.js";
 import { dataProps } from "../lib/data-props.js";
 import { Icon } from "./icon.js";
-import { CaretDown, Close } from "./icons.js";
+import { CaretDown, Close, Sort } from "./icons.js";
 import { Checkbox } from "./checkbox.js";
 /**
  * Sıralanabilir sütun başlığı.
@@ -14,7 +14,7 @@ import { Checkbox } from "./checkbox.js";
  */
 export function SortHeader({ children, direction, onSort, align = "left", className, ...rest }) {
     const next = direction === "asc" ? "desc" : "asc";
-    return (_jsx("th", { scope: "col", "aria-sort": direction ? (direction === "asc" ? "ascending" : "descending") : "none", className: cn(align === "right" && "text-right", className), ...rest, children: _jsxs("button", { type: "button", onClick: () => onSort?.(next), className: cn("inline-flex items-center gap-1.5", align === "right" && "flex-row-reverse", direction ? "text-ink" : undefined), children: [children, direction ? (_jsx(Icon, { icon: CaretDown, size: "xs", className: direction === "asc" ? "rotate-180" : undefined })) : null] }) }));
+    return (_jsx("th", { scope: "col", "aria-sort": direction ? (direction === "asc" ? "ascending" : "descending") : "none", className: cn(align === "right" && "text-right", className), ...rest, children: _jsxs("button", { type: "button", onClick: () => onSort?.(next), className: cn("inline-flex items-center gap-1.5", align === "right" && "flex-row-reverse", direction ? "text-ink" : undefined), children: [children, direction ? (_jsx(Icon, { icon: CaretDown, size: "xs", className: cn("text-accent", direction === "asc" && "rotate-180") })) : (_jsx(Icon, { icon: Sort, size: "xs", className: "text-ink-faint" }))] }) }));
 }
 /**
  * Baş onay kutusu — ve `indeterminate` neden önemli.
@@ -24,28 +24,27 @@ export function SortHeader({ children, direction, onSort, align = "left", classN
  * göstermek "hepsi seçili" der ve daha kötüdür — kullanıcı silmeye basar.
  */
 export function SelectAll({ checked, indeterminate, onChange, label, ...rest }) {
-    return (_jsx("span", { ...dataProps(rest), 
-        /* `aria-checked="mixed"` üçüncü durumun standart karşılığı. */
-        role: "checkbox", "aria-checked": indeterminate ? "mixed" : checked, "aria-label": label, tabIndex: 0, onClick: () => onChange?.(!checked), onKeyDown: (e) => {
-            if (e.key === " " || e.key === "Enter") {
-                e.preventDefault();
-                onChange?.(!checked);
-            }
-        }, className: "inline-flex cursor-pointer", children: _jsxs("span", { className: "tamga-check", "data-checked": checked || indeterminate, children: [indeterminate ? (_jsx("span", { className: "block h-0.5 w-2 bg-current", "aria-hidden": true })) : checked ? (_jsx(Icon, { icon: CaretDown, size: "xs", className: "hidden" })) : null, checked && !indeterminate ? _jsx("span", { className: "block h-2 w-2 bg-current", "aria-hidden": true }) : null] }) }));
+    return (_jsx(Checkbox, { ...dataProps(rest), compact: true, 
+        /* İKİSİ DE TABLONUN KUTUSU (`compact`): başlıktaki ile satırdakinin aynı
+           ölçüde olması şart · yarım piksellik bir fark bile sütunu eğri
+           gösteriyor. Baş kutu bir zamanlar elle çiziliyordu ve işaretliyken
+           `Checkbox`ın çentiği yerine düz bir kare basıyordu: aynı sütunda iki
+           farklı işaret. */
+        label: _jsx("span", { className: "sr-only", children: label }), checked: checked, indeterminate: indeterminate, onChange: onChange }));
 }
 /** Satır seçim kutusu — baş kutunun küçük kardeşi. */
 export function SelectRow({ checked, onChange, label, ...rest }) {
-    return _jsx(Checkbox, { label: _jsx("span", { ...dataProps(rest), className: "sr-only", children: label }), checked: checked, onChange: onChange });
+    return (_jsx(Checkbox, { ...dataProps(rest), compact: true, label: _jsx("span", { className: "sr-only", children: label }), checked: checked, onChange: onChange }));
 }
 /**
- * Seçim çubuğu — "3 kayıt seçildi" ve yanındaki toplu eylemler.
+ * Seçim çubuğu · bir şerit değil bir ADA: kendi genişliği kadar, ortalanmış,
+ * ters zeminde. `sticky`, yani kaydırılan bir alanın içindeyse altta asılı
+ * kalıyor. Seçim boşken hiç render edilmiyor.
  *
- * Tablonun ÜSTÜNDE durur, altında değil: seçim yukarıdan yapılır ve eylem
- * gözün gittiği yerde olmalı. Ve seçim boşken hiç render edilmez — boş bir
- * çubuk yer kaplar, bilgi vermez.
+ * Gerekçe: docs/gerekce/02-veri-ve-liste.md
  */
 export function SelectionBar({ count, onClear, children, labels, className, ...rest }) {
     if (count === 0)
         return null;
-    return (_jsxs("div", { ...dataProps(rest), role: "status", className: cn("tamga-gutter flex flex-wrap items-center gap-3 border-b border-[var(--color-line)] py-3", className), style: { background: "var(--color-accent-bg)" }, children: [_jsx("span", { className: "text-body font-medium text-ink tabular-nums", children: labels.selected(count) }), children ? _jsx("span", { className: "flex flex-wrap items-center gap-2", children: children }) : null, _jsx("button", { type: "button", className: "tamga-icon-btn ml-auto", "aria-label": labels.clear, onClick: onClear, children: _jsx(Icon, { icon: Close, size: "xs" }) })] }));
+    return (_jsxs("div", { ...dataProps(rest), role: "status", className: cn("tamga-selection-bar", className), children: [_jsx("span", { className: "text-body font-semibold tabular-nums whitespace-nowrap", children: labels.selected(count) }), children ? _jsx("span", { className: "flex items-center gap-2", children: children }) : null, _jsx("button", { type: "button", className: "tamga-icon-btn", "aria-label": labels.clear, onClick: onClear, children: _jsx(Icon, { icon: Close, size: "xs" }) })] }));
 }

package/dist/components/date-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../src/components/date-picker.tsx"],"names":[],"mappings":"AAQA;;;;GAIG;AAEH,0CAA0C;AAC1C,MAAM,MAAM,OAAO,GAAG,MAAM,CAAC;AAE7B,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,CAAC,EAAE,OAAO,CAAC;IAAC,EAAE,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAgCzD,wBAAgB,QAAQ,CAAC,EACvB,MAAM,EACN,KAAK,EACL,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,MAAM,EAAE;QAAE,aAAa,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BA0EA;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAK,EACL,QAAQ,EACR,WAAW,EACX,MAAM,EACN,QAAgB,EAChB,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/C,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE;QAAE,aAAa,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAClF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BA0DA"}
+{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../src/components/date-picker.tsx"],"names":[],"mappings":"AAQA;;;;GAIG;AAEH,0CAA0C;AAC1C,MAAM,MAAM,OAAO,GAAG,MAAM,CAAC;AAE7B,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,CAAC,EAAE,OAAO,CAAC;IAAC,EAAE,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAgCzD,wBAAgB,QAAQ,CAAC,EACvB,MAAM,EACN,KAAK,EACL,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,MAAM,EAAE;QAAE,aAAa,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAmFA;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAK,EACL,QAAQ,EACR,WAAW,EACX,MAAM,EACN,QAAgB,EAChB,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,GAAG,SAAS,KAAK,IAAI,CAAC;IAC/C,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE;QAAE,aAAa,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;IAClF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BA0DA"}

package/dist/components/date-picker.js

@@ -34,7 +34,11 @@ function weekStart(locale) {
 }
 export function Calendar({ locale, value, range, onSelect, labels, className, ...rest }) {
     const today = new Date();
-    const [view, setView] = useState({ y: today.getFullYear(), m: today.getMonth() });
+    /* AÇILAN AY DEĞERİN AYI, bugünün ayı değil · ve bir süre bugünündü: başka bir
+       aydan bir tarih verildiğinde takvim bu ayı açıyor, seçili gün hiç
+       görünmüyor ve kullanıcı kendi verdiği tarihi arıyordu. Değer yoksa bugün. */
+    const acilis = value ? new Date(`${value}T00:00:00`) : today;
+    const [view, setView] = useState({ y: acilis.getFullYear(), m: acilis.getMonth() });
     const first = weekStart(locale);
     const cells = useMemo(() => monthMatrix(view.y, view.m, first), [view, first]);
     const monthName = new Intl.DateTimeFormat(locale, { month: "long", year: "numeric" }).format(new Date(Date.UTC(view.y, view.m, 1)));
@@ -43,6 +47,9 @@ export function Calendar({ locale, value, range, onSelect, labels, className, ..
         /* 2024-01-07 bir Pazar; oradan hafta başına kaydırıyoruz. */
         return Array.from({ length: 7 }, (_, i) => fmt.format(new Date(Date.UTC(2024, 0, 7 + ((first + i) % 7)))));
     }, [locale, first]);
+    /* BUGÜN İŞARETLİ, ve değildi: bir takvimde "hangi gün bugün" sorusu her
+       zaman soruluyor, ve cevabı yoksa kullanıcı tarihi baştan sayıyor. */
+    const bugun = iso(today.getFullYear(), today.getMonth(), today.getDate());
     const inRange = (d) => range?.from && range?.to ? d >= range.from && d <= range.to : false;
     const isEdge = (d) => d === range?.from || d === range?.to || d === value;
     return (_jsxs("div", { ...dataProps(rest), className: cn("w-70", className), children: [_jsxs("div", { className: "mb-3 flex items-center gap-2", children: [_jsx("button", { type: "button", className: "tamga-icon-btn", "aria-label": labels.previousMonth, onClick: () => setView((v) => (v.m === 0 ? { y: v.y - 1, m: 11 } : { ...v, m: v.m - 1 })), children: _jsx(Icon, { icon: CaretLeft, size: "xs" }) }), _jsx("span", { className: "flex-1 text-center text-body font-medium text-ink", children: monthName }), _jsx("button", { type: "button", className: "tamga-icon-btn", "aria-label": labels.nextMonth, onClick: () => setView((v) => (v.m === 11 ? { y: v.y + 1, m: 0 } : { ...v, m: v.m + 1 })), children: _jsx(Icon, { icon: CaretRight, size: "xs" }) })] }), _jsxs("div", { className: "grid grid-cols-7 gap-px", children: [dayNames.map((d) => (_jsx("span", { className: "pb-1 text-center text-caption text-ink-faint", children: d }, d))), cells.map((d, i) => {
@@ -50,9 +57,9 @@ export function Calendar({ locale, value, range, onSelect, labels, className, ..
                             return _jsx("span", {}, `x${i}`);
                         const date = iso(view.y, view.m, d);
                         return (_jsx("button", { type: "button", 
-                            /* Seçili gün DOLGU alır — bir tarih bir değerdir, bir hedef değil;
+                            /* Seçili gün DOLGU alır: bir tarih bir değerdir, bir hedef değil;
                                checkbox ile aynı gerekçe (Yasa 2). */
-                            className: "tamga-option justify-center tabular-nums", "data-selected": isEdge(date), "data-active": inRange(date) && !isEdge(date), "aria-pressed": isEdge(date), onClick: () => onSelect?.(date), children: d }, date));
+                            className: "tamga-gun", "data-selected": isEdge(date), "data-today": date === bugun || undefined, "data-active": inRange(date) && !isEdge(date), "aria-pressed": isEdge(date), onClick: () => onSelect?.(date), children: d }, date));
                     })] })] }));
 }
 /**
@@ -67,7 +74,7 @@ export function DatePicker({ locale, value, onChange, placeholder, labels, disab
     const shown = value
         ? new Intl.DateTimeFormat(locale, { dateStyle: "medium" }).format(new Date(`${value}T00:00:00Z`))
         : "";
-    return (_jsxs("div", { ...dataProps(rest), className: cn("relative", className), children: [_jsxs("span", { className: "relative flex items-center", children: [_jsx(Icon, { icon: CalendarPlus, size: "xs", className: "pointer-events-none absolute left-3 text-ink-faint" }), _jsx("input", { type: "text", readOnly: true, disabled: disabled, value: shown, placeholder: placeholder, onClick: () => !disabled && setOpen((v) => !v), className: "tamga-input w-full cursor-pointer pr-16 pl-9", "aria-haspopup": "dialog", "aria-expanded": open }), _jsxs("span", { className: "absolute right-1.5 flex gap-0.5", children: [value ? (_jsx("button", { type: "button", className: "tamga-mini-btn", "aria-label": labels.clear, onClick: () => onChange?.(undefined), children: _jsx(Icon, { icon: Close, size: "xs" }) })) : null, _jsx("button", { type: "button", className: "tamga-mini-btn", "aria-label": labels.open, onClick: () => setOpen((v) => !v), children: _jsx(Icon, { icon: CalendarPlus, size: "xs" }) })] })] }), open ? (_jsx("div", { className: "tamga-overlay absolute z-30 mt-2 p-3", children: _jsx(Calendar, { locale: locale, value: value, labels: labels, onSelect: (d) => {
+    return (_jsxs("div", { ...dataProps(rest), className: cn("relative", className), children: [_jsxs("span", { className: "relative flex items-center", children: [_jsx(Icon, { icon: CalendarPlus, size: "xs", className: "pointer-events-none absolute left-3 text-ink-faint" }), _jsx("input", { type: "text", readOnly: true, disabled: disabled, value: shown, placeholder: placeholder, onClick: () => !disabled && setOpen((v) => !v), className: "tamga-input w-full cursor-pointer pr-16 pl-9", "aria-haspopup": "dialog", "aria-expanded": open }), _jsxs("span", { className: "absolute right-1.5 flex gap-0.5", children: [value ? (_jsx("button", { type: "button", className: "tamga-mini-btn", "data-inset": "true", "aria-label": labels.clear, onClick: () => onChange?.(undefined), children: _jsx(Icon, { icon: Close, size: "xs" }) })) : null, _jsx("button", { type: "button", className: "tamga-mini-btn", "data-inset": "true", "aria-label": labels.open, onClick: () => setOpen((v) => !v), children: _jsx(Icon, { icon: CalendarPlus, size: "xs" }) })] })] }), open ? (_jsx("div", { className: "tamga-overlay absolute z-30 mt-2 p-3", children: _jsx(Calendar, { locale: locale, value: value, labels: labels, onSelect: (d) => {
                         onChange?.(d);
                         setOpen(false);
                     } }) })) : null] }));

package/dist/components/disclosure.d.ts

@@ -1,12 +1,19 @@
 import { type ReactNode } from "react";
+import type { IconGlyph } from "./icons.js";
 /**
  * Açılıp kapanan bölümler.
  *
  * Gerekçe: docs/gerekce/01-form-ve-girdi.md
  */
 /** Tek bir açılır bölüm. */
-export declare function Collapsible({ title, defaultOpen, meta, className, children, ...rest }: {
+export declare function Collapsible({ title, defaultOpen, icon, meta, className, children, ...rest }: {
     title: string;
+    /**
+     * The glyph at the head of the row, in the accent. It says what KIND of section this is before
+     * the words are read. TR: Satırın başındaki glif, vurgu renginde. Sözcükler okunmadan önce bu
+     * bölümün NE TÜR bir bölüm olduğunu söylüyor.
+     */
+    icon?: IconGlyph;
     defaultOpen?: boolean;
     /**
      * The secondary text to the right of the title: a count, a state. TR: Başlığın sağındaki
@@ -26,7 +33,15 @@ export declare function Collapsible({ title, defaultOpen, meta, className, child
  * karşılaştırmak yaygın bir iş, ve otomatik kapanma onu imkânsız kılar.
  * Gerekiyorsa çağıran kendi durumunu tutar.
  */
-export declare function Accordion({ className, children, ...rest }: {
+export declare function Accordion({ look, className, children, ...rest }: {
+    /**
+     * `cards` each section is its own card and the open one rises · a list where which one is open
+     * can be read from across the screen. `list` the quiet stack inside one surface, for a card
+     * that already has an edge. TR: `cards` her bölüm kendi kartı ve açık olan yükseliyor · bir
+     * listede hangisinin açık olduğu uzaktan okunuyor. `list` tek bir yüzeyin içindeki sessiz
+     * yığın, kenarı zaten olan bir kartın içi için.
+     */
+    look?: "cards" | "list";
     className?: string;
     children: ReactNode;
     [k: `data-${string}`]: unknown;

package/dist/components/disclosure.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"disclosure.d.ts","sourceRoot":"","sources":["../../src/components/disclosure.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAMxD;;;;GAIG;AAEH,4BAA4B;AAC5B,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,WAAmB,EACnB,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAkCA;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAC;IAAC,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAA;CAAE,+BAEtI"}
+{"version":3,"file":"disclosure.d.ts","sourceRoot":"","sources":["../../src/components/disclosure.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIxD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAG5C;;;;GAIG;AAEH,4BAA4B;AAC5B,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,WAAmB,EACnB,IAAI,EACJ,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BA4CA;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAc,EACd,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACR,EAAE;IACD;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;IACpB,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BASA"}

package/dist/components/disclosure.js

@@ -11,14 +11,10 @@ import { CaretRight } from "./icons.js";
  * Gerekçe: docs/gerekce/01-form-ve-girdi.md
  */
 /** Tek bir açılır bölüm. */
-export function Collapsible({ title, defaultOpen = false, meta, className, children, ...rest }) {
+export function Collapsible({ title, defaultOpen = false, icon, meta, className, children, ...rest }) {
     const id = useId();
     const [open, setOpen] = useState(defaultOpen);
-    return (_jsxs("div", { ...dataProps(rest), className: cn("border-b border-[var(--color-line)] last:border-b-0", className), children: [_jsxs("button", { type: "button", 
-                /* `tamga-gutter` şart: `.tamga-head` yalnız DİKEY boşluk taşıyor.
-                   Onsuz başlık kabın kenarına yapışıyordu — ve altındaki gövde
-                   gutter'lı olduğu için ikisi hizasız duruyordu. */
-                className: "tamga-head tamga-gutter w-full text-left", "aria-expanded": open, "aria-controls": id, onClick: () => setOpen((v) => !v), children: [_jsx(Icon, { icon: CaretRight, size: "xs", className: "shrink-0 transition-transform", style: { transform: open ? "rotate(90deg)" : undefined } }), _jsx("span", { className: "min-w-0 flex-1 text-body font-medium text-ink", children: title }), meta ? _jsx("span", { className: "text-small text-ink-faint", children: meta }) : null] }), _jsx("div", { id: id, hidden: !open, className: "tamga-gutter pb-4", children: children })] }));
+    return (_jsxs("div", { ...dataProps(rest), className: cn("tamga-collapsible", className), "data-open": open || undefined, children: [_jsxs("button", { type: "button", className: "tamga-collapsible-head", "aria-expanded": open, "aria-controls": id, onClick: () => setOpen((v) => !v), children: [icon ? _jsx(Icon, { icon: icon, size: "base", className: "shrink-0 text-accent" }) : null, _jsx("span", { className: "min-w-0 flex-1 text-body font-bold text-ink", children: title }), meta ? _jsx("span", { className: "text-small text-ink-faint", children: meta }) : null, _jsx(Icon, { icon: CaretRight, size: "xs", weight: "bold", className: "shrink-0 transition-transform", style: { transform: open ? "rotate(90deg)" : undefined } })] }), _jsx("div", { id: id, hidden: !open, className: "tamga-collapsible-body", "data-indent": icon ? "true" : undefined, children: children })] }));
 }
 /**
  * Açılır bölümler grubu.
@@ -28,6 +24,6 @@ export function Collapsible({ title, defaultOpen = false, meta, className, child
  * karşılaştırmak yaygın bir iş, ve otomatik kapanma onu imkânsız kılar.
  * Gerekiyorsa çağıran kendi durumunu tutar.
  */
-export function Accordion({ className, children, ...rest }) {
-    return _jsx("div", { ...dataProps(rest), className: cn("tamga-surface overflow-hidden", className), children: children });
+export function Accordion({ look = "cards", className, children, ...rest }) {
+    return (_jsx("div", { ...dataProps(rest), className: cn(look === "cards" ? "tamga-accordion-cards" : "tamga-surface overflow-hidden", className), children: children }));
 }