tamga-ui 0.8.1 → 0.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -5,6 +5,59 @@ Versions follow [semver](https://semver.org/). Through `0.x`, breaking changes m
5
5
 
6
6
  > 🇹🇷 Türkçe için [tamga.org.tr/tr](https://tamga.org.tr/tr).
7
7
 
8
+ ## 0.10.0
9
+
10
+ > The busy spinner picks its shape and sits in the centre; the radio mark stays put when chosen.
11
+
12
+ ### Added
13
+
14
+ - **`Button` `busyLook`** · the spinner's shape while busy, per button: `bars` (default,
15
+ unchanged) or `Spinner`'s `dots`, `pixels`, `ring`, `square`. No app-wide setting.
16
+
17
+ ### Fixed
18
+
19
+ - **`Button` busy spinner sits in the exact centre** of the button in every browser: it was an
20
+ absolutely positioned child with no offsets, so its place depended on the browser's
21
+ static-position rule for flex children. `inset: 0; margin: auto; width: fit-content; height: fit-content` now centres the spinner's own box, whatever its look; the invisible
22
+ label still keeps the width. Measured for sm/base/lg and primary/soft/ghost/danger
23
+ (`pnpm olc:dugme`). The five looks are measured, by their painted parts.
24
+ - **`RadioGroup` mark and selected card** · the mark's top offset is computed from its own size
25
+ (radio 20px, checkbox 22px) instead of a single 18px, so it sits centred on the first line
26
+ and a single-line option no longer looks a pixel or two low. The selected card's wash is
27
+ a lighter mix of `--color-accent-bg` (the selected menu row's) and the shell, with the page ink; `--color-accent-soft` made
28
+ the chosen card read as a heavy button beside its neighbours. The checked radio no longer shifts 2px down and right: the pressed-in look is
29
+ carried by the dropped shadow alone, so the mark stays centred on its line in both states.
30
+
31
+ ## 0.9.0
32
+
33
+ > An equal grid for the filter row, and a box-shaped panel for the searchable field. Both opt-in; a bar that gives neither renders as before, locked by test.
34
+
35
+ ### Added
36
+
37
+ - **`FilterBar` `grid`** (`look="fields"`) · a CSS grid decided by the bar's own width, not the
38
+ screen's. Wide: one line, a fixed 16rem search box and equal columns for the top fields,
39
+ chosen when every field can have about 9rem (the threshold per field count is written as
40
+ `@container` rules for 1 to 8 fields, a date range counting as two; a drawer button or
41
+ `extra` adds a tail column). Narrower: two equal lines, the search spanning two columns,
42
+ `ceil((fields + 2) / 2)` columns. Below the narrow threshold the 0.8.1 behaviour. No field
43
+ grows past the others any more (six fields had one stretching alone to 320px on the second
44
+ line). A long value is clipped in its box and kept whole in `title`; `Select` gains a
45
+ `title` prop for it.
46
+ - **`FilterBar` `searchableAs="panel"`** · a `searchable` field is drawn as a `SelectPanel` in
47
+ the new `look="field"`: a box-shaped button the size and edge of the inputs beside it,
48
+ showing the value or `labels.all` with a caret; the panel is titled `panelTitle ?? label`,
49
+ starts with a search box (`searchPlaceholder ?? labels.searchIn(label) ?? label`) and
50
+ `labels.all` as the first option; keyboard as in `SelectPanel`. The default, `combobox`, is
51
+ today's text box. Applies on top, in the drawer and in the narrow sheet.
52
+ - **`SelectPanel` `look="field"`** · the trigger as a form box (`.tamga-select`), full width,
53
+ `title` carrying the whole value when set; the same caret glyph and text colour as `Select`
54
+ (an empty "All" reads as a value, not a faint placeholder), the same strong edge when set.
55
+ - **`FilterBar` `look="fields"` on a narrow bar** · the sheet is titled
56
+ `labels.filter ?? labels.allFilters` in both layouts; the search box's visible label stays for
57
+ screen readers only; the search box keeps at least 7.5rem and the "Filter · N" button drops
58
+ under it when the bar is too narrow for both; an applied chip is one line, a long value
59
+ clipped with its whole text in `title`.
60
+
8
61
  ## 0.8.1
9
62
 
10
63
  > Five things the chip layout showed on a real page.
@@ -203,7 +203,33 @@ export type FilterBarProps = {
203
203
  * uygulanan-filtreler satırı yok: çip özetin kendisi. Metin ve tarih aralığı kutu kalır.
204
204
  */
205
205
  look?: "fields" | "chips";
206
+ /**
207
+ * `fields` only. Off (default), the flex row of today: a field that does not fit drops to the
208
+ * next line and stretches. On, a grid decided by the bar's own width: one line with a fixed
209
+ * 16rem search and equal columns when every field can have ~9rem, else two equal lines with
210
+ * the search spanning two columns (columns = ceil((fields + 2) / 2)); below the narrow
211
+ * threshold the 0.8.1 behaviour. No field ever grows past the others. A long value is
212
+ * clipped in its box and kept whole in `title`. TR: Yalnız `fields`. Kapalıyken (varsayılan)
213
+ * bugünkü esnek satır: sığmayan alan alt satıra düşüp uzuyor. Açıkken kabın genişliğine göre
214
+ * bir ızgara: her alana ~9rem düşüyorsa sabit 16rem arama + eşit sütunlu tek satır, yoksa
215
+ * aramanın iki sütun kapladığı eşit iki satır (sütun = ceil((alan + 2) / 2)); dar eşiğin
216
+ * altında 0.8.1 davranışı. Hiçbir alan öbürlerinden uzamıyor. Uzun değer kutuda kesilir, tamamı
217
+ * `title`da.
218
+ */
219
+ grid?: boolean;
220
+ /**
221
+ * What a `searchable` field is drawn as. `combobox` (default) the text box with a magnifier.
222
+ * `panel` a `SelectPanel` in the `field` look: an ordinary box-shaped button that shows the
223
+ * value or `labels.all`, a panel titled `panelTitle ?? label` with a search box
224
+ * (`searchPlaceholder ?? labels.searchIn(label) ?? label`) and `labels.all` first; on top, in
225
+ * the drawer and in the narrow sheet alike. TR: `searchable` alanın çizimi. `combobox`
226
+ * (varsayılan) büyüteçli metin kutusu. `panel` `field` görünümünde bir `SelectPanel`: değeri ya
227
+ * da `labels.all`ı gösteren kutu biçimli sıradan bir düğme, başlığı `panelTitle ?? label`,
228
+ * arama kutulu (`searchPlaceholder ?? labels.searchIn(label) ?? label`), ilk seçeneği
229
+ * `labels.all`; üstte, çekmecede ve dar ekran panelinde aynı.
230
+ */
231
+ searchableAs?: "combobox" | "panel";
206
232
  labels: FilterBarLabels;
207
233
  };
208
- export declare function FilterBar({ values, onChange, top, drawer, optionSource, searchKey, fileSearchKey, onFile, fileAccept, extra, locale, look, labels, }: FilterBarProps): import("react").JSX.Element;
234
+ export declare function FilterBar({ values, onChange, top, drawer, optionSource, searchKey, fileSearchKey, onFile, fileAccept, extra, locale, look, grid, searchableAs, labels, }: FilterBarProps): import("react").JSX.Element;
209
235
  //# sourceMappingURL=filter-bar.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"filter-bar.d.ts","sourceRoot":"","sources":["../../src/blocks/filter-bar.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"filter-bar.d.ts","sourceRoot":"","sources":["../../src/blocks/filter-bar.tsx"],"names":[],"mappings":"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"}
@@ -14,11 +14,14 @@ import { SelectPanel } from "../components/select-panel.js";
14
14
  ayrı parametre giderken burada tekrar ayrıştırmak demekti. */
15
15
  export const rangeStart = (key) => `${key}Start`;
16
16
  export const rangeEnd = (key) => `${key}End`;
17
- function FieldControl({ field, values, write, optionSource, locale, labels, panel = false, }) {
17
+ function FieldControl({ field, values, write, optionSource, locale, labels, panel = false, kutuPanel = false, baslik = false, }) {
18
18
  const options = secenekler(field, optionSource);
19
19
  if (panel && (field.kind === "select" || field.kind === "searchable" || field.kind === "multi")) {
20
20
  return _jsx(PanelAlani, { field: field, values: values, write: write, optionSource: optionSource, labels: labels });
21
21
  }
22
+ if (kutuPanel && field.kind === "searchable") {
23
+ return _jsx(PanelAlani, { field: field, values: values, write: write, optionSource: optionSource, labels: labels, kutu: true });
24
+ }
22
25
  /* HER KONTROLÜN ADI VAR: alanın adı bir <span>, kontrole bağlı değil; ekran
23
26
  okuyucu beş kutuyu da "Tümü" diye okuyordu. */
24
27
  if (field.kind === "dateRange") {
@@ -39,7 +42,8 @@ function FieldControl({ field, values, write, optionSource, locale, labels, pane
39
42
  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) } }));
40
43
  }
41
44
  if (field.kind === "select") {
42
- return (_jsx(Select, { className: "w-full", "aria-label": field.label, icon: field.icon, options: [
45
+ const gorunen = values[field.key] ? secenekler(field, optionSource).find((o) => o.value === values[field.key])?.label ?? values[field.key] : undefined;
46
+ return (_jsx(Select, { className: "w-full", "aria-label": field.label, title: baslik ? gorunen : undefined, icon: field.icon, options: [
43
47
  labels.all,
44
48
  ...options.map((o) => ({ value: o.value, label: o.label, tone: field.tones?.[o.value] })),
45
49
  ],
@@ -57,7 +61,7 @@ function FieldControl({ field, values, write, optionSource, locale, labels, pane
57
61
  * `SelectPanel`, ilk seçeneği "Tümü" (geri dönüş yolu gidiş yoluyla aynı yerde).
58
62
  * Çipte boşken kenarlı küçük, doluyken yumuşak ve oksuz; ✕ ayrı düğme.
59
63
  */
60
- function PanelAlani({ field, values, write, optionSource, labels, cip = false, }) {
64
+ function PanelAlani({ field, values, write, optionSource, labels, cip = false, kutu = false, }) {
61
65
  const options = secenekler(field, optionSource).map((o) => ({ ...o, tone: field.tones?.[o.value] }));
62
66
  const ortak = {
63
67
  title: field.panelTitle ?? field.label,
@@ -69,7 +73,8 @@ function PanelAlani({ field, values, write, optionSource, labels, cip = false, }
69
73
  /* Panelin araması kendi metnini taşır; çubuğun arama metni ("Ad ya da adres ara") değil. */
70
74
  labels: { noMatch: labels.noMatch, search: field.searchPlaceholder ?? labels.searchIn?.(field.label) ?? field.label, clear: labels.clear },
71
75
  size: cip ? "sm" : "base",
72
- className: cip ? undefined : "tamga-select-panel-tam",
76
+ look: kutu ? "field" : "button",
77
+ className: cip || kutu ? undefined : "tamga-select-panel-tam",
73
78
  };
74
79
  if (field.kind === "multi") {
75
80
  const selected = (values[field.key] ?? "").split(",").filter(Boolean);
@@ -84,8 +89,13 @@ function secenekler(field, optionSource) {
84
89
  const ham = field.options?.length ? field.options : (optionSource[field.key] ?? []);
85
90
  return ham.map((o) => (typeof o === "string" ? { value: o, label: o } : o));
86
91
  }
87
- export function FilterBar({ values, onChange, top, drawer, optionSource = {}, searchKey = "q", fileSearchKey, onFile, fileAccept, extra, locale = "en-GB", look = "fields", labels, }) {
92
+ export function FilterBar({ values, onChange, top, drawer, optionSource = {}, searchKey = "q", fileSearchKey, onFile, fileAccept, extra, locale = "en-GB", look = "fields", grid = false, searchableAs = "combobox", labels, }) {
88
93
  const cipler = look === "chips";
94
+ const panelli = searchableAs === "panel";
95
+ /* Izgara: tarih aralığı iki birim; iki satırlık düzende sütun = ceil((birim + 2) / 2);
96
+ çekmece düğmesi ya da ek kontrol varsa sondaki "kuyruk" sütunu. */
97
+ const birim = top.reduce((n, f) => n + (f.kind === "dateRange" ? 2 : 1), 0);
98
+ const sutun = Math.ceil((birim + 2) / 2);
89
99
  const [drawerOpen, setDrawerOpen] = useState(false);
90
100
  const formId = useId();
91
101
  const active = Object.entries(values).filter(([, v]) => v);
@@ -126,13 +136,13 @@ export function FilterBar({ values, onChange, top, drawer, optionSource = {}, se
126
136
  const adlar = new Map(secenekler(field, optionSource).map((o) => [o.value, o.label]));
127
137
  return value.split(",").map((v) => adlar.get(v) ?? v).join(field.kind === "multi" ? ", " : ",");
128
138
  };
129
- 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)));
139
+ 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, kutuPanel: panelli })] }, field.key)));
130
140
  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, size: cipler ? "sm" : "md", placeholder: labels.search, value: values[searchKey] ?? "", onChange: (e) => write(searchKey, e.target.value) })] }));
131
141
  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 })] }));
132
- 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: "tamga-filter-ara-etiket", 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", { type: "button", className: "tamga-link tamga-filter-cip-temizle", 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) => {
142
+ 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: "tamga-filter-ara-etiket", 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", { type: "button", className: "tamga-link tamga-filter-cip-temizle", onClick: () => onChange({}), children: labels.clearAll })) : null] }), cekmeceDugmesi, extra] })) : (_jsxs("div", { className: grid ? "tamga-filter-row tamga-filter-izgara" : "tamga-filter-row", "data-alan": grid ? birim : undefined, "data-kuyruk": grid && (drawer.length > 0 || extra) ? "true" : undefined, style: grid ? { "--filter-sutun": sutun } : undefined, children: [_jsxs("label", { className: "tamga-filter-ara", children: [_jsx("span", { className: "tamga-filter-ara-ad 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, kutuPanel: panelli, baslik: grid })] })] }, 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), ":"] }), _jsx("span", { className: "tamga-token-deger", title: valueText(key, value), children: 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: labels.filter ?? 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) => {
133
143
  e.preventDefault();
134
144
  setDrawerOpen(false);
135
- }, 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: () => {
145
+ }, 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, kutuPanel: panelli })] }, 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: () => {
136
146
  write(fileSearchKey, "");
137
147
  onFile?.(null);
138
148
  }, 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) => {
@@ -30,8 +30,16 @@ export type ButtonProps = React.ComponentProps<"button"> & VariantProps<typeof b
30
30
  * ama okunur); adsız bir düğme olmuyor.
31
31
  */
32
32
  busyLabel?: string;
33
+ /**
34
+ * The spinner's shape while `busy`: `bars` (default, today's) or `Spinner`'s `dots`,
35
+ * `pixels`, `ring`, `square`. Chosen where the button is used; there is no app-wide
36
+ * setting. TR: `busy` sürerken spinner'ın biçimi: `bars` (varsayılan, bugünkü) ya da
37
+ * `Spinner`ın `dots`, `pixels`, `ring`, `square`ı. Düğmenin kullanıldığı yerde seçilir;
38
+ * uygulama geneli bir ayar yok.
39
+ */
40
+ busyLook?: "bars" | "dots" | "pixels" | "ring" | "square";
33
41
  };
34
- export declare function Button({ className, variant, size, full, busy, busyLabel, children, disabled, ...props }: ButtonProps): import("react").JSX.Element;
42
+ export declare function Button({ className, variant, size, full, busy, busyLabel, busyLook, children, disabled, ...props }: ButtonProps): import("react").JSX.Element;
35
43
  export declare const iconButtonVariants: (props?: ({
36
44
  size?: "base" | "lg" | "sm" | null | undefined;
37
45
  variant?: "danger" | "ghost" | "primary" | "secondary" | "soft" | null | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE;;;;GAIG;AAEH,eAAO,MAAM,cAAc;;;;8EAwCzB,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GACtD,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEJ,wBAAgB,MAAM,CAAC,EACrB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,IAAY,EACZ,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,WAAW,+BA8Bb;AAID,eAAO,MAAM,kBAAkB;;;8EAoB7B,CAAC;AAEH;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,IAAI,EACJ,OAAO,EACP,YAAY,EAAE,KAAK,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAC/B,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,+BASnE;AAED,eAAO,MAAM,kBAAkB;;8EAW7B,CAAC;AAEH,kFAAkF;AAClF,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,OAAO,EACP,YAAY,EAAE,KAAK,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAC/B,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,+BASnE"}
1
+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE;;;;GAIG;AAEH,eAAO,MAAM,cAAc;;;;8EAwCzB,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GACtD,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;CAC3D,CAAC;AAEJ,wBAAgB,MAAM,CAAC,EACrB,SAAS,EACT,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,IAAY,EACZ,SAAS,EACT,QAAiB,EACjB,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,WAAW,+BA8Bb;AAID,eAAO,MAAM,kBAAkB;;;8EAoB7B,CAAC;AAEH;;;;GAIG;AACH,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,IAAI,EACJ,OAAO,EACP,YAAY,EAAE,KAAK,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAC/B,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,+BASnE;AAED,eAAO,MAAM,kBAAkB;;8EAW7B,CAAC;AAEH,kFAAkF;AAClF,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,OAAO,EACP,YAAY,EAAE,KAAK,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAC/B,YAAY,CAAC,OAAO,kBAAkB,CAAC,GAAG;IAAE,YAAY,EAAE,MAAM,CAAA;CAAE,+BASnE"}
@@ -48,11 +48,11 @@ export const buttonVariants = cva("tamga-btn", {
48
48
  },
49
49
  defaultVariants: { variant: "secondary", size: "base", full: false },
50
50
  });
51
- export function Button({ className, variant, size, full, busy = false, busyLabel, children, disabled, ...props }) {
51
+ export function Button({ className, variant, size, full, busy = false, busyLabel, busyLook = "bars", children, disabled, ...props }) {
52
52
  return (_jsx("button", { "data-slot": "button", "data-busy": busy || undefined, "aria-busy": busy || undefined,
53
53
  /* Kilit `disabled` ile: sürerken ikinci bir tıklama olayı hiç doğmuyor.
54
54
  `pointer-events: none` yetmezdi — klavye Enter'ı yine gönderirdi. */
55
- disabled: disabled || busy, className: cn(buttonVariants({ variant, size, full }), className), ...props, children: busy ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { size: 16, label: busyLabel ?? "" }), busyLabel ? null : _jsx("span", { className: "sr-only", children: children }), _jsx("span", { className: "invisible", "aria-hidden": true, children: children })] })) : (children) }));
55
+ disabled: disabled || busy, className: cn(buttonVariants({ variant, size, full }), className), ...props, children: busy ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { size: 16, look: busyLook, label: busyLabel ?? "" }), busyLabel ? null : _jsx("span", { className: "sr-only", children: children }), _jsx("span", { className: "invisible", "aria-hidden": true, children: children })] })) : (children) }));
56
56
  }
57
57
  /* --------------------------- icon button -------------------------- */
58
58
  export const iconButtonVariants = cva("tamga-icon-btn", {
@@ -133,7 +133,7 @@ export declare function Field({ label, description, error, required, note, info,
133
133
  [k: `data-${string}`]: unknown;
134
134
  }): import("react").JSX.Element;
135
135
  /** A plain select: the same overlay as the searchable one, without the search. */
136
- export declare function Select({ options, icon, set, value, onChange, placeholder, loading, loadingRows, disabled, "aria-label": ariaLabel, className, ...rest }: {
136
+ export declare function Select({ options, icon, set, value, onChange, placeholder, loading, loadingRows, disabled, "aria-label": ariaLabel, title, className, ...rest }: {
137
137
  /**
138
138
  * Plain strings, or options that carry a tone. TR: Düz dizgiler, ya da ton
139
139
  * taşıyan seçenekler.
@@ -219,6 +219,8 @@ export declare function Select({ options, icon, set, value, onChange, placeholde
219
219
  "aria-label"?: string;
220
220
  /** Locks the trigger; the list cannot open. TR: Tetiği kilitler; liste açılmaz. */
221
221
  disabled?: boolean;
222
+ /** The trigger's tooltip: the full text when the shown value is clipped. TR: Tetiğin ipucu: görünen değer kesildiğinde tam metin. */
223
+ title?: string;
222
224
  /** Genişlik ve konum çağıranın. Varsayılan `w-56`; `w-full` verildiğinde
223
225
  * tailwind-merge onu ezer, yani kontrol kabına uyar. */
224
226
  className?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../../src/components/primitives.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../../src/components/primitives.tsx"],"names":[],"mappings":"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"}
@@ -79,7 +79,7 @@ export function Field({ label, description, error, required = false, note, info,
79
79
  return (_jsxs("div", { ...dataProps(rest), className: "flex flex-col gap-1.5", children: [_jsxs("span", { className: "flex items-baseline gap-2", children: [_jsxs("label", { htmlFor: htmlFor, className: "text-small font-bold text-ink", children: [label, required ? (_jsx("span", { "aria-hidden": true, className: "ml-1", style: { color: toneOf("danger").fg }, children: "*" })) : null] }), info ? _jsx("span", { className: "flex items-center text-ink-faint", children: info }) : null, _jsx("span", { className: "flex-1" }), note ? _jsx("span", { className: "text-caption text-ink-faint", children: note }) : null] }), kontrol, count ? (_jsxs("span", { className: "self-end font-mono text-small font-bold tabular-nums", style: count.value > count.max ? { color: toneOf("danger").fg } : { color: "var(--color-ink-faint)" }, children: [count.value, " / ", count.max] })) : null, error ? (_jsxs("p", { id: notId, className: "flex items-center gap-1.5 text-small font-medium", style: { color: toneOf("danger").fg }, children: [_jsx(Icon, { icon: Warning, size: "xs", weight: "fill" }), error] })) : description ? (_jsx("p", { id: notId, className: "text-small text-ink-faint", children: description })) : null] }));
80
80
  }
81
81
  /** A plain select: the same overlay as the searchable one, without the search. */
82
- export function Select({ options, icon, set, value, onChange, placeholder, loading = false, loadingRows = 4, disabled = false, "aria-label": ariaLabel, className, ...rest }) {
82
+ export function Select({ options, icon, set, value, onChange, placeholder, loading = false, loadingRows = 4, disabled = false, "aria-label": ariaLabel, title, className, ...rest }) {
83
83
  const [open, setOpen] = useState(false);
84
84
  const [inner, setInner] = useState(value ?? "");
85
85
  const box = useRef(null);
@@ -102,7 +102,7 @@ export function Select({ options, icon, set, value, onChange, placeholder, loadi
102
102
  document.addEventListener("mousedown", away);
103
103
  return () => document.removeEventListener("mousedown", away);
104
104
  }, [open]);
105
- return (_jsxs("div", { ...dataProps(rest), ref: box, className: cn("relative w-56", className), children: [_jsxs("button", { type: "button", className: "tamga-select justify-between", "data-set": (set ?? Boolean(current)) ? "true" : undefined, "aria-haspopup": "listbox", "aria-expanded": open, "aria-label": ariaLabel, disabled: disabled || undefined, onClick: () => setOpen((o) => !o), children: [icon ? _jsx(Icon, { icon: icon, size: "sm", className: "shrink-0 text-ink-faint" }) : null, _jsx("span", { className: cn("min-w-0 flex-1 truncate", current ? "" : "text-ink-faint"), children: gorunen || placeholder }), _jsx(Icon, { icon: CaretRight, size: "xs", className: "shrink-0 rotate-90" })] }), open && (_jsxs("div", { ref: list, role: "listbox", className: "tamga-overlay tamga-menu absolute left-0 top-[var(--overlay-below)] z-40 flex w-full flex-col gap-0.5 overflow-hidden", "aria-busy": loading || undefined, children: [loading && _jsx(SkeletonOptions, { rows: loadingRows }), !loading && options.map((ham) => {
105
+ return (_jsxs("div", { ...dataProps(rest), ref: box, className: cn("relative w-56", className), children: [_jsxs("button", { type: "button", className: "tamga-select justify-between", "data-set": (set ?? Boolean(current)) ? "true" : undefined, "aria-haspopup": "listbox", "aria-expanded": open, "aria-label": ariaLabel, title: title, disabled: disabled || undefined, onClick: () => setOpen((o) => !o), children: [icon ? _jsx(Icon, { icon: icon, size: "sm", className: "shrink-0 text-ink-faint" }) : null, _jsx("span", { className: cn("min-w-0 flex-1 truncate", current ? "" : "text-ink-faint"), children: gorunen || placeholder }), _jsx(Icon, { icon: CaretRight, size: "xs", className: "shrink-0 rotate-90" })] }), open && (_jsxs("div", { ref: list, role: "listbox", className: "tamga-overlay tamga-menu absolute left-0 top-[var(--overlay-below)] z-40 flex w-full flex-col gap-0.5 overflow-hidden", "aria-busy": loading || undefined, children: [loading && _jsx(SkeletonOptions, { rows: loadingRows }), !loading && options.map((ham) => {
106
106
  const nesne = typeof ham === "string" ? { value: ham } : ham;
107
107
  const { value: o, label: etiket, tone: ton, hint: ipucu, ...kanca } = nesne;
108
108
  return (_createElement("button", { ...kanca, key: o, role: "option", "aria-selected": o === current, "data-tamga-option": true, className: "tamga-option", "data-selected": o === current, onClick: () => {
@@ -42,6 +42,13 @@ type Ortak = {
42
42
  variant?: "secondary" | "soft" | "ghost";
43
43
  /** The trigger's size, from `Button`. TR: Tetiğin boyu, `Button`dan. */
44
44
  size?: "base" | "sm";
45
+ /**
46
+ * `button` an ordinary button (default). `field` a form box like `Select`: full width,
47
+ * the same height and edge as the inputs beside it, for a labelled filter row. TR: `button`
48
+ * sıradan bir düğme (varsayılan). `field` `Select` gibi bir form kutusu: tam genişlik,
49
+ * yanındaki kutularla aynı boy ve kenar, etiketli bir filtre satırı için.
50
+ */
51
+ look?: "button" | "field";
45
52
  disabled?: boolean;
46
53
  labels: {
47
54
  /** Shown when the search matches nothing. TR: Arama hiçbir şeyle eşleşmeyince. */
@@ -64,6 +71,6 @@ export type SelectPanelProps = Ortak & ({
64
71
  value: readonly string[];
65
72
  onChange: (next: string[]) => void;
66
73
  });
67
- 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;
74
+ export declare function SelectPanel({ options, title, placeholder, "aria-label": ariaLabel, searchable, allLabel, prefix, caret, variant, size, look, disabled, labels, className, multiple, value, onChange, ...rest }: SelectPanelProps): import("react").JSX.Element;
68
75
  export {};
69
76
  //# sourceMappingURL=select-panel.d.ts.map
@@ -1 +1 @@
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"}
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;;;;;OAKG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC1B,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,IAAe,EACf,QAAgB,EAChB,MAAM,EACN,SAAS,EACT,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,gBAAgB,+BAmJlB"}
@@ -7,10 +7,10 @@ import { buttonVariants } from "./button.js";
7
7
  import { cn } from "../lib/cn.js";
8
8
  import { dataProps } from "../lib/data-props.js";
9
9
  import { Icon } from "./icon.js";
10
- import { CaretDown, Check, Search } from "./icons.js";
10
+ import { CaretDown, CaretRight, Check, Search } from "./icons.js";
11
11
  import { Input } from "./input.js";
12
12
  import { toneOf } from "./tone.js";
13
- 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 }) {
13
+ export function SelectPanel({ options, title, placeholder, "aria-label": ariaLabel, searchable = false, allLabel, prefix, caret = true, variant = "secondary", size = "base", look = "button", disabled = false, labels, className, multiple, value, onChange, ...rest }) {
14
14
  const id = useId();
15
15
  const [open, setOpen] = useState(false);
16
16
  const [sorgu, setSorgu] = useState("");
@@ -64,5 +64,5 @@ export function SelectPanel({ options, title, placeholder, "aria-label": ariaLab
64
64
  o.hint ? _jsx("span", { className: "shrink-0 text-small text-ink-faint", children: o.hint }) : null,
65
65
  isaretli ? _jsx(Icon, { icon: Check, size: "xs", weight: "bold", className: "shrink-0 text-[var(--color-accent-line)]" }) : null));
66
66
  };
67
- 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] }));
67
+ return (_jsxs("div", { ...dataProps(rest), ref: kutu, className: cn("tamga-select-panel", look === "field" && "tamga-select-panel-alan", className), children: [_jsxs("button", { ref: tetik, type: "button", className: cn(look === "field" ? "tamga-select" : buttonVariants({ variant, size }), "tamga-select-panel-tetik"), title: look === "field" && ozet ? ozet : undefined, "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, look === "field" ? (_jsx("span", { className: "min-w-0 flex-1 truncate", children: ozet ?? placeholder })) : (_jsx("span", { className: cn("min-w-0 truncate", ozet ? "" : "tamga-select-panel-bos"), children: ozet ?? placeholder })), caret ? (look === "field" ? (_jsx(Icon, { icon: CaretRight, size: "xs", className: "shrink-0 rotate-90" })) : (_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] }));
68
68
  }
package/dist/fonts.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tamga-ui 0.8.1 · MIT · https://tamga.org.tr */
1
+ /*! tamga-ui 0.10.0 · MIT · https://tamga.org.tr */
2
2
  @font-face {
3
3
  font-family: "Red Hat Display";
4
4
  font-style: normal;
package/dist/kit.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tamga-ui 0.8.1 · MIT · https://tamga.org.tr */
1
+ /*! tamga-ui 0.10.0 · MIT · https://tamga.org.tr */
2
2
  :root {
3
3
 
4
4
  --overlay-gap: 8px;
@@ -615,8 +615,14 @@
615
615
  box-shadow: 4px 4px 0 var(--color-edge-strong);
616
616
  cursor: progress;
617
617
  }
618
+
618
619
  .tamga-btn[data-busy] > [role="status"] {
619
620
  position: absolute;
621
+ inset: 0;
622
+ margin: auto;
623
+
624
+ width: fit-content;
625
+ height: fit-content;
620
626
  }
621
627
  .tamga-btn[data-busy] {
622
628
  position: relative;
@@ -1174,6 +1180,16 @@
1174
1180
  .tamga-filter-cip-sira {
1175
1181
  display: contents;
1176
1182
  }
1183
+
1184
+ .tamga-filter-bar .tamga-token {
1185
+ white-space: nowrap;
1186
+ max-width: 100%;
1187
+ }
1188
+ .tamga-token-deger {
1189
+ min-width: 0;
1190
+ overflow: hidden;
1191
+ text-overflow: ellipsis;
1192
+ }
1177
1193
  .tamga-filter-cip-temizle {
1178
1194
  white-space: nowrap;
1179
1195
  font-size: var(--text-small);
@@ -1227,6 +1243,19 @@
1227
1243
  background: var(--color-shell);
1228
1244
  }
1229
1245
 
1246
+ .tamga-select-panel-alan {
1247
+ display: flex;
1248
+ width: 100%;
1249
+ }
1250
+ .tamga-select-panel-alan > .tamga-select-panel-tetik {
1251
+ width: 100%;
1252
+ justify-content: space-between;
1253
+ }
1254
+ .tamga-select-panel-alan > .tamga-select-panel-tetik > span:not(.tamga-select-panel-onek) {
1255
+ flex: 1;
1256
+ text-align: start;
1257
+ }
1258
+
1230
1259
  .tamga-select-panel-tam,
1231
1260
  .tamga-select-panel-tam > .tamga-select-panel-tetik {
1232
1261
  display: flex;
@@ -1245,8 +1274,9 @@
1245
1274
  .tamga-filter-genis {
1246
1275
  display: none;
1247
1276
  }
1277
+
1248
1278
  .tamga-filter-row > .tamga-filter-ara {
1249
- flex-basis: 0;
1279
+ flex: 1 1 7.5rem;
1250
1280
  }
1251
1281
 
1252
1282
  .tamga-filter-cips > .tamga-filter-ara-sabit {
@@ -1254,6 +1284,15 @@
1254
1284
  min-width: 0;
1255
1285
  }
1256
1286
 
1287
+ .tamga-filter-ara-ad {
1288
+ position: absolute;
1289
+ width: 1px;
1290
+ height: 1px;
1291
+ overflow: hidden;
1292
+ clip: rect(0 0 0 0);
1293
+ white-space: nowrap;
1294
+ }
1295
+
1257
1296
  .tamga-filter-cips > .tamga-btn,
1258
1297
  .tamga-filter-row > .tamga-btn {
1259
1298
  flex-shrink: 0;
@@ -1287,6 +1326,168 @@
1287
1326
  }
1288
1327
  }
1289
1328
 
1329
+ @container (min-width: 40rem) {
1330
+
1331
+ .tamga-filter-row.tamga-filter-izgara {
1332
+ display: grid;
1333
+ align-items: end;
1334
+ grid-template-columns: repeat(var(--filter-sutun), minmax(0, 1fr));
1335
+ }
1336
+ .tamga-filter-row.tamga-filter-izgara[data-kuyruk] {
1337
+ grid-template-columns: repeat(var(--filter-sutun), minmax(0, 1fr)) auto;
1338
+ }
1339
+ .tamga-filter-izgara > .tamga-filter-ara {
1340
+ grid-column: span 2;
1341
+ flex: none;
1342
+ }
1343
+ .tamga-filter-izgara > .tamga-filter-alan {
1344
+ flex: none;
1345
+ }
1346
+ .tamga-filter-izgara > .tamga-filter-alan[data-range] {
1347
+ grid-column: span 2;
1348
+ }
1349
+
1350
+ .tamga-filter-row.tamga-filter-izgara > .tamga-filter-cap {
1351
+ max-width: none;
1352
+ }
1353
+ .tamga-filter-izgara > .tamga-filter-kir {
1354
+ display: none;
1355
+ }
1356
+ .tamga-filter-izgara > .tamga-btn {
1357
+ grid-column: -2 / -1;
1358
+ grid-row: 1;
1359
+ justify-self: end;
1360
+ }
1361
+ }
1362
+ @container (min-width: 424px) {
1363
+ .tamga-filter-row.tamga-filter-izgara[data-alan="1"]:not([data-kuyruk]) {
1364
+ grid-template-columns: 16rem repeat(1, minmax(0, 1fr));
1365
+ }
1366
+ .tamga-filter-row.tamga-filter-izgara[data-alan="1"]:not([data-kuyruk]) > .tamga-filter-ara {
1367
+ grid-column: auto;
1368
+ }
1369
+ }
1370
+ @container (min-width: 580px) {
1371
+ .tamga-filter-row.tamga-filter-izgara[data-alan="1"][data-kuyruk] {
1372
+ grid-template-columns: 16rem repeat(1, minmax(0, 1fr)) auto;
1373
+ }
1374
+ .tamga-filter-row.tamga-filter-izgara[data-alan="1"][data-kuyruk] > .tamga-filter-ara {
1375
+ grid-column: auto;
1376
+ }
1377
+ }
1378
+ @container (min-width: 580px) {
1379
+ .tamga-filter-row.tamga-filter-izgara[data-alan="2"]:not([data-kuyruk]) {
1380
+ grid-template-columns: 16rem repeat(2, minmax(0, 1fr));
1381
+ }
1382
+ .tamga-filter-row.tamga-filter-izgara[data-alan="2"]:not([data-kuyruk]) > .tamga-filter-ara {
1383
+ grid-column: auto;
1384
+ }
1385
+ }
1386
+ @container (min-width: 736px) {
1387
+ .tamga-filter-row.tamga-filter-izgara[data-alan="2"][data-kuyruk] {
1388
+ grid-template-columns: 16rem repeat(2, minmax(0, 1fr)) auto;
1389
+ }
1390
+ .tamga-filter-row.tamga-filter-izgara[data-alan="2"][data-kuyruk] > .tamga-filter-ara {
1391
+ grid-column: auto;
1392
+ }
1393
+ }
1394
+ @container (min-width: 736px) {
1395
+ .tamga-filter-row.tamga-filter-izgara[data-alan="3"]:not([data-kuyruk]) {
1396
+ grid-template-columns: 16rem repeat(3, minmax(0, 1fr));
1397
+ }
1398
+ .tamga-filter-row.tamga-filter-izgara[data-alan="3"]:not([data-kuyruk]) > .tamga-filter-ara {
1399
+ grid-column: auto;
1400
+ }
1401
+ }
1402
+ @container (min-width: 892px) {
1403
+ .tamga-filter-row.tamga-filter-izgara[data-alan="3"][data-kuyruk] {
1404
+ grid-template-columns: 16rem repeat(3, minmax(0, 1fr)) auto;
1405
+ }
1406
+ .tamga-filter-row.tamga-filter-izgara[data-alan="3"][data-kuyruk] > .tamga-filter-ara {
1407
+ grid-column: auto;
1408
+ }
1409
+ }
1410
+ @container (min-width: 892px) {
1411
+ .tamga-filter-row.tamga-filter-izgara[data-alan="4"]:not([data-kuyruk]) {
1412
+ grid-template-columns: 16rem repeat(4, minmax(0, 1fr));
1413
+ }
1414
+ .tamga-filter-row.tamga-filter-izgara[data-alan="4"]:not([data-kuyruk]) > .tamga-filter-ara {
1415
+ grid-column: auto;
1416
+ }
1417
+ }
1418
+ @container (min-width: 1048px) {
1419
+ .tamga-filter-row.tamga-filter-izgara[data-alan="4"][data-kuyruk] {
1420
+ grid-template-columns: 16rem repeat(4, minmax(0, 1fr)) auto;
1421
+ }
1422
+ .tamga-filter-row.tamga-filter-izgara[data-alan="4"][data-kuyruk] > .tamga-filter-ara {
1423
+ grid-column: auto;
1424
+ }
1425
+ }
1426
+ @container (min-width: 1048px) {
1427
+ .tamga-filter-row.tamga-filter-izgara[data-alan="5"]:not([data-kuyruk]) {
1428
+ grid-template-columns: 16rem repeat(5, minmax(0, 1fr));
1429
+ }
1430
+ .tamga-filter-row.tamga-filter-izgara[data-alan="5"]:not([data-kuyruk]) > .tamga-filter-ara {
1431
+ grid-column: auto;
1432
+ }
1433
+ }
1434
+ @container (min-width: 1204px) {
1435
+ .tamga-filter-row.tamga-filter-izgara[data-alan="5"][data-kuyruk] {
1436
+ grid-template-columns: 16rem repeat(5, minmax(0, 1fr)) auto;
1437
+ }
1438
+ .tamga-filter-row.tamga-filter-izgara[data-alan="5"][data-kuyruk] > .tamga-filter-ara {
1439
+ grid-column: auto;
1440
+ }
1441
+ }
1442
+ @container (min-width: 1204px) {
1443
+ .tamga-filter-row.tamga-filter-izgara[data-alan="6"]:not([data-kuyruk]) {
1444
+ grid-template-columns: 16rem repeat(6, minmax(0, 1fr));
1445
+ }
1446
+ .tamga-filter-row.tamga-filter-izgara[data-alan="6"]:not([data-kuyruk]) > .tamga-filter-ara {
1447
+ grid-column: auto;
1448
+ }
1449
+ }
1450
+ @container (min-width: 1360px) {
1451
+ .tamga-filter-row.tamga-filter-izgara[data-alan="6"][data-kuyruk] {
1452
+ grid-template-columns: 16rem repeat(6, minmax(0, 1fr)) auto;
1453
+ }
1454
+ .tamga-filter-row.tamga-filter-izgara[data-alan="6"][data-kuyruk] > .tamga-filter-ara {
1455
+ grid-column: auto;
1456
+ }
1457
+ }
1458
+ @container (min-width: 1360px) {
1459
+ .tamga-filter-row.tamga-filter-izgara[data-alan="7"]:not([data-kuyruk]) {
1460
+ grid-template-columns: 16rem repeat(7, minmax(0, 1fr));
1461
+ }
1462
+ .tamga-filter-row.tamga-filter-izgara[data-alan="7"]:not([data-kuyruk]) > .tamga-filter-ara {
1463
+ grid-column: auto;
1464
+ }
1465
+ }
1466
+ @container (min-width: 1516px) {
1467
+ .tamga-filter-row.tamga-filter-izgara[data-alan="7"][data-kuyruk] {
1468
+ grid-template-columns: 16rem repeat(7, minmax(0, 1fr)) auto;
1469
+ }
1470
+ .tamga-filter-row.tamga-filter-izgara[data-alan="7"][data-kuyruk] > .tamga-filter-ara {
1471
+ grid-column: auto;
1472
+ }
1473
+ }
1474
+ @container (min-width: 1516px) {
1475
+ .tamga-filter-row.tamga-filter-izgara[data-alan="8"]:not([data-kuyruk]) {
1476
+ grid-template-columns: 16rem repeat(8, minmax(0, 1fr));
1477
+ }
1478
+ .tamga-filter-row.tamga-filter-izgara[data-alan="8"]:not([data-kuyruk]) > .tamga-filter-ara {
1479
+ grid-column: auto;
1480
+ }
1481
+ }
1482
+ @container (min-width: 1672px) {
1483
+ .tamga-filter-row.tamga-filter-izgara[data-alan="8"][data-kuyruk] {
1484
+ grid-template-columns: 16rem repeat(8, minmax(0, 1fr)) auto;
1485
+ }
1486
+ .tamga-filter-row.tamga-filter-izgara[data-alan="8"][data-kuyruk] > .tamga-filter-ara {
1487
+ grid-column: auto;
1488
+ }
1489
+ }
1490
+
1290
1491
  .tamga-filter-row {
1291
1492
  --filter-gap: 12px;
1292
1493
  display: flex;
@@ -2590,7 +2791,12 @@
2590
2791
 
2591
2792
  .tamga-choice-mark {
2592
2793
  align-self: flex-start;
2593
- margin-top: calc((1lh - 18px) / 2);
2794
+ }
2795
+ .tamga-radio.tamga-choice-mark {
2796
+ margin-top: calc((1lh - 20px) / 2);
2797
+ }
2798
+ .tamga-check.tamga-choice-mark {
2799
+ margin-top: calc((1lh - 22px) / 2);
2594
2800
  }
2595
2801
 
2596
2802
  .tamga-choice-chip {
@@ -2628,8 +2834,8 @@
2628
2834
  }
2629
2835
 
2630
2836
  .tamga-choice-card[aria-checked="true"] {
2631
- background: var(--color-accent-soft);
2632
- color: var(--color-accent-soft-ink);
2837
+
2838
+ background: color-mix(in oklab, var(--color-accent-bg) 60%, var(--color-shell));
2633
2839
  }
2634
2840
 
2635
2841
  .tamga-choice-chip:not([aria-checked="true"]):active,
@@ -2693,9 +2899,9 @@
2693
2899
  transform: translate(2px, 2px);
2694
2900
  box-shadow: 0 0 0 var(--color-accent-shadow);
2695
2901
  }
2902
+
2696
2903
  .tamga-radio[data-checked="true"] {
2697
2904
  border-color: var(--color-accent);
2698
- transform: translate(2px, 2px);
2699
2905
  box-shadow: 0 0 0 var(--color-accent);
2700
2906
  }
2701
2907
  .tamga-radio[data-checked="true"]::before {
package/dist/styles.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tamga-ui 0.8.1 · MIT · https://tamga.org.tr */
1
+ /*! tamga-ui 0.10.0 · MIT · https://tamga.org.tr */
2
2
  @import "./fonts.css";
3
3
  @import "./theme.css";
4
4
  @import "./kit.css";
package/dist/theme.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tamga-ui 0.8.1 · MIT · https://tamga.org.tr */
1
+ /*! tamga-ui 0.10.0 · MIT · https://tamga.org.tr */
2
2
  @custom-variant dark (&:is(.dark *));
3
3
 
4
4
  @theme static {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tamga-ui",
3
- "version": "0.8.1",
3
+ "version": "0.10.0",
4
4
  "description": "Mantıksal's shared interface library: tokens, physics and components.",
5
5
  "license": "MIT",
6
6
  "type": "module",