tamga-ui 0.7.2 → 0.8.0

package/CHANGELOG.md

@@ -5,6 +5,87 @@ Versions follow [semver](https://semver.org/). Through `0.x`, breaking changes m
 
 > 🇹🇷 Türkçe için [tamga.org.tr/tr](https://tamga.org.tr/tr).
 
+## 0.8.0
+
+> A choice panel opened from a button, and a filter bar made of chips.
+
+### Added
+
+- **`SelectPanel`** · a choice panel opened from an ordinary button, like GitHub Primer's: the
+  trigger shows the chosen value or the placeholder with a caret (`aria-haspopup="listbox"`,
+  `aria-expanded`, the given `aria-label`); the panel has a `title`, an optional search box
+  (`searchable`: focus lands there on open, the list filters as you type, `labels.noMatch` when
+  nothing matches, the down arrow enters the list), the options with a check beside the chosen
+  one and an optional tone square. `allLabel` adds a first "All" option worth the empty value,
+  checked when the value is empty, kept at the top while searching. Arrows move, Enter chooses,
+  Esc closes and focus returns to the trigger. `multiple` takes an array, shows a summary like
+  "Atlas Lojistik +2" and keeps the panel open, with `labels.clear` under the list. `prefix`
+  ("Status:"), `caret`, `variant` and `size` shape the trigger for a filter chip. `Combobox`'s
+  trigger is a text box and people expected to type into it.
+- **`FilterBar` `look="chips"`** · one line: a fixed search box (17.5rem), then a chip-button
+  per top field that always reads name and value together: "Status: All" empty (outlined,
+  small, the value faint), "Status: Critical" set (soft) with its own remove button named
+  `labels.remove(label)`. Each chip opens a `SelectPanel` whose first option is `labels.all`;
+  `searchable` fields search in the panel; `panelTitle` names the panel, else the label.
+  `labels.clearAll` closes the row once a filter is set. No separate applied-filters row: the
+  chip is the summary. Text and date-range fields keep their boxes. On a narrow screen the
+  0.7.3 behaviour holds: search and "Filter · N", the sheet with every field (as panels,
+  "All" when empty, titled `labels.filter`), and the set chips in a horizontally scrolling row.
+  `fields` is the default and unchanged. The drawer's "+ Filter" chip is left for later.
+
+### Fixed
+
+- **`SortHeader`'s unsorted glyph carried a grey square**: `Icon` defaults to `duotone`, and
+  Phosphor's two-way arrow puts a 20% filled rectangle behind the down arrow in that weight.
+  The glyph is drawn `regular`.
+- **A table's header row inside an open card painted over the card's rounded corners**
+  (`ListTemplate`'s list card is `tamga-card-open`, so nothing is clipped): the first and last
+  header cells now take the card's corner radius. The selector is a descendant one, so a
+  `ScrollX` or scroll wrapper around the table is fine; it assumes the table is the card's first
+  content.
+
+## 0.7.3
+
+> What the first real consumer found: the filter bar's names, its phone layout, its option values, a thin progress bar, one card instead of two.
+
+### Added
+
+- **`FilterBar` on a narrow screen** (below `sm`) collapses to the search box and a "Filter · N"
+  button beside it; N counts the applied filters other than the search, and is omitted at zero.
+  The button opens the existing sheet, where the top fields come first as an untitled group,
+  then the drawer groups, with the same "Clear" and "Apply" in the footer. Applied chips and
+  "Clear all" stay visible. With an empty drawer the button is still drawn on narrow screens,
+  since it is the only way to the top fields. The switch is a CSS breakpoint, both views are in
+  the DOM and one is hidden, so the server's output matches the browser's. The kit writes no
+  word: `labels.filter` is optional and falls back to `allFilters`. The row's parts are kit
+  classes (`.tamga-filter-ara`, `.tamga-filter-alan`), not utilities: a utility's `display` would
+  beat the component layer's `display: none`, as it did in the first cut, measured in Chrome at
+  390px (`pnpm olc:filtre` repeats the measurement).
+- **`FilterBar` options with a value and a label** · `options` and `optionSource` take
+  `{ value, label }` pairs beside plain strings. `values` holds the value, the box and the chip
+  show the label, `tones` is keyed by the value. Plain `string[]` works as before.
+- **`Progress` `size="sm"`** · a 4px line for a table cell: no edge, no shadow, no stripes, no
+  label line; width from `className`; `role="progressbar"`, value and `ariaLabel` unchanged.
+  `tone` colours the fill from the kit's roles, else the accent. `md` is today's bar, locked
+  pixel for pixel by test.
+- **`aria-label`** on `Combobox`, `MultiSelect`, `DatePicker` and `DateTimePicker`, for a box
+  with no bound visible label.
+
+### Fixed
+
+- **`FilterBar` fields had no accessible name**: the label was a `<span>` beside the control,
+  so a screen reader read every box as "All" (WCAG 4.1.2, 2.5.3) and tests could not find a
+  field by role. Every control carries `aria-label={field.label}`; the date range's two boxes
+  are "<label> <rangeStart>" and "<label> <rangeEnd>", on top and in the drawer.
+
+- **`FilterBar` inside `ListTemplate` drew a card inside the template's card** and, in the slot's
+  flex row, shrank to its content. The bar's box is now a kit class, `.tamga-filter-bar` (the
+  same 16px padding and 14px gap as before, so a bar on its own is pixel-identical);
+  `[data-filters] > .tamga-filter-bar` drops border, ground, shadow and padding and takes
+  `flex: 1 1 100%`. The padding moved from a Tailwind utility to the class on purpose: the
+  utilities layer comes after the components layer, so `padding: 0` could never have beaten
+  `p-4`.
+
 ## 0.7.2
 
 > The current rail item is drawn whole.

package/dist/blocks/filter-bar.d.ts

@@ -20,12 +20,25 @@ export type FilterFieldKind = "text" | "select"
  | "multi"
 /** İKİ TARİH: başlangıç ve bitiş. Tek bir kutu bir aralık soramaz. */
  | "dateRange";
+/**
+ * An option whose stored VALUE differs from its shown LABEL: the address carries `critical`, the
+ * box shows "Kritik". A plain string is both at once. TR: Saklanan DEĞERİ ile görünen ADI
+ * farklı seçenek: adres `critical` taşır, kutu "Kritik" gösterir. Düz dizgi ikisi birden.
+ */
+export type FilterOption = {
+    value: string;
+    label: string;
+};
 export type FilterField = {
     key: string;
     label: string;
     kind: FilterFieldKind;
-    /** Falls back to `optionSource[key]`; with neither, the list is empty. TR: Verilmezse `optionSource[key]` kullanılır; ikisi de yoksa liste boş. */
-    options?: string[];
+    /**
+     * Plain strings, or `{ value, label }` pairs. Falls back to `optionSource[key]`; with neither,
+     * the list is empty. TR: Düz dizgiler ya da `{ value, label }` çiftleri. Verilmezse
+     * `optionSource[key]`; ikisi de yoksa liste boş.
+     */
+    options?: readonly (string | FilterOption)[];
     /**
      * Start a new row before this field. TR: Bu alandan önce yeni bir satır başlat.
      *
@@ -41,6 +54,11 @@ export type FilterField = {
      * · ve bunu yalnız çağıran biliyor. Verilirse kırılma her genişlikte duruyor.
      */
     break?: boolean;
+    /**
+     * `look="chips"` only: the line at the top of the chip's panel, "Choose a customer"; absent,
+     * the label. TR: Yalnız `look="chips"`: çipin panelinin başlığı, "Müşteri seçin"; yoksa ad.
+     */
+    panelTitle?: string;
     /**
      * A glyph before the value, naming what this filter is about. TR: Değerin
      * önünde, bu filtrenin neyle ilgili olduğunu söyleyen glif.
@@ -55,11 +73,12 @@ export type FilterField = {
      * A tone per option, for a filter whose items ARE states. TR: Öğeleri birer
      * DURUM olan filtrede, seçenek başına ton.
      *
-     * Keyed by the option's own text. The swatch it draws is the same square the
-     * table's chip draws, so the eye matches the list to the rows without reading
-     * either. Only where the option really is a state. TR: Anahtar, seçeneğin
-     * kendi metni. Çizdiği kare, tablodaki çipin çizdiği karenin aynısı · göz
-     * listeyi satırlara okumadan eşliyor. Yalnız seçenek gerçekten bir durumsa.
+     * Keyed by the option's VALUE (its text, for a plain string). The swatch it
+     * draws is the same square the table's chip draws, so the eye matches the
+     * list to the rows without reading either. Only where the option really is a
+     * state. TR: Anahtar seçeneğin DEĞERİ (düz dizgide metni). Çizdiği kare,
+     * tablodaki çipin çizdiği karenin aynısı · göz listeyi satırlara okumadan
+     * eşliyor. Yalnız seçenek gerçekten bir durumsa.
      */
     tones?: Record<string, Tone>;
 };
@@ -82,6 +101,12 @@ export type FilterBarLabels = {
      */
     all: string;
     allFilters: string;
+    /**
+     * The narrow screen's button, "Filter"; the count of applied filters follows it. Absent,
+     * `allFilters` is used. TR: Dar ekranın düğmesi, "Filtrele"; uygulanan filtre sayısı peşine
+     * gelir. Yoksa `allFilters`.
+     */
+    filter?: string;
     clearAll: string;
     clear: string;
     apply: string;
@@ -114,8 +139,8 @@ export type FilterBarProps = {
     top: readonly FilterField[];
     /** The groups inside the drawer. Grouped, not a flat pile. TR: Çekmecedeki gruplar. Düz bir yığın değil, gruplu. */
     drawer: readonly FilterGroup[];
-    /** Where the option lists come from; this will arrive from the server. TR: Seçim listelerinin kaynağı; sunucudan gelecek. */
-    optionSource?: Record<string, string[]>;
+    /** Where the option lists come from; this will arrive from the server. Strings or `{ value, label }` pairs. TR: Seçim listelerinin kaynağı; sunucudan gelecek. Dizgiler ya da `{ value, label }` çiftleri. */
+    optionSource?: Record<string, readonly (string | FilterOption)[]>;
     /**
      * THE KEY THE SEARCH BOX WRITES TO. TR: ARAMA KUTUSUNUN YAZDIĞI ANAHTAR.
      *
@@ -153,7 +178,19 @@ export type FilterBarProps = {
     extra?: ReactNode;
     /** For `DatePicker`'s calendar: "tr-TR", "en-GB". TR: `DatePicker`ın takvimi için: "tr-TR", "en-GB". */
     locale?: string;
+    /**
+     * `fields` the boxes with a label above each (today's layout). `chips` one line: a fixed
+     * search box, then a chip-button per top field that always reads name and value together,
+     * "Status: All" empty and "Status: Critical" set, with its own remove; each chip opens a
+     * `SelectPanel` whose first option is "All". No separate applied-filters row: the chip is the
+     * summary. Text and date-range fields keep their boxes. TR: `fields` her birinin üstünde adı
+     * olan kutular (bugünkü düzen). `chips` tek satır: sabit arama kutusu, sonra her üst alan için
+     * adı ve değeri hep birlikte okunan bir çip-düğme, boşken "Durum: Tümü", doluyken "Durum:
+     * Kritik" ve kendi kaldırması; her çip ilk seçeneği "Tümü" olan bir `SelectPanel` açar. Ayrı bir
+     * uygulanan-filtreler satırı yok: çip özetin kendisi. Metin ve tarih aralığı kutu kalır.
+     */
+    look?: "fields" | "chips";
     labels: FilterBarLabels;
 };
-export declare function FilterBar({ values, onChange, top, drawer, optionSource, searchKey, fileSearchKey, onFile, fileAccept, extra, locale, labels, }: FilterBarProps): import("react").JSX.Element;
+export declare function FilterBar({ values, onChange, top, drawer, optionSource, searchKey, fileSearchKey, onFile, fileAccept, extra, locale, look, labels, }: FilterBarProps): import("react").JSX.Element;
 //# sourceMappingURL=filter-bar.d.ts.map

package/dist/blocks/filter-bar.d.ts.map

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

package/dist/blocks/filter-bar.js

@@ -9,33 +9,39 @@ import { Icon } from "../components/icon.js";
 import { Close, Customize, Search, Upload } from "../components/icons.js";
 import { Input } from "../components/input.js";
 import { Select, Sheet } from "../components/primitives.js";
+import { SelectPanel } from "../components/select-panel.js";
 /* Tarih aralığı İKİ ANAHTAR tutuyor. Tek bir dizgeye sıkıştırmak, sunucuya iki
    ayrı parametre giderken burada tekrar ayrıştırmak demekti. */
 export const rangeStart = (key) => `${key}Start`;
 export const rangeEnd = (key) => `${key}End`;
-function FieldControl({ field, values, write, optionSource, locale, labels, }) {
-    const options = field.options?.length ? field.options : (optionSource[field.key] ?? []);
+function FieldControl({ field, values, write, optionSource, locale, labels, panel = false, }) {
+    const options = secenekler(field, optionSource);
+    if (panel && (field.kind === "select" || field.kind === "searchable" || field.kind === "multi")) {
+        return _jsx(PanelAlani, { field: field, values: values, write: write, optionSource: optionSource, labels: labels });
+    }
+    /* HER KONTROLÜN ADI VAR: alanın adı bir <span>, kontrole bağlı değil; ekran
+       okuyucu beş kutuyu da "Tümü" diye okuyordu. */
     if (field.kind === "dateRange") {
-        return (_jsxs("div", { className: "grid gap-2 sm:grid-cols-2", children: [_jsx(DatePicker, { locale: locale, value: values[rangeStart(field.key)] || undefined, onChange: (v) => write(rangeStart(field.key), v ?? ""), placeholder: labels.rangeStart, labels: labels.calendar }), _jsx(DatePicker, { locale: locale, value: values[rangeEnd(field.key)] || undefined, onChange: (v) => write(rangeEnd(field.key), v ?? ""), placeholder: labels.rangeEnd, labels: labels.calendar })] }));
+        return (_jsxs("div", { className: "grid gap-2 sm:grid-cols-2", children: [_jsx(DatePicker, { locale: locale, "aria-label": `${field.label} ${labels.rangeStart}`, value: values[rangeStart(field.key)] || undefined, onChange: (v) => write(rangeStart(field.key), v ?? ""), placeholder: labels.rangeStart, labels: labels.calendar }), _jsx(DatePicker, { locale: locale, "aria-label": `${field.label} ${labels.rangeEnd}`, value: values[rangeEnd(field.key)] || undefined, onChange: (v) => write(rangeEnd(field.key), v ?? ""), placeholder: labels.rangeEnd, labels: labels.calendar })] }));
     }
     if (field.kind === "multi") {
         /* Değerler virgülle tek bir dizgede: filtre durumunun tamamı
            `Record<string,string>` ve bir alanın tipi yüzünden o sözleşmeyi
            değiştirmek, her ekranı ilgilendirirdi. */
         const selected = (values[field.key] ?? "").split(",").filter(Boolean);
-        return (_jsx(MultiSelect, { className: "w-full", options: options.map((o) => ({ value: o, label: o })), value: selected, onChange: (next) => write(field.key, next.join(",")), placeholder: labels.all, labels: {
+        return (_jsx(MultiSelect, { className: "w-full", "aria-label": field.label, options: options, value: selected, onChange: (next) => write(field.key, next.join(",")), placeholder: labels.all, labels: {
                 empty: labels.noMatch,
                 remove: labels.remove,
                 open: labels.open(field.label),
             } }));
     }
     if (field.kind === "searchable") {
-        return (_jsx(Combobox, { className: "w-full", options: options.map((o) => ({ value: o, label: o })), value: values[field.key] || undefined, onChange: (v) => write(field.key, v ?? ""), placeholder: labels.all, labels: { empty: labels.noMatch, clear: labels.clear, open: labels.open(field.label) } }));
+        return (_jsx(Combobox, { className: "w-full", "aria-label": field.label, options: options, value: values[field.key] || undefined, onChange: (v) => write(field.key, v ?? ""), placeholder: labels.all, labels: { empty: labels.noMatch, clear: labels.clear, open: labels.open(field.label) } }));
     }
     if (field.kind === "select") {
-        return (_jsx(Select, { className: "w-full", icon: field.icon, options: [
+        return (_jsx(Select, { className: "w-full", "aria-label": field.label, icon: field.icon, options: [
                 labels.all,
-                ...options.map((o) => (field.tones?.[o] ? { value: o, tone: field.tones[o] } : o)),
+                ...options.map((o) => ({ value: o.value, label: o.label, tone: field.tones?.[o.value] })),
             ], 
             /* BOŞ FİLTRE "TÜMÜ"NÜN KENDİSİ · liste açıldığında onay işareti orada
                duruyor. Ama DOLU DEĞİL: `set` ayrı geçiliyor, yoksa "Tümü" yazan
@@ -44,14 +50,49 @@ function FieldControl({ field, values, write, optionSource, locale, labels, }) {
                prop: "listede hangisi seçili" ve "bu filtre uygulanmış mı". */
             value: values[field.key] || labels.all, set: Boolean(values[field.key]), onChange: (v) => write(field.key, v === labels.all ? "" : v), placeholder: labels.all }));
     }
-    return (_jsx(Input, { full: true, value: values[field.key] ?? "", onChange: (e) => write(field.key, e.target.value) }));
+    return (_jsx(Input, { full: true, "aria-label": field.label, value: values[field.key] ?? "", onChange: (e) => write(field.key, e.target.value) }));
+}
+/**
+ * ÇİP-DÜĞME VE PANEL: tetik "Durum: Tümü ▾" ya da "Durum: Kritik"; paneli
+ * `SelectPanel`, ilk seçeneği "Tümü" (geri dönüş yolu gidiş yoluyla aynı yerde).
+ * Çipte boşken kenarlı küçük, doluyken yumuşak ve oksuz; ✕ ayrı düğme.
+ */
+function PanelAlani({ field, values, write, optionSource, labels, cip = false, }) {
+    const options = secenekler(field, optionSource).map((o) => ({ ...o, tone: field.tones?.[o.value] }));
+    const ortak = {
+        title: field.panelTitle ?? field.label,
+        "aria-label": field.label,
+        prefix: `${field.label}:`,
+        placeholder: labels.all,
+        searchable: field.kind === "searchable",
+        labels: { noMatch: labels.noMatch, search: labels.search, clear: labels.clear },
+        size: cip ? "sm" : "base",
+        className: cip ? undefined : "tamga-select-panel-tam",
+    };
+    if (field.kind === "multi") {
+        const selected = (values[field.key] ?? "").split(",").filter(Boolean);
+        const dolu = selected.length > 0;
+        return (_jsx(SelectPanel, { multiple: true, ...ortak, options: options, value: selected, onChange: (n) => write(field.key, n.join(",")), variant: cip && dolu ? "soft" : "secondary", caret: !(cip && dolu) }));
+    }
+    const v = values[field.key] ?? "";
+    return (_jsx(SelectPanel, { ...ortak, allLabel: labels.all, options: options, value: v, onChange: (n) => write(field.key, n), variant: cip && v ? "soft" : "secondary", caret: !(cip && v) }));
 }
-export function FilterBar({ values, onChange, top, drawer, optionSource = {}, searchKey = "q", fileSearchKey, onFile, fileAccept, extra, locale = "en-GB", labels, }) {
+/** Seçenekler tek biçimde: düz dizgi, değeri de adı da kendisi olan bir çift. */
+function secenekler(field, optionSource) {
+    const ham = field.options?.length ? field.options : (optionSource[field.key] ?? []);
+    return ham.map((o) => (typeof o === "string" ? { value: o, label: o } : o));
+}
+export function FilterBar({ values, onChange, top, drawer, optionSource = {}, searchKey = "q", fileSearchKey, onFile, fileAccept, extra, locale = "en-GB", look = "fields", labels, }) {
+    const cipler = look === "chips";
     const [drawerOpen, setDrawerOpen] = useState(false);
     const formId = useId();
     const active = Object.entries(values).filter(([, v]) => v);
     const drawerKeys = new Set(drawer.flatMap((g) => g.fields.map((f) => f.key)));
     const hiddenActive = active.filter(([k]) => drawerKeys.has(k)).length;
+    /* Dar ekranın sayısı: aramadan başka her uygulanmış filtre · arama kutusu
+       orada da görünür, sayılmasına gerek yok. */
+    const darAktif = active.filter(([k]) => k !== searchKey).length;
+    const darMetin = `${labels.filter ?? labels.allFilters}${darAktif > 0 ? ` · ${darAktif}` : ""}`;
     function write(key, value) {
         const next = { ...values };
         if (value)
@@ -75,10 +116,21 @@ export function FilterBar({ values, onChange, top, drawer, optionSource = {}, se
             return labels.search;
         return key === fileSearchKey ? (labels.fileSearch?.label ?? key) : key;
     };
-    return (_jsxs("div", { className: "tamga-card tamga-card-open flex flex-col gap-3.5 p-4", children: [_jsxs("div", { className: "tamga-filter-row", children: [_jsxs("label", { className: "flex min-w-0 shrink grow-[2] basis-75 flex-col gap-1.5", children: [_jsx("span", { className: "text-small font-bold text-ink-faint", children: labels.search }), _jsxs("span", { className: "relative flex items-center", children: [_jsx(Icon, { icon: Search, size: "xs", "aria-hidden": true, className: "pointer-events-none absolute left-2.5 text-ink-faint" }), _jsx(Input, { type: "search", full: true, leading: true, placeholder: labels.search, value: values[searchKey] ?? "", onChange: (e) => write(searchKey, e.target.value) })] })] }), top.map((field) => (_jsxs(Fragment, { children: [field.break ? _jsx("span", { "aria-hidden": true, className: "h-0 basis-full" }) : null, _jsxs("div", { className: `flex min-w-0 shrink grow flex-col gap-1.5 ${field.kind === "dateRange" ? "basis-80" : "basis-40 tamga-filter-cap"}`, children: [_jsx("span", { className: "text-small font-bold text-ink-faint", children: field.label }), _jsx(FieldControl, { field: field, values: values, write: write, optionSource: optionSource, locale: locale, labels: labels })] })] }, field.key))), drawer.length > 0 && (_jsxs(Button, { className: "ml-auto", onClick: () => setDrawerOpen(true), children: [_jsx(Icon, { icon: Customize, size: "xs" }), labels.allFilters, hiddenActive > 0 && (_jsx("span", { className: "tamga-count ml-1 tabular-nums", children: hiddenActive }))] })), extra] }), active.length > 0 && (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [active.map(([key, value]) => (_jsxs("span", { className: "tamga-token", children: [_jsxs("span", { className: "font-normal text-ink-faint", children: [labelFor(key), ":"] }), value, _jsx("button", { type: "button", className: "tamga-token-x", "aria-label": labels.remove(labelFor(key)), onClick: () => write(key, ""), children: _jsx(Icon, { icon: Close, size: "xs" }) })] }, key))), _jsx(Button, { variant: "link", size: "sm", onClick: () => onChange({}), children: labels.clearAll })] })), _jsx(Sheet, { open: drawerOpen, onClose: () => setDrawerOpen(false), title: labels.allFilters, closeLabel: labels.calendar.clear, footer: _jsxs(_Fragment, { children: [_jsx(Button, { type: "button", onClick: () => onChange({}), children: labels.clear }), _jsx(Button, { type: "submit", form: formId, variant: "primary", children: labels.apply })] }), children: _jsxs("form", { id: formId, onSubmit: (e) => {
+    /* Çip DEĞERİ değil ADI gösteriyor: `critical` saklanır, "Kritik" okunur. */
+    const valueText = (key, value) => {
+        const field = allFields.find((f) => f.key === key);
+        if (!field || (field.kind !== "select" && field.kind !== "searchable" && field.kind !== "multi"))
+            return value;
+        const adlar = new Map(secenekler(field, optionSource).map((o) => [o.value, o.label]));
+        return value.split(",").map((v) => adlar.get(v) ?? v).join(field.kind === "multi" ? ", " : ",");
+    };
+    const ustAlanlar = (sinif) => top.map((field) => (_jsxs("div", { className: `tamga-filter-alan ${field.kind === "dateRange" ? "sm:col-span-2" : ""}`, children: [_jsx("span", { className: sinif, children: field.label }), _jsx(FieldControl, { field: field, values: values, write: write, optionSource: optionSource, locale: locale, labels: labels, panel: cipler })] }, field.key)));
+    const aramaKutusu = (_jsxs("span", { className: "relative flex items-center", children: [_jsx(Icon, { icon: Search, size: "xs", "aria-hidden": true, className: "pointer-events-none absolute left-2.5 text-ink-faint" }), _jsx(Input, { type: "search", full: true, leading: true, placeholder: labels.search, value: values[searchKey] ?? "", onChange: (e) => write(searchKey, e.target.value) })] }));
+    const cekmeceDugmesi = (drawer.length > 0 || top.length > 0) && (_jsxs(Button, { className: drawer.length > 0 ? "ml-auto" : "tamga-filter-dar ml-auto", onClick: () => setDrawerOpen(true), children: [_jsx(Icon, { icon: Customize, size: "xs" }), _jsxs("span", { className: "tamga-filter-genis", children: [labels.allFilters, hiddenActive > 0 && _jsx("span", { className: "tamga-count ml-1 tabular-nums", children: hiddenActive })] }), _jsx("span", { className: "tamga-filter-dar", children: darMetin })] }));
+    return (_jsxs("div", { className: "tamga-card tamga-card-open tamga-filter-bar", children: [cipler ? (_jsxs("div", { className: "tamga-filter-cips", children: [_jsxs("label", { className: "tamga-filter-ara-sabit", children: [_jsx("span", { className: "text-small font-bold text-ink-faint", children: labels.search }), aramaKutusu] }), _jsxs("span", { className: "tamga-filter-cip-sira", children: [top.map((field) => field.kind === "select" || field.kind === "searchable" || field.kind === "multi" ? (_jsxs("span", { className: "tamga-filter-cip", "data-set": values[field.key] ? "true" : undefined, children: [_jsx(PanelAlani, { field: field, values: values, write: write, optionSource: optionSource, labels: labels, cip: true }), values[field.key] ? (_jsx("button", { type: "button", className: "tamga-filter-cip-x", "aria-label": labels.remove(field.label), onClick: () => write(field.key, ""), children: _jsx(Icon, { icon: Close, size: "xs" }) })) : null] }, field.key)) : (_jsxs("div", { className: "tamga-filter-genis tamga-filter-alan", "data-range": field.kind === "dateRange" || undefined, children: [_jsx("span", { className: "text-small font-bold text-ink-faint", children: field.label }), _jsx(FieldControl, { field: field, values: values, write: write, optionSource: optionSource, locale: locale, labels: labels })] }, field.key))), darAktif > 0 ? (_jsx(Button, { variant: "link", size: "sm", onClick: () => onChange({}), children: labels.clearAll })) : null] }), cekmeceDugmesi, extra] })) : (_jsxs("div", { className: "tamga-filter-row", children: [_jsxs("label", { className: "tamga-filter-ara", children: [_jsx("span", { className: "text-small font-bold text-ink-faint", children: labels.search }), aramaKutusu] }), top.map((field) => (_jsxs(Fragment, { children: [field.break ? _jsx("span", { "aria-hidden": true, className: "tamga-filter-genis tamga-filter-kir" }) : null, _jsxs("div", { className: `tamga-filter-genis tamga-filter-alan ${field.kind === "dateRange" ? "" : "tamga-filter-cap"}`, "data-range": field.kind === "dateRange" || undefined, children: [_jsx("span", { className: "text-small font-bold text-ink-faint", children: field.label }), _jsx(FieldControl, { field: field, values: values, write: write, optionSource: optionSource, locale: locale, labels: labels })] })] }, field.key))), cekmeceDugmesi, extra] })), !cipler && active.length > 0 && (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [active.map(([key, value]) => (_jsxs("span", { className: "tamga-token", children: [_jsxs("span", { className: "font-normal text-ink-faint", children: [labelFor(key), ":"] }), valueText(key, value), _jsx("button", { type: "button", className: "tamga-token-x", "aria-label": labels.remove(labelFor(key)), onClick: () => write(key, ""), children: _jsx(Icon, { icon: Close, size: "xs" }) })] }, key))), _jsx(Button, { variant: "link", size: "sm", onClick: () => onChange({}), children: labels.clearAll })] })), _jsx(Sheet, { open: drawerOpen, onClose: () => setDrawerOpen(false), title: cipler ? (labels.filter ?? labels.allFilters) : labels.allFilters, closeLabel: labels.calendar.clear, footer: _jsxs(_Fragment, { children: [_jsx(Button, { type: "button", onClick: () => onChange({}), children: labels.clear }), _jsx(Button, { type: "submit", form: formId, variant: "primary", children: labels.apply })] }), children: _jsxs("form", { id: formId, onSubmit: (e) => {
                         e.preventDefault();
                         setDrawerOpen(false);
-                    }, className: "flex flex-col", children: [drawer.map((group) => (_jsxs("div", { className: "flex flex-col gap-3.5 border-b border-dashed border-line py-4.5 last:border-b-0", children: [_jsx("p", { className: "text-caption font-extrabold uppercase tracking-label text-ink-faint", children: group.title }), _jsx("div", { className: "grid gap-3 sm:grid-cols-[repeat(2,minmax(0,1fr))]", children: group.fields.map((field) => (_jsxs("div", { className: `flex flex-col gap-1.5 ${field.kind === "dateRange" ? "sm:col-span-2" : ""}`, children: [_jsx("span", { className: "text-small text-ink-soft", children: field.label }), _jsx(FieldControl, { field: field, values: values, write: write, optionSource: optionSource, locale: locale, labels: labels })] }, field.key))) })] }, group.title))), fileSearchKey && labels.fileSearch && (_jsxs("div", { children: [_jsx("p", { className: "mb-3 text-micro font-semibold uppercase tracking-wide text-ink-faint", children: labels.fileSearch.title }), _jsx("p", { className: "mb-3 text-small leading-relaxed text-ink-soft", children: labels.fileSearch.help }), values[fileSearchKey] ? (_jsxs("span", { className: "flex items-center gap-2", children: [_jsx("span", { className: "truncate text-small text-ink", children: values[fileSearchKey] }), _jsx(Button, { type: "button", size: "sm", onClick: () => {
+                    }, className: "flex flex-col", children: [top.length > 0 && (_jsx("div", { className: "tamga-filter-dar tamga-filter-grup border-b border-dashed border-line py-4.5 last:border-b-0", children: _jsx("div", { className: "grid gap-3 sm:grid-cols-[repeat(2,minmax(0,1fr))]", children: ustAlanlar("text-small text-ink-soft") }) })), drawer.map((group) => (_jsxs("div", { className: "flex flex-col gap-3.5 border-b border-dashed border-line py-4.5 last:border-b-0", children: [_jsx("p", { className: "text-caption font-extrabold uppercase tracking-label text-ink-faint", children: group.title }), _jsx("div", { className: "grid gap-3 sm:grid-cols-[repeat(2,minmax(0,1fr))]", children: group.fields.map((field) => (_jsxs("div", { className: `flex flex-col gap-1.5 ${field.kind === "dateRange" ? "sm:col-span-2" : ""}`, children: [_jsx("span", { className: "text-small text-ink-soft", children: field.label }), _jsx(FieldControl, { field: field, values: values, write: write, optionSource: optionSource, locale: locale, labels: labels, panel: cipler })] }, field.key))) })] }, group.title))), fileSearchKey && labels.fileSearch && (_jsxs("div", { children: [_jsx("p", { className: "mb-3 text-micro font-semibold uppercase tracking-wide text-ink-faint", children: labels.fileSearch.title }), _jsx("p", { className: "mb-3 text-small leading-relaxed text-ink-soft", children: labels.fileSearch.help }), values[fileSearchKey] ? (_jsxs("span", { className: "flex items-center gap-2", children: [_jsx("span", { className: "truncate text-small text-ink", children: values[fileSearchKey] }), _jsx(Button, { type: "button", size: "sm", onClick: () => {
                                                 write(fileSearchKey, "");
                                                 onFile?.(null);
                                             }, children: labels.fileSearch.remove })] })) : (_jsxs("label", { className: `${buttonVariants({})} cursor-pointer`, children: [_jsx(Icon, { icon: Upload, size: "xs" }), labels.fileSearch.choose, _jsx("input", { type: "file", accept: fileAccept, className: "sr-only", onChange: (e) => {

package/dist/blocks/index.d.ts

@@ -5,7 +5,7 @@
  *
  * Gerekçe: docs/gerekce/08-blok-ve-sablon.md
  */
-export { FilterBar, rangeStart, rangeEnd, type FilterBarLabels, type FilterBarProps, type FilterField, type FilterFieldKind, type FilterGroup, type FilterValues, } from "./filter-bar.js";
+export { FilterBar, rangeStart, rangeEnd, type FilterBarLabels, type FilterBarProps, type FilterField, type FilterFieldKind, type FilterOption, type FilterGroup, type FilterValues, } from "./filter-bar.js";
 export { SaveBar } from "./save-bar.js";
 export { CountRow } from "./count-row.js";
 export { DangerZone, type DangerAction } from "./danger-zone.js";

package/dist/blocks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/blocks/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EACL,SAAS,EACT,UAAU,EACV,QAAQ,EACR,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,KAAK,YAAY,GAClB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,KAAK,YAAY,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/blocks/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EACL,SAAS,EACT,UAAU,EACV,QAAQ,EACR,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,WAAW,EAChB,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,YAAY,GAClB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,KAAK,YAAY,EAAE,MAAM,kBAAkB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"a11y.d.ts","sourceRoot":"","sources":["../../src/components/a11y.ts"],"names":[],"mappings":"AAkCA;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,WAAW,EAAE,IAAI,EAAE,OAAO,uCA0DhE;AAED;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,YAAY,EACZ,OAAO,GACR,EAAE;IACD,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAClD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,QA0DA;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,WAAW,GAAG,cAAc,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,uCAgBlG"}
+{"version":3,"file":"a11y.d.ts","sourceRoot":"","sources":["../../src/components/a11y.ts"],"names":[],"mappings":"AAkCA;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,WAAW,EAAE,IAAI,EAAE,OAAO,uCA0DhE;AAED;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,YAAY,EACZ,OAAO,GACR,EAAE;IACD,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAClD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,QA8DA;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,WAAW,GAAG,cAAc,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,uCAgBlG"}

package/dist/components/a11y.js

@@ -119,6 +119,11 @@ export function useListKeys({ open, containerRef, onClose, }) {
             if (list.length === 0)
                 return;
             const i = list.indexOf(document.activeElement);
+            /* Bir yazı kutusunun içindeyken (panelin araması) Space, Home ve End
+               metnin; yalnız oklar listeye iner. */
+            const yazida = e.target?.tagName === "INPUT";
+            if (yazida && (e.key === " " || e.key === "Home" || e.key === "End"))
+                return;
             switch (e.key) {
                 case "ArrowDown":
                     e.preventDefault();

package/dist/components/advanced-input.d.ts

@@ -72,7 +72,7 @@ export declare function TagsInput({ value, onChange, placeholder, labels, max, c
     /** `data-*` hooks pass through. TR: `data-*` kancaları geçiyor. */
     [k: `data-${string}`]: unknown;
 }): import("react").JSX.Element;
-export declare function MultiSelect({ options, value, onChange, placeholder, labels, className, ...rest }: {
+export declare function MultiSelect({ options, value, onChange, placeholder, labels, "aria-label": ariaLabel, className, ...rest }: {
     options: readonly ({
         value: string;
         label: string;
@@ -86,6 +86,8 @@ export declare function MultiSelect({ options, value, onChange, placeholder, lab
         remove: (label: string) => string;
         open: string;
     };
+    /** The box's accessible name; falls back to `labels.open`. TR: Kutunun erişilebilir adı; yoksa `labels.open`. */
+    "aria-label"?: string;
     className?: string;
     /** `data-*` hooks pass through. TR: `data-*` kancaları geçiyor. */
     [k: `data-${string}`]: unknown;

package/dist/components/advanced-input.d.ts.map

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

package/dist/components/advanced-input.js

@@ -114,7 +114,7 @@ export function TagsInput({ value, onChange, placeholder, labels, max, className
    YETMİYOR: uzun etiketlerde dört çip de üç satırı aşıyor, o yüzden kutunun
    ayrıca bir tavanı var (aşağıda) ve orada kayıyor. */
 const GORUNEN_CIP = 4;
-export function MultiSelect({ options, value, onChange, placeholder, labels, className, ...rest }) {
+export function MultiSelect({ options, value, onChange, placeholder, labels, "aria-label": ariaLabel, className, ...rest }) {
     const id = useId();
     const [open, setOpen] = useState(false);
     const [query, setQuery] = useState("");
@@ -173,7 +173,7 @@ export function MultiSelect({ options, value, onChange, placeholder, labels, cla
                             setQuery(e.target.value);
                             setActive(0);
                             setOpen(true);
-                        }, onKeyDown: tus, onFocus: () => setOpen(true), role: "combobox", "aria-expanded": open, "aria-controls": id, "aria-label": labels.open, className: "min-w-24 flex-1 bg-transparent text-body text-ink outline-none" })] }), open ? (_jsx("div", { id: id, role: "listbox", "aria-multiselectable": true, className: "tamga-overlay tamga-menu absolute z-30 mt-2 max-h-64 w-full overflow-y-auto", children: shown.length === 0 ? (_jsx("p", { className: "px-4 py-3 text-small text-ink-faint", children: labels.empty })) : (shown.map(({ value: v, label: etiket, hint, ...rest }, i) => {
+                        }, onKeyDown: tus, onFocus: () => setOpen(true), role: "combobox", "aria-expanded": open, "aria-controls": id, "aria-label": ariaLabel ?? labels.open, className: "min-w-24 flex-1 bg-transparent text-body text-ink outline-none" })] }), open ? (_jsx("div", { id: id, role: "listbox", "aria-multiselectable": true, className: "tamga-overlay tamga-menu absolute z-30 mt-2 max-h-64 w-full overflow-y-auto", children: shown.length === 0 ? (_jsx("p", { className: "px-4 py-3 text-small text-ink-faint", children: labels.empty })) : (shown.map(({ value: v, label: etiket, hint, ...rest }, i) => {
                     const on = value.includes(v);
                     return (_jsxs("button", { ...rest, type: "button", role: "option", "aria-selected": on, "data-selected": on, "data-active": i === active || undefined, className: "tamga-option w-full", onMouseEnter: () => setActive(i), 
                         /* ODAK GİRDİDE KALIYOR, ve Safari'de bu bir SÜS DEĞİL: Safari

package/dist/components/combobox.d.ts

@@ -9,7 +9,7 @@ export type ComboOption<T extends string> = {
     /** Etiketin altındaki ikinci satır: SKU, e-posta, kategori. */
     hint?: string;
 } & Record<string, unknown>;
-export declare function Combobox<T extends string>({ options, value, onChange, onSearch, placeholder, labels, disabled, invalid, className, ...rest }: {
+export declare function Combobox<T extends string>({ options, value, onChange, onSearch, placeholder, labels, disabled, invalid, "aria-label": ariaLabel, className, ...rest }: {
     options: readonly ComboOption<T>[];
     value?: T;
     onChange?: (next: T | undefined) => void;
@@ -26,6 +26,8 @@ export declare function Combobox<T extends string>({ options, value, onChange, o
     };
     disabled?: boolean;
     invalid?: boolean;
+    /** The box's accessible name when no visible label is bound to it. TR: Bağlı görünür bir etiket yoksa kutunun erişilebilir adı. */
+    "aria-label"?: string;
     className?: string;
     /** `data-*` hooks pass through. TR: `data-*` kancaları geçiyor. */
     [k: `data-${string}`]: unknown;

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;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"}
+{"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,YAAY,EAAE,SAAS,EACvB,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,mIAAmI;IACnI,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BA0IA"}

package/dist/components/combobox.js

@@ -21,7 +21,7 @@ function vurgula(metin, q) {
         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 }) {
+export function Combobox({ options, value, onChange, onSearch, placeholder, labels, disabled = false, invalid = false, "aria-label": ariaLabel, className, ...rest }) {
     const id = useId();
     const [open, setOpen] = useState(false);
     const [query, setQuery] = useState("");
@@ -51,7 +51,7 @@ export function Combobox({ options, value, onChange, onSearch, placeholder, labe
         setQuery("");
         setOpen(false);
     }
-    return (_jsxs("div", { ...dataProps(rest), ref: box, className: cn("relative", className), children: [_jsxs("span", { className: "relative flex items-center", children: [_jsx(Icon, { icon: Search, size: "xs", className: "pointer-events-none absolute left-3 text-ink-faint" }), _jsx("input", { type: "text", role: "combobox", "aria-expanded": open, "aria-controls": `${id}-list`, "aria-autocomplete": "list", "aria-activedescendant": open && shown[active] ? `${id}-opt-${active}` : undefined, "aria-invalid": invalid || undefined, disabled: disabled, placeholder: selected ? selected.label : placeholder, value: query, onFocus: () => setOpen(true), onChange: (e) => {
+    return (_jsxs("div", { ...dataProps(rest), ref: box, className: cn("relative", className), children: [_jsxs("span", { className: "relative flex items-center", children: [_jsx(Icon, { icon: Search, size: "xs", className: "pointer-events-none absolute left-3 text-ink-faint" }), _jsx("input", { type: "text", role: "combobox", "aria-expanded": open, "aria-controls": `${id}-list`, "aria-autocomplete": "list", "aria-activedescendant": open && shown[active] ? `${id}-opt-${active}` : undefined, "aria-label": ariaLabel, "aria-invalid": invalid || undefined, disabled: disabled, placeholder: selected ? selected.label : placeholder, value: query, onFocus: () => setOpen(true), onChange: (e) => {
                             setQuery(e.target.value);
                             setOpen(true);
                             onSearch?.(e.target.value);

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,+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"}
+{"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,+BAsC3D;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

@@ -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: cn("text-accent", direction === "asc" && "rotate-180") })) : (_jsx(Icon, { icon: Sort, size: "xs", className: "text-ink-faint" }))] }) }));
+    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", weight: "regular", className: "text-ink-faint" }))] }) }));
 }
 /**
  * Baş onay kutusu — ve `indeterminate` neden önemli.

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

@@ -85,9 +85,11 @@ export declare function Calendar({ locale, timeZone, value: hamDeger, range, min
  * demektir (`15/04/2026` · `04/15/2026` · `2026-04-15`) ve yanlış okunan bir
  * tarih sessizce yanlış veri üretir. Takvim tek doğru giriş yolu.
  */
-export declare function DatePicker({ id, locale, timeZone, value: hamDeger, onChange, placeholder, labels, min, max, invalid, disabled, className, ...rest }: {
+export declare function DatePicker({ id, "aria-label": ariaLabel, locale, timeZone, value: hamDeger, onChange, placeholder, labels, min, max, invalid, disabled, className, ...rest }: {
     /** Reaches the field, so `Field htmlFor` can bind. TR: Alana iner, `Field htmlFor` bağlanabilir. */
     id?: string;
+    /** The field's accessible name when no visible label is bound to it. TR: Bağlı görünür bir etiket yoksa alanın erişilebilir adı. */
+    "aria-label"?: string;
     locale: string;
     /** Which day is "today"; see `Calendar`. TR: "Bugün" hangi gün; bkz. `Calendar`. */
     timeZone?: string;
@@ -120,9 +122,11 @@ export declare function DatePicker({ id, locale, timeZone, value: hamDeger, onCh
  * aday an sınırı deliyorsa en yakın geçerli saate kısılır ve seçimler ona
  * çekilir. Gerekçe: docs/gerekce/01-form-ve-girdi.md
  */
-export declare function DateTimePicker({ id, locale, timeZone, value, onChange, placeholder, labels, min, max, minuteStep, invalid, disabled, className, ...rest }: {
+export declare function DateTimePicker({ id, "aria-label": ariaLabel, locale, timeZone, value, onChange, placeholder, labels, min, max, minuteStep, invalid, disabled, className, ...rest }: {
     /** Reaches the field, so `Field htmlFor` can bind. TR: Alana iner, `Field htmlFor` bağlanabilir. */
     id?: string;
+    /** The field's accessible name when no visible label is bound to it. TR: Bağlı görünür bir etiket yoksa alanın erişilebilir adı. */
+    "aria-label"?: string;
     locale: string;
     /**
      * The IANA zone the clock is shown and picked in, e.g. the workspace's `Europe/Istanbul`.

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

package/dist/components/date-picker.js

@@ -255,8 +255,8 @@ export function Calendar({ locale, timeZone, value: hamDeger, range, min: hamMin
                         }) }, si)))] })] }));
 }
 /* ── Ortak alan: salt okunur girdi + temizle/aç düğmeleri ── */
-function Alan({ id, shown, placeholder, disabled, invalid, open, hasValue, labels, onToggle, onClear, }) {
-    return (_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", { id: id, type: "text", readOnly: true, disabled: disabled, value: shown, placeholder: placeholder, onClick: () => !disabled && onToggle(), className: "tamga-input w-full cursor-pointer pr-16 pl-9", "aria-haspopup": "dialog", "aria-expanded": open, "aria-invalid": invalid || undefined }), _jsxs("span", { className: "absolute right-1.5 flex gap-0.5", children: [hasValue ? (_jsx("button", { type: "button", className: "tamga-mini-btn", "data-inset": "true", "aria-label": labels.clear, disabled: disabled, onClick: () => !disabled && onClear(), children: _jsx(Icon, { icon: Close, size: "xs" }) })) : null, _jsx("button", { type: "button", className: "tamga-mini-btn", "data-inset": "true", "aria-label": labels.open, disabled: disabled, onClick: () => !disabled && onToggle(), children: _jsx(Icon, { icon: CalendarPlus, size: "xs" }) })] })] }));
+function Alan({ id, ariaLabel, shown, placeholder, disabled, invalid, open, hasValue, labels, onToggle, onClear, }) {
+    return (_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", { id: id, type: "text", readOnly: true, disabled: disabled, value: shown, placeholder: placeholder, onClick: () => !disabled && onToggle(), className: "tamga-input w-full cursor-pointer pr-16 pl-9", "aria-haspopup": "dialog", "aria-expanded": open, "aria-label": ariaLabel, "aria-invalid": invalid || undefined }), _jsxs("span", { className: "absolute right-1.5 flex gap-0.5", children: [hasValue ? (_jsx("button", { type: "button", className: "tamga-mini-btn", "data-inset": "true", "aria-label": labels.clear, disabled: disabled, onClick: () => !disabled && onClear(), children: _jsx(Icon, { icon: Close, size: "xs" }) })) : null, _jsx("button", { type: "button", className: "tamga-mini-btn", "data-inset": "true", "aria-label": labels.open, disabled: disabled, onClick: () => !disabled && onToggle(), children: _jsx(Icon, { icon: CalendarPlus, size: "xs" }) })] })] }));
 }
 /**
  * Alan + açılan takvim.
@@ -265,7 +265,7 @@ function Alan({ id, shown, placeholder, disabled, invalid, open, hasValue, label
  * demektir (`15/04/2026` · `04/15/2026` · `2026-04-15`) ve yanlış okunan bir
  * tarih sessizce yanlış veri üretir. Takvim tek doğru giriş yolu.
  */
-export function DatePicker({ id, locale, timeZone, value: hamDeger, onChange, placeholder, labels, min, max, invalid = false, disabled = false, className, ...rest }) {
+export function DatePicker({ id, "aria-label": ariaLabel, locale, timeZone, value: hamDeger, onChange, placeholder, labels, min, max, invalid = false, disabled = false, className, ...rest }) {
     const [open, setOpen] = useState(false);
     /* Takvim dışarı tıklayınca ve Escape ile kapanıyor; kutu tetiği de kapsıyor. */
     const kapat = useCallback(() => setOpen(false), []);
@@ -275,7 +275,7 @@ export function DatePicker({ id, locale, timeZone, value: hamDeger, onChange, pl
     const shown = value
         ? new Intl.DateTimeFormat(locale, { dateStyle: "medium", timeZone: "UTC" }).format(new Date(`${value}T00:00:00Z`))
         : "";
-    return (_jsxs("div", { ref: kutu, ...dataProps(rest), className: cn("relative", className), children: [_jsx(Alan, { id: id, shown: shown, placeholder: placeholder, disabled: disabled, invalid: invalid, open: open, hasValue: Boolean(value), labels: labels, onToggle: () => setOpen((v) => !v), onClear: () => onChange?.(undefined) }), open ? (_jsx("div", { className: "tamga-overlay absolute z-30 mt-2 p-3", onClick: (e) => e.stopPropagation(), children: _jsx(Calendar, { locale: locale, timeZone: timeZone, value: value, min: min, max: max, labels: labels, onSelect: (d) => { onChange?.(d); setOpen(false); } }) })) : null] }));
+    return (_jsxs("div", { ref: kutu, ...dataProps(rest), className: cn("relative", className), children: [_jsx(Alan, { id: id, ariaLabel: ariaLabel, shown: shown, placeholder: placeholder, disabled: disabled, invalid: invalid, open: open, hasValue: Boolean(value), labels: labels, onToggle: () => setOpen((v) => !v), onClear: () => onChange?.(undefined) }), open ? (_jsx("div", { className: "tamga-overlay absolute z-30 mt-2 p-3", onClick: (e) => e.stopPropagation(), children: _jsx(Calendar, { locale: locale, timeZone: timeZone, value: value, min: min, max: max, labels: labels, onSelect: (d) => { onChange?.(d); setOpen(false); } }) })) : null] }));
 }
 /**
  * Tarih + saat. AYRI BİR BİLEŞEN, `DatePicker`a bir prop değil: dönen değerin
@@ -286,7 +286,7 @@ export function DatePicker({ id, locale, timeZone, value: hamDeger, onChange, pl
  * aday an sınırı deliyorsa en yakın geçerli saate kısılır ve seçimler ona
  * çekilir. Gerekçe: docs/gerekce/01-form-ve-girdi.md
  */
-export function DateTimePicker({ id, locale, timeZone, value, onChange, placeholder, labels, min, max, minuteStep = 5, invalid = false, disabled = false, className, ...rest }) {
+export function DateTimePicker({ id, "aria-label": ariaLabel, locale, timeZone, value, onChange, placeholder, labels, min, max, minuteStep = 5, invalid = false, disabled = false, className, ...rest }) {
     const tz = useMemo(() => dilim(timeZone), [timeZone]);
     const [open, setOpen] = useState(false);
     const kapat = useCallback(() => setOpen(false), []);
@@ -384,7 +384,7 @@ export function DateTimePicker({ id, locale, timeZone, value, onChange, placehol
     }, [locale, onIki, labels.am, labels.pm]);
     const saatEtiketi = (h) => (donem ? String(h % 12 === 0 ? 12 : h % 12) : p2(h));
     const shown = an ? new Intl.DateTimeFormat(locale, { dateStyle: "medium", timeStyle: "short", timeZone: tz }).format(an) : "";
-    return (_jsxs("div", { ref: kutu, ...dataProps(rest), className: cn("relative", className), children: [_jsx(Alan, { id: id, shown: shown, placeholder: placeholder, disabled: disabled, invalid: invalid, open: open, hasValue: Boolean(value), labels: labels, onToggle: () => setOpen((v) => !v), onClear: () => onChange?.(undefined) }), open ? (_jsxs("div", { className: "tamga-overlay absolute z-30 mt-2 p-3", onClick: (e) => e.stopPropagation(), children: [_jsx(Calendar, { locale: locale, timeZone: tz, value: gun, min: minGun, max: maxGun, labels: labels, 
+    return (_jsxs("div", { ref: kutu, ...dataProps(rest), className: cn("relative", className), children: [_jsx(Alan, { id: id, ariaLabel: ariaLabel, shown: shown, placeholder: placeholder, disabled: disabled, invalid: invalid, open: open, hasValue: Boolean(value), labels: labels, onToggle: () => setOpen((v) => !v), onClear: () => onChange?.(undefined) }), open ? (_jsxs("div", { className: "tamga-overlay absolute z-30 mt-2 p-3", onClick: (e) => e.stopPropagation(), children: [_jsx(Calendar, { locale: locale, timeZone: tz, value: gun, min: minGun, max: maxGun, labels: labels, 
                         /* Gün seçilince takvim AÇIK KALIYOR: saat daha seçilecek. */
                         onSelect: (d) => yay(d, saat, dakika) }), _jsxs("div", { className: "mt-3 flex items-center gap-2 border-t border-line pt-3", children: [_jsx(Select, { "aria-label": labels.hour, placeholder: labels.hour, disabled: !g, value: String(saat), onChange: (v) => yay(g, Number(v), dakika), options: (donem ? saatler.filter((h) => (saat < 12 ? h < 12 : h >= 12)) : saatler).map((h) => ({ value: String(h), label: saatEtiketi(h) })) }), _jsx(Select, { "aria-label": labels.minute, placeholder: labels.minute, disabled: !g, value: String(dakika), onChange: (v) => yay(g, saat, Number(v)), options: dakikalar.map((m) => ({ value: String(m), label: p2(m) })) }), donem ? (_jsx(Select, { "aria-label": labels.period, placeholder: labels.period, disabled: !g, value: saat < 12 ? "am" : "pm", onChange: (v) => yay(g, v === "am" ? saat % 12 : (saat % 12) + 12, dakika), options: [{ value: "am", label: donem.am }, { value: "pm", label: donem.pm }] })) : null] })] })) : null] }));
 }

package/dist/components/progress.d.ts

@@ -8,7 +8,7 @@ import { type Tone } from "./tone.js";
  *
  * Gerekçe: docs/gerekce/03-grafik-ve-olcum.md
  */
-export declare function Progress({ value, look, blocks, segments, label, valueText, ariaLabel, className, ...rest }: {
+export declare function Progress({ value, look, blocks, segments, label, valueText, ariaLabel, size, tone, className, ...rest }: {
     /**
      * 0–100; clamped, so a bad number cannot paint outside the track. `split` ignores it and reads
      * `segments` instead. TR: 0–100; sınırlanıyor, yani kötü bir sayı yolun dışına boyayamıyor.
@@ -54,6 +54,18 @@ export declare function Progress({ value, look, blocks, segments, label, valueTe
      * bir etiket yoksa erişilebilir ad
      */
     ariaLabel?: string;
+    /**
+     * `md` the page's bar: 16px, edged, striped, with the label line. `sm` a 4px line for a table
+     * cell: no edge, no label line; width is the caller's (`className`). Only for `bar`. TR: `md`
+     * sayfanın çubuğu: 16px, kenarlı, çizgili, etiket satırlı. `sm` tablo hücresi için 4px'lik
+     * çizgi: kenarsız, etiketsiz; genişlik çağıranın (`className`). Yalnız `bar` için.
+     */
+    size?: "md" | "sm";
+    /**
+     * The fill's colour from the kit's tone roles; absent, the accent. TR: Dolgunun rengi kitin
+     * ton rollerinden; yoksa vurgu.
+     */
+    tone?: Tone;
     className?: string;
     /** `data-*` hooks pass through. TR: `data-*` kancaları geçiyor. */
     [k: `data-${string}`]: unknown;

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

@@ -1 +1 @@
-{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../src/components/progress.tsx"],"names":[],"mappings":"AACA,OAAO,EAAqB,KAAK,IAAI,EAAE,MAAM,WAAW,CAAC;AACzD;;;;;;;;GAQG;AAEH,wBAAgB,QAAQ,CAAC,EACvB,KAAS,EACT,IAAY,EACZ,MAAW,EACX,QAAQ,EACR,KAAK,EACL,SAAS,EACT,SAAS,EACT,SAAc,EACd,GAAG,IAAI,EACR,EAAE;IACD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAC;IAClC,wGAAwG;IACxG,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,IAAI,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAAE,CAAC;IACjG;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAqFA"}
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../src/components/progress.tsx"],"names":[],"mappings":"AACA,OAAO,EAAqB,KAAK,IAAI,EAAE,MAAM,WAAW,CAAC;AACzD;;;;;;;;GAQG;AAEH,wBAAgB,QAAQ,CAAC,EACvB,KAAS,EACT,IAAY,EACZ,MAAW,EACX,QAAQ,EACR,KAAK,EACL,SAAS,EACT,SAAS,EACT,IAAW,EACX,IAAI,EACJ,SAAc,EACd,GAAG,IAAI,EACR,EAAE;IACD;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAC;IAClC,wGAAwG;IACxG,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,IAAI,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAAE,CAAC;IACjG;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAqFA"}

package/dist/components/progress.js

@@ -11,9 +11,9 @@ import { toneOf, yiginRenk } from "./tone.js";
  *
  * Gerekçe: docs/gerekce/03-grafik-ve-olcum.md
  */
-export function Progress({ value = 0, look = "bar", blocks = 10, segments, label, valueText, ariaLabel, className = "", ...rest }) {
+export function Progress({ value = 0, look = "bar", blocks = 10, segments, label, valueText, ariaLabel, size = "md", tone, className = "", ...rest }) {
     const pct = Math.max(0, Math.min(100, value));
-    const ust = label || valueText ? (_jsxs("div", { className: "tamga-progress-ust", children: [_jsx("span", { children: label }), _jsx("span", { className: "tamga-progress-deger", children: valueText ?? `%${Math.round(pct)}` })] })) : null;
+    const ust = (label || valueText) && size === "md" ? (_jsxs("div", { className: "tamga-progress-ust", children: [_jsx("span", { children: label }), _jsx("span", { className: "tamga-progress-deger", children: valueText ?? `%${Math.round(pct)}` })] })) : null;
     if (look === "blocks") {
         /* SON DOLU HÜCRE AÇIK TONDA: "burada duruyoruz" diyen tek işaret o · hepsi
            aynı dolulukta olduğunda saymak gerekiyor, oysa sayı zaten üstte yazılı. */
@@ -25,5 +25,5 @@ export function Progress({ value = 0, look = "bar", blocks = 10, segments, label
         const toplam = paylar.reduce((n, p) => n + p.value, 0) || 1;
         return (_jsxs("div", { ...dataProps(rest), className: className, children: [ust, _jsx("div", { className: "tamga-progress-split", role: "img", "aria-label": label ?? ariaLabel ?? "Progress", children: paylar.map(({ value: v, tone, label: _etiket, ...kanca }, i) => (_createElement("span", { ...kanca, key: i, style: { width: `${(v / toplam) * 100}%`, background: tone ? toneOf(tone).mark : yiginRenk(i) } }))) }), paylar.some((p) => p.label) ? (_jsx("div", { className: "tamga-progress-lejant", children: paylar.map((p, i) => (p.label ? _jsx("span", { children: p.label }, i) : null)) })) : null] }));
     }
-    return (_jsxs("div", { ...dataProps(rest), className: className, children: [ust, _jsx("div", { className: "tamga-progress", role: "progressbar", "aria-valuenow": Math.round(pct), "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": label ?? ariaLabel ?? "Progress", children: _jsx("div", { className: "tamga-progress-fill", style: { width: `${pct}%` } }) })] }));
+    return (_jsxs("div", { ...dataProps(rest), className: className, children: [ust, _jsx("div", { className: size === "sm" ? "tamga-progress tamga-progress-sm" : "tamga-progress", role: "progressbar", "aria-valuenow": Math.round(pct), "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": label ?? ariaLabel ?? "Progress", children: _jsx("div", { className: "tamga-progress-fill", style: tone ? { width: `${pct}%`, background: toneOf(tone).mark } : { width: `${pct}%` } }) })] }));
 }

package/dist/components/select-panel.d.ts

@@ -0,0 +1,69 @@
+import type { Tone } from "./tone.js";
+/**
+ * SelectPanel · düğmeden açılan seçim paneli: başlık, isteğe bağlı arama,
+ * seçenekler. Tetik bir DÜĞME, metin kutusu değil: `Combobox`un kutusu
+ * "buraya yaz" diyordu ve bir seçim yapıldığı anlaşılmıyordu.
+ *
+ * Gerekçe: docs/gerekce/01-form-ve-girdi.md
+ */
+export type SelectPanelOption = {
+    value: string;
+    label: string;
+    /** A state's colour square before the label, as in `Select`. TR: Etiketin önünde durum karesi, `Select`teki gibi. */
+    tone?: Tone;
+    /** The quiet second text beside the label: "2-3 days". TR: Etiketin yanındaki sessiz ikinci metin: "2-3 gün". */
+    hint?: string;
+} & Record<string, unknown>;
+type Ortak = {
+    options: readonly SelectPanelOption[];
+    /** The line at the top of the panel: "Choose a carrier". TR: Panelin üstündeki satır: "Kargo seçin". */
+    title: string;
+    /** The trigger's text when nothing is chosen. TR: Hiçbir şey seçili değilken tetiğin metni. */
+    placeholder: string;
+    /** The trigger's accessible name; the visible text is a value, not a name. TR: Tetiğin erişilebilir adı; görünen metin bir değer, ad değil. */
+    "aria-label": string;
+    /**
+     * A search box under the title; focus lands there on open, the list filters as you type.
+     * TR: Başlığın altında arama kutusu; açılınca odak orada, yazdıkça liste süzülür.
+     */
+    searchable?: boolean;
+    /**
+     * Single choice only: a first option named like this, worth the empty value. Chosen, the
+     * value empties; while searching it stays at the top. The way back sits where the way in
+     * was. TR: Yalnız tek seçimde: bu adla, boş değerli bir ilk seçenek. Seçilince değer boşalır;
+     * ararken de başta kalır. Geri dönüş yolu gidiş yoluyla aynı yerde.
+     */
+    allLabel?: string;
+    /** Text before the value in the trigger: "Status:". TR: Tetikte değerin önündeki metin: "Durum:". */
+    prefix?: string;
+    /** The caret at the trigger's end; off for a chip that carries its own remove button. TR: Tetiğin ucundaki ok; kendi kaldırma düğmesini taşıyan çipte kapalı. */
+    caret?: boolean;
+    /** The trigger's look, from `Button`. TR: Tetiğin görünümü, `Button`dan. */
+    variant?: "secondary" | "soft" | "ghost";
+    /** The trigger's size, from `Button`. TR: Tetiğin boyu, `Button`dan. */
+    size?: "base" | "sm";
+    disabled?: boolean;
+    labels: {
+        /** Shown when the search matches nothing. TR: Arama hiçbir şeyle eşleşmeyince. */
+        noMatch: string;
+        /** The search box's name and placeholder; falls back to `title`. TR: Arama kutusunun adı ve yer tutucusu; yoksa `title`. */
+        search?: string;
+        /** Multiple only: the button under the list that empties the choice. TR: Yalnız çoklu: listenin altında seçimi boşaltan düğme. */
+        clear?: string;
+    };
+    className?: string;
+    /** `data-*` hooks pass through. TR: `data-*` kancaları geçiyor. */
+    [k: `data-${string}`]: unknown;
+};
+export type SelectPanelProps = Ortak & ({
+    multiple?: false;
+    value?: string;
+    onChange: (next: string) => void;
+} | {
+    multiple: true;
+    value: readonly string[];
+    onChange: (next: string[]) => void;
+});
+export declare function SelectPanel({ options, title, placeholder, "aria-label": ariaLabel, searchable, allLabel, prefix, caret, variant, size, disabled, labels, className, multiple, value, onChange, ...rest }: SelectPanelProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=select-panel.d.ts.map

package/dist/components/select-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-panel.d.ts","sourceRoot":"","sources":["../../src/components/select-panel.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAGtC;;;;;;GAMG;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,qHAAqH;IACrH,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,iHAAiH;IACjH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAE5B,KAAK,KAAK,GAAG;IACX,OAAO,EAAE,SAAS,iBAAiB,EAAE,CAAC;IACtC,wGAAwG;IACxG,KAAK,EAAE,MAAM,CAAC;IACd,+FAA+F;IAC/F,WAAW,EAAE,MAAM,CAAC;IACpB,+IAA+I;IAC/I,YAAY,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qGAAqG;IACrG,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,iKAAiK;IACjK,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,4EAA4E;IAC5E,OAAO,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,OAAO,CAAC;IACzC,wEAAwE;IACxE,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE;QACN,kFAAkF;QAClF,OAAO,EAAE,MAAM,CAAC;QAChB,4HAA4H;QAC5H,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,kIAAkI;QAClI,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,KAAK,GAClC,CACI;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;CAAE,GAEtE;IAAE,QAAQ,EAAE,IAAI,CAAC;IAAC,KAAK,EAAE,SAAS,MAAM,EAAE,CAAC;IAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;CAAE,CACnF,CAAC;AAEJ,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,KAAK,EACL,WAAW,EACX,YAAY,EAAE,SAAS,EACvB,UAAkB,EAClB,QAAQ,EACR,MAAM,EACN,KAAY,EACZ,OAAqB,EACrB,IAAa,EACb,QAAgB,EAChB,MAAM,EACN,SAAS,EACT,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,gBAAgB,+BAoIlB"}

package/dist/components/select-panel.js

@@ -0,0 +1,68 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
+import { useCallback, useEffect, useId, useRef, useState } from "react";
+import { useDismiss, useListKeys } from "./a11y.js";
+import { buttonVariants } from "./button.js";
+import { cn } from "../lib/cn.js";
+import { dataProps } from "../lib/data-props.js";
+import { Icon } from "./icon.js";
+import { CaretDown, Check, Search } from "./icons.js";
+import { Input } from "./input.js";
+import { toneOf } from "./tone.js";
+export function SelectPanel({ options, title, placeholder, "aria-label": ariaLabel, searchable = false, allLabel, prefix, caret = true, variant = "secondary", size = "base", disabled = false, labels, className, multiple, value, onChange, ...rest }) {
+    const id = useId();
+    const [open, setOpen] = useState(false);
+    const [sorgu, setSorgu] = useState("");
+    const tetik = useRef(null);
+    const liste = useRef(null);
+    const arama = useRef(null);
+    const kapat = useCallback(() => setOpen(false), []);
+    const kutu = useDismiss(open, kapat);
+    /* Klavyeyle kapanınca odak tetiğe döner: panel kaybolup odak gövdeye düşerse
+       ekran okuyucu kullanıcısı nerede olduğunu kaybediyor. */
+    const kapatOdakla = useCallback(() => {
+        setOpen(false);
+        tetik.current?.focus();
+    }, []);
+    useListKeys({ open, containerRef: kutu, onClose: kapatOdakla });
+    useEffect(() => {
+        if (!open) {
+            setSorgu("");
+            return;
+        }
+        if (searchable)
+            arama.current?.focus();
+        else
+            liste.current?.querySelector("[data-tamga-option]")?.focus();
+    }, [open, searchable]);
+    const secili = multiple ? value : value ? [value] : [];
+    const seciliSecenekler = secili
+        .map((v) => options.find((o) => o.value === v))
+        .filter((o) => Boolean(o));
+    const q = sorgu.trim().toLocaleLowerCase();
+    const gorunen = q ? options.filter((o) => o.label.toLocaleLowerCase().includes(q)) : options;
+    const sec = (v) => {
+        if (multiple) {
+            const simdiki = value;
+            onChange(simdiki.includes(v) ? simdiki.filter((x) => x !== v) : [...simdiki, v]);
+            return;
+        }
+        onChange(v);
+        kapatOdakla();
+    };
+    const ozet = seciliSecenekler.length === 0
+        ? null
+        : multiple && seciliSecenekler.length > 1
+            ? `${seciliSecenekler[0].label} +${seciliSecenekler.length - 1}`
+            : seciliSecenekler[0].label;
+    const secenek = (o, kanca = {}) => {
+        const isaretli = secili.includes(o.value) || (o.value === "" && secili.length === 0);
+        return (_createElement("button", { ...kanca, key: o.value || "*", type: "button", role: "option", "aria-selected": isaretli, "data-tamga-option": true, "data-selected": isaretli, className: "tamga-option", onClick: () => sec(o.value) },
+            o.tone ? _jsx("span", { "aria-hidden": true, className: "tamga-mark shrink-0", style: { background: toneOf(o.tone).mark } }) : null,
+            _jsx("span", { className: "min-w-0 flex-1 truncate", children: o.label }),
+            o.hint ? _jsx("span", { className: "shrink-0 text-small text-ink-faint", children: o.hint }) : null,
+            isaretli ? _jsx(Icon, { icon: Check, size: "xs", weight: "bold", className: "shrink-0 text-[var(--color-accent-line)]" }) : null));
+    };
+    return (_jsxs("div", { ...dataProps(rest), ref: kutu, className: cn("tamga-select-panel", className), children: [_jsxs("button", { ref: tetik, type: "button", className: cn(buttonVariants({ variant, size }), "tamga-select-panel-tetik"), "aria-haspopup": "listbox", "aria-expanded": open, "aria-controls": open ? `${id}-liste` : undefined, "aria-label": ariaLabel, "data-set": ozet ? "true" : undefined, disabled: disabled || undefined, onClick: () => setOpen((o) => !o), children: [prefix ? _jsx("span", { className: "tamga-select-panel-onek", children: prefix }) : null, _jsx("span", { className: cn("min-w-0 truncate", ozet ? "" : "tamga-select-panel-bos"), children: ozet ?? placeholder }), caret ? _jsx(Icon, { icon: CaretDown, size: "xs", weight: "bold", className: "shrink-0" }) : null] }), open ? (_jsxs("div", { className: "tamga-overlay tamga-menu tamga-select-panel-kutu", children: [_jsx("span", { className: "tamga-menu-baslik", children: title }), searchable ? (_jsxs("span", { className: "tamga-select-panel-arama", children: [_jsx(Icon, { icon: Search, size: "xs", "aria-hidden": true, className: "pointer-events-none absolute left-2.5 text-ink-faint" }), _jsx(Input, { ref: arama, type: "search", full: true, leading: true, size: "sm", "aria-label": labels.search ?? title, placeholder: labels.search ?? title, value: sorgu, onChange: (e) => setSorgu(e.target.value) })] })) : null, _jsxs("div", { ref: liste, id: `${id}-liste`, role: "listbox", "aria-label": title, "aria-multiselectable": multiple || undefined, className: "tamga-select-panel-liste", children: [allLabel && !multiple ? secenek({ value: "", label: allLabel }) : null, gorunen.map(({ value: v, label, tone, hint, ...kanca }) => secenek({ value: v, label, tone, hint }, kanca)), gorunen.length === 0 ? _jsx("span", { className: "tamga-select-panel-yok", children: labels.noMatch }) : null] }), multiple && labels.clear ? (_jsx("span", { className: "tamga-select-panel-alt", children: _jsx("button", { type: "button", className: "tamga-link", onClick: () => onChange([]), children: labels.clear }) })) : null] })) : null] }));
+}

package/dist/fonts.css

@@ -1,4 +1,4 @@
-/*! tamga-ui 0.7.2 · MIT · https://tamga.org.tr */
+/*! tamga-ui 0.8.0 · MIT · https://tamga.org.tr */
 @font-face {
   font-family: "Red Hat Display";
   font-style: normal;

package/dist/index.d.ts

@@ -10,6 +10,7 @@ export { type Tone, type ToneStyle, tones, toneOf, TONE_RANK, rankOf, neutral, a
 export { useFocusTrap, useListKeys } from "./components/a11y.js";
 export { Button, buttonVariants, type ButtonProps, IconButton, iconButtonVariants, MiniButton, } from "./components/button.js";
 export { Input, InputGroup, inputVariants, type InputProps, Textarea, type TextareaProps } from "./components/input.js";
+export { SelectPanel, type SelectPanelOption, type SelectPanelProps } from "./components/select-panel.js";
 export { Checkbox } from "./components/checkbox.js";
 export { RadioGroup } from "./components/radio-group.js";
 export { Switch } from "./components/switch.js";

package/dist/index.d.ts.map

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

package/dist/index.js

@@ -12,6 +12,7 @@ export { useFocusTrap, useListKeys } from "./components/a11y.js";
 /* --- controls ---------------------------------------------------------- */
 export { Button, buttonVariants, IconButton, iconButtonVariants, MiniButton, } from "./components/button.js";
 export { Input, InputGroup, inputVariants, Textarea } from "./components/input.js";
+export { SelectPanel } from "./components/select-panel.js";
 /* --- seçim kontrolleri -------------------------------------------------- */
 export { Checkbox } from "./components/checkbox.js";
 export { RadioGroup } from "./components/radio-group.js";

package/dist/kit.css

@@ -1,4 +1,4 @@
-/*! tamga-ui 0.7.2 · MIT · https://tamga.org.tr */
+/*! tamga-ui 0.8.0 · MIT · https://tamga.org.tr */
 :root {
 
   --overlay-gap: 8px;
@@ -1101,6 +1101,142 @@
     cursor: pointer;
   }
 
+  .tamga-filter-bar {
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+    padding: 16px;
+  }
+
+  [data-filters] > .tamga-filter-bar {
+    flex: 1 1 100%;
+    padding: 0;
+    border: 0;
+    border-radius: 0;
+    background: none;
+    box-shadow: none;
+  }
+
+  .tamga-filter-ara,
+  .tamga-filter-alan {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+    min-width: 0;
+  }
+  .tamga-filter-ara {
+    flex: 2 1 18.75rem;
+  }
+  .tamga-filter-alan {
+    flex: 1 1 10rem;
+  }
+  .tamga-filter-alan[data-range] {
+    flex-basis: 20rem;
+  }
+
+  .tamga-filter-kir {
+    height: 0;
+    flex-basis: 100%;
+  }
+
+  .tamga-filter-grup {
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+  }
+
+  .tamga-filter-cips {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: flex-end;
+    gap: 8px;
+  }
+  .tamga-filter-ara-sabit {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+    min-width: 0;
+    max-width: 100%;
+    flex: 0 0 17.5rem;
+  }
+  .tamga-filter-cip-sira {
+    display: contents;
+  }
+  .tamga-filter-cip {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+    max-width: 100%;
+  }
+  .tamga-filter-cip-x {
+    display: grid;
+    place-items: center;
+    width: calc(var(--control) - 8px);
+    height: calc(var(--control) - 8px);
+    flex-shrink: 0;
+    border: 1.5px solid var(--color-edge-strong);
+    border-radius: var(--radius-ctl);
+    background: var(--color-accent-soft);
+    color: var(--color-accent-soft-ink);
+    box-shadow: 3px 3px 0 var(--color-edge-strong);
+    cursor: pointer;
+  }
+  .tamga-filter-cip-x:hover {
+    transform: translate(-1px, -1px);
+    box-shadow: 4px 4px 0 var(--color-edge-strong);
+  }
+  .tamga-filter-cip-x:active {
+    transform: translate(3px, 3px);
+    box-shadow: 0 0 0 var(--color-edge-strong);
+  }
+
+  .tamga-select-panel-tam,
+  .tamga-select-panel-tam > .tamga-select-panel-tetik {
+    display: flex;
+    width: 100%;
+  }
+  .tamga-select-panel-tam > .tamga-select-panel-tetik {
+    justify-content: flex-start;
+  }
+  .tamga-select-panel-tam > .tamga-select-panel-tetik > .tamga-select-panel-bos,
+  .tamga-select-panel-tam > .tamga-select-panel-tetik > span:not(.tamga-select-panel-onek) {
+    flex: 1;
+    text-align: start;
+  }
+
+  @media (max-width: 39.9375rem) {
+    .tamga-filter-genis {
+      display: none;
+    }
+    .tamga-filter-row > .tamga-filter-ara {
+      flex-basis: 0;
+    }
+
+    .tamga-filter-cips > .tamga-filter-ara-sabit {
+      flex: 1 1 0;
+    }
+    .tamga-filter-cips .tamga-filter-cip:not([data-set]) {
+      display: none;
+    }
+    .tamga-filter-cip-sira {
+      display: flex;
+      order: 2;
+      flex: 1 1 100%;
+      flex-wrap: nowrap;
+      gap: 8px;
+      overflow-x: auto;
+      scrollbar-width: none;
+    }
+    .tamga-filter-cip-sira:empty {
+      display: none;
+    }
+  }
+  @media (min-width: 40rem) {
+    .tamga-filter-dar {
+      display: none;
+    }
+  }
+
   .tamga-filter-row {
     --filter-gap: 12px;
     display: flex;
@@ -3006,6 +3142,16 @@
     transition: width var(--duration-base) var(--ease-standard);
   }
 
+  .tamga-progress-sm {
+    height: 4px;
+    border: 0;
+    box-shadow: none;
+  }
+  .tamga-progress-sm > .tamga-progress-fill {
+    background: var(--color-accent);
+    border-right: 0;
+  }
+
   .tamga-progress-bloklar {
     display: grid;
     gap: 4px;
@@ -3077,6 +3223,59 @@
     padding: 5px;
   }
 
+  .tamga-select-panel {
+    position: relative;
+    display: inline-flex;
+    max-width: 100%;
+  }
+  .tamga-select-panel-tetik {
+    max-width: 100%;
+  }
+  .tamga-select-panel-onek {
+    font-weight: var(--weight-body);
+  }
+  .tamga-select-panel-bos {
+    color: var(--color-ink-faint);
+    font-weight: var(--weight-body);
+  }
+  .tamga-select-panel-kutu {
+    position: absolute;
+    left: 0;
+    top: var(--overlay-below);
+    z-index: 40;
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    min-width: 15rem;
+    max-width: 22rem;
+  }
+  .tamga-select-panel-arama {
+    position: relative;
+    display: flex;
+    align-items: center;
+    padding: 2px 5px 6px;
+  }
+  .tamga-select-panel-liste {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    max-height: 18rem;
+    overflow-y: auto;
+  }
+  .tamga-select-panel-yok {
+    display: block;
+    padding: 8px 10px;
+    font-size: var(--text-small);
+    color: var(--color-ink-faint);
+  }
+  .tamga-select-panel-alt {
+    display: flex;
+    justify-content: flex-end;
+    padding: 6px 10px 4px;
+    border-top: 1px dashed var(--color-line);
+    font-size: var(--text-small);
+  }
+
   .tamga-option {
     display: flex;
     width: 100%;
@@ -3431,6 +3630,13 @@
     letter-spacing: inherit;
   }
 
+  .tamga-card .tamga-table thead th:first-child {
+    border-start-start-radius: calc(var(--radius-card) - 1px);
+  }
+  .tamga-card .tamga-table thead th:last-child {
+    border-start-end-radius: calc(var(--radius-card) - 1px);
+  }
+
   .tamga-table tbody tr {
 
     font-size: 14px;

package/dist/styles.css

@@ -1,4 +1,4 @@
-/*! tamga-ui 0.7.2 · MIT · https://tamga.org.tr */
+/*! tamga-ui 0.8.0 · MIT · https://tamga.org.tr */
 @import "./fonts.css";
 @import "./theme.css";
 @import "./kit.css";

package/dist/theme.css

@@ -1,4 +1,4 @@
-/*! tamga-ui 0.7.2 · MIT · https://tamga.org.tr */
+/*! tamga-ui 0.8.0 · MIT · https://tamga.org.tr */
 @custom-variant dark (&:is(.dark *));
 
 @theme static {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tamga-ui",
-  "version": "0.7.2",
+  "version": "0.8.0",
   "description": "Mantıksal's shared interface library: tokens, physics and components.",
   "license": "MIT",
   "type": "module",