tamga-ui 0.3.2 → 0.4.1

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,106 @@ 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.4.1
9
+
10
+ Two gaps that products had been paying for, both found by a gate that asks a product not to
11
+ hand-write a kit class. Each one had pushed a caller off the component entirely.
12
+
13
+ ### Added
14
+
15
+ - **An accessibility invariant suite.** Twenty-three renders, three invariants: every interactive
16
+ element has an accessible name, no `aria-hidden` subtree hides something focusable, and role pairs
17
+ are complete (`radio` inside `radiogroup`, `tab` inside `tablist`, `option` inside `listbox`).
18
+
19
+ This is not an axe sweep and does not claim to be. The previous sweep ran over a consuming
20
+ product's stories and disappeared with them, which was the wrong home for it: a promise the
21
+ library makes has to be measured in the library. What is not covered is written at the top of the
22
+ file — contrast (a separate gate already measures it), focus order, live-region behaviour, and any
23
+ component the suite does not render.
24
+
25
+ - **`RadioGroup` options carry their own attributes.** Anything beyond `value` and `label` lands on
26
+ that option's button. The sibling components for picking one of several things had carried
27
+ per-option hooks since 0.3.1 and 0.4.0; this one had not, so a caller who needed to point at a
28
+ single choice left the component behind and hand-wrote the class, which meant leaving the role and
29
+ the keyboard behind with it. The kit's own attributes are written after the caller's, so a hook
30
+ cannot overwrite `aria-checked`.
31
+
32
+ - **`AppShell` draws section headings.** `NavEntry` takes an optional `section`; the rail groups
33
+ consecutive entries by it and draws a heading when the group changes. Wide rails only: in a 40px
34
+ box a heading does not read, and there grouping is carried by spacing.
35
+
36
+ A panel whose menu is split into seven named groups could not express that, so it drew its own
37
+ rail and left behind everything the template brings. The field is flat rather than a nested list
38
+ of groups, for two reasons: nesting would have been a breaking change, and a nested shape makes an
39
+ empty group possible. Here a heading exists only if an entry has one.
40
+
41
+
42
+
43
+ **A step now has an identity of its own.** `Steps` took a plain `readonly string[]`, so a step was
44
+ nothing but its translated label. Two consequences followed, and both were silent.
45
+
46
+ The React key was the label. Change the language and every step becomes, to React, a different
47
+ element: the old node is torn down and a new one built in its place. Nothing looks wrong, but
48
+ anything holding on to that node goes with it. Two steps sharing a label collided the same way.
49
+
50
+ And there was no way to reach a single step. A caller who needed to point at one, to test it or to
51
+ style it, had nothing to point with; the only thing in the DOM that told steps apart was the
52
+ translated text, which is the one thing that changes underneath a test. The sibling component for
53
+ picking one of several options had carried per-option hooks since 0.3.1. The step strip had not,
54
+ and a gate exemption recorded that gap as though it were a decision.
55
+
56
+ ### Breaking
57
+
58
+ - **`Steps.steps`** is now `readonly Step[]` instead of `readonly string[]`, where
59
+ `Step = { key: string; label: string } & Record<string, unknown>`. Anything beyond `key` and
60
+ `label` lands on that step's `<li>`.
61
+
62
+ ```diff
63
+ - <Steps steps={["Details", "Connection", "Done"]} current={1} />
64
+ + <Steps
65
+ + steps={[
66
+ + { key: "details", label: "Details" },
67
+ + { key: "connection", label: "Connection" },
68
+ + { key: "done", label: "Done" },
69
+ + ]}
70
+ + current={1}
71
+ + />
72
+ ```
73
+
74
+ The key is an identifier, so it is not translated; the label is. A caller that already had keys
75
+ for its steps passes them straight through.
76
+
77
+ - **`WizardStep` is now an alias of `Step`.** It was a second declaration of the same shape, and
78
+ the template flattened it to labels before drawing the strip, which is exactly where the identity
79
+ was being dropped. Code that already builds `{ key, label }` objects needs no change.
80
+
81
+ ### Added
82
+
83
+ - **`RadioGroup.look`** — `list` (default), `chip` or `card`. Only the shell changes: the role, the
84
+ mark, the keyboard behaviour and `aria-checked` are identical in all three, and the selected shell
85
+ takes an outline and a hard offset rather than a fill.
86
+
87
+ The card shape was missing, so a product that wanted "one of N, drawn as cards" built it from a
88
+ stack of bare buttons. The picture came out right and the meaning did not: a screen reader
89
+ announced three separate buttons instead of one choice among three. Rebuilding the role and the
90
+ keyboard at every call site is work, and it is done incompletely every time.
91
+
92
+ A second line goes inside `label`, which is already a `ReactNode`. There is no separate `hint`
93
+ field, because a prop that means something in only one shell is a lie told to everyone reading the
94
+ props table.
95
+
96
+ - **`PasswordInput.invalid`** — the sibling text field had it, this one did not, so a caller marking
97
+ a wrong password had to write the kit's class by hand. The class is only half of it: the hand-written
98
+ route never carried `aria-invalid`, so the error was visible and never announced.
99
+
100
+ ### Fixed
101
+
102
+ - The step strip no longer remounts its list items when labels change.
103
+
104
+ - **`PasswordInput` now reads the kit's own class table** instead of writing `tamga-input` by hand.
105
+ A rule added to the table reached every text field except this one, which is the same defect the
106
+ library asks its consumers not to introduce.
107
+
8
108
  ## 0.3.2
9
109
 
10
110
  **Every component that draws a host element now accepts `data-*`.** 98 of them; before this, 79 did
@@ -3,11 +3,17 @@
3
3
  *
4
4
  * Gerekçe: docs/gerekce/01-form-ve-girdi.md
5
5
  */
6
- export declare function PasswordInput({ labels, className, ...props }: Omit<React.ComponentProps<"input">, "type"> & {
6
+ export declare function PasswordInput({ labels, invalid, className, ...props }: Omit<React.ComponentProps<"input">, "type"> & {
7
7
  labels: {
8
8
  show: string;
9
9
  hide: string;
10
10
  };
11
+ /**
12
+ * The field failed validation: it takes the error edge and sets `aria-invalid`, so the failure is
13
+ * announced as well as shown. TR: Alan doğrulamadan geçemedi: hata kenarını alıyor ve
14
+ * `aria-invalid` koyuyor, yani hata görünmekle kalmıyor duyuruluyor da.
15
+ */
16
+ invalid?: boolean;
11
17
  }): import("react").JSX.Element;
12
18
  /**
13
19
  * Maskeli sır — API anahtarı, webhook secret.
@@ -1 +1 @@
1
- {"version":3,"file":"advanced-input.d.ts","sourceRoot":"","sources":["../../src/components/advanced-input.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"advanced-input.d.ts","sourceRoot":"","sources":["../../src/components/advanced-input.tsx"],"names":[],"mappings":"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"}
@@ -2,6 +2,7 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { useEffect, useId, useRef, useState } from "react";
4
4
  import { cn } from "../lib/cn.js";
5
+ import { inputVariants } from "./input.js";
5
6
  import { dataProps } from "../lib/data-props.js";
6
7
  import { Icon } from "./icon.js";
7
8
  import { Check, Close, Customize, Eye, EyeSlash, Search } from "./icons.js";
@@ -16,9 +17,9 @@ import { Check, Close, Customize, Eye, EyeSlash, Search } from "./icons.js";
16
17
  *
17
18
  * Gerekçe: docs/gerekce/01-form-ve-girdi.md
18
19
  */
19
- export function PasswordInput({ labels, className, ...props }) {
20
+ export function PasswordInput({ labels, invalid = false, className, ...props }) {
20
21
  const [shown, setShown] = useState(false);
21
- return (_jsxs("span", { className: "relative flex items-center", children: [_jsx("input", { ...props, type: shown ? "text" : "password", className: cn("tamga-input w-full pr-10", className) }), _jsx("button", { type: "button", className: "tamga-mini-btn absolute right-1.5", "aria-label": shown ? labels.hide : labels.show, "aria-pressed": shown, onClick: () => setShown((v) => !v), children: _jsx(Icon, { icon: shown ? EyeSlash : Eye, size: "xs" }) })] }));
22
+ return (_jsxs("span", { className: "relative flex items-center", children: [_jsx("input", { type: shown ? "text" : "password", "aria-invalid": invalid || undefined, className: cn(inputVariants({ invalid }), "w-full pr-11", className), ...props }), _jsx("button", { type: "button", className: "tamga-field-btn", "aria-label": shown ? labels.hide : labels.show, "aria-pressed": shown, onClick: () => setShown((v) => !v), children: _jsx(Icon, { icon: shown ? EyeSlash : Eye, size: "xs" }) })] }));
22
23
  }
23
24
  /**
24
25
  * Maskeli sır — API anahtarı, webhook secret.
@@ -174,12 +174,28 @@ export declare function Badge({ count, max, tone, label, className, children, ..
174
174
  /** `data-*` hooks pass through. TR: `data-*` kancaları geçiyor. */
175
175
  [k: `data-${string}`]: unknown;
176
176
  }): import("react").JSX.Element;
177
+ /**
178
+ * Bir adım: kimliği ve çevrilmiş etiketi.
179
+ *
180
+ * KİMLİK ETİKETTEN AYRI, ve bu bir kolaylık değil bir düzeltme. Adım listesi
181
+ * bir zamanlar düz `string[]` idi: kimlik yoktu, React anahtarı ÇEVRİLMİŞ
182
+ * ETİKETTİ, ve iki adım aynı etiketi taşıdığında ya da dil değiştiğinde
183
+ * düğümler yeniden kuruluyordu. Kitin kendi kuralı bunu zaten söylüyor:
184
+ * bir öğenin adı etiketi değildir, çünkü etiket çevrilir ve değişir.
185
+ *
186
+ * `key` ve `label` DIŞINDAKİ her şey o adımın `<li>`sine iniyor, yani bir
187
+ * adım testin ya da stilin ihtiyaç duyduğu kancayı taşıyabiliyor. Kardeşi
188
+ * `Segmented` ile aynı sözleşme; ikisinin farklı olması bir asimetriydi.
189
+ */
190
+ export type Step = {
191
+ key: string;
192
+ label: string;
193
+ } & Record<string, unknown>;
177
194
  /**
178
195
  * Adım göstergesi.
179
196
  *
180
- * Üründe bir sihirbaz şablonu vardı ve adım göstergesi yoktu — yani kullanıcı
181
- * kaçıncı adımda olduğunu ve kaç adım kaldığını bilmiyordu. Bir sihirbazın
182
- * varlık sebebi tam olarak budur.
197
+ * Bir sihirbazın adım göstergesi yoksa kullanıcı kaçıncı adımda olduğunu ve
198
+ * kaç adım kaldığını bilmiyor; sihirbazın varlık sebebi tam olarak budur.
183
199
  *
184
200
  * `<ol>` kullanılıyor: adımlar SIRALI ve sıra bilgi taşıyor. Ekran okuyucu
185
201
  * "3 öğeli liste, öğe 2" der; `<div>`'lerle bu bilgi kaybolur.
@@ -189,7 +205,13 @@ export declare function Badge({ count, max, tone, label, className, children, ..
189
205
  * ayrı iki soru.
190
206
  */
191
207
  export declare function Steps({ steps, current, className, ...rest }: {
192
- steps: readonly string[];
208
+ /**
209
+ * The steps, in order. Anything beyond `key` and `label` lands on that step's `<li>`, so a step
210
+ * can carry the hook a test or a style needs. TR: Adımlar, sırasıyla. `key` ve `label` dışındaki
211
+ * her şey o adımın `<li>`sine iniyor, yani bir adım testin ya da stilin ihtiyaç duyduğu kancayı
212
+ * taşıyabiliyor.
213
+ */
214
+ steps: readonly Step[];
193
215
  /** The active step, counting from zero. TR: Sıfırdan sayan aktif adım. */
194
216
  current: number;
195
217
  className?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"display.d.ts","sourceRoot":"","sources":["../../src/components/display.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA6D,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGlG,OAAO,KAAK,EAAE,IAAI,IAAI,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,EAA4B,KAAK,aAAa,EAAE,MAAM,WAAW,CAAC;AAEzE,OAAO,EAAU,KAAK,IAAI,EAAE,MAAM,WAAW,CAAC;AAU9C;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,MAAe,EACf,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,KAAK,EAAE,SAAS;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,SAAS,CAAC;QAAC,IAAI,CAAC,EAAE,OAAO,CAAA;KAAE,EAAE,CAAC;IACrE;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAqBA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,wBAAgB,GAAG,CAAC,EAClB,KAAK,EACL,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,MAAa,EACb,KAAK,EACL,IAAI,EACJ,OAAO,EACP,OAAO,EACP,aAAa,EAAE,IAAkB,EACjC,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,0HAA0H;IAC1H,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,6FAA6F;IAC7F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,MAAM,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACvB,sFAAsF;IACtF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,uGAAuG;IACvG,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2GAA2G;IAC3G,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,qFAAqF;IACrF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gJAAgJ;IAChJ,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAgEA;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,OAAO,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAA;CAAE,+BAWpI;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,qEAAqE;IACrE,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAuCA;AAED;;;;;GAKG;AACH,wBAAgB,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAWvF;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,GAAQ,EACR,IAAe,EACf,KAAK,EACL,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAuBA;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,OAAO,EACP,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,KAAK,EAAE,SAAS,MAAM,EAAE,CAAC;IACzB,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAoCA"}
1
+ {"version":3,"file":"display.d.ts","sourceRoot":"","sources":["../../src/components/display.tsx"],"names":[],"mappings":"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"}
@@ -174,9 +174,8 @@ export function Badge({ count, max = 99, tone = "danger", label, className, chil
174
174
  /**
175
175
  * Adım göstergesi.
176
176
  *
177
- * Üründe bir sihirbaz şablonu vardı ve adım göstergesi yoktu — yani kullanıcı
178
- * kaçıncı adımda olduğunu ve kaç adım kaldığını bilmiyordu. Bir sihirbazın
179
- * varlık sebebi tam olarak budur.
177
+ * Bir sihirbazın adım göstergesi yoksa kullanıcı kaçıncı adımda olduğunu ve
178
+ * kaç adım kaldığını bilmiyor; sihirbazın varlık sebebi tam olarak budur.
180
179
  *
181
180
  * `<ol>` kullanılıyor: adımlar SIRALI ve sıra bilgi taşıyor. Ekran okuyucu
182
181
  * "3 öğeli liste, öğe 2" der; `<div>`'lerle bu bilgi kaybolur.
@@ -186,9 +185,9 @@ export function Badge({ count, max = 99, tone = "danger", label, className, chil
186
185
  * ayrı iki soru.
187
186
  */
188
187
  export function Steps({ steps, current, className, ...rest }) {
189
- return (_jsx("ol", { ...dataProps(rest), className: cn("flex flex-wrap items-center gap-x-3 gap-y-2", className), children: steps.map((s, i) => {
188
+ return (_jsx("ol", { ...dataProps(rest), className: cn("flex flex-wrap items-center gap-x-3 gap-y-2", className), children: steps.map(({ key, label, ...adimRest }, i) => {
190
189
  const done = i < current;
191
190
  const active = i === current;
192
- return (_jsxs("li", { className: "flex items-center gap-3", children: [_jsx("span", { className: "tamga-step-mark font-mono text-caption", "data-state": done ? "done" : active ? "current" : "todo", "aria-hidden": true, children: done ? _jsx(Icon, { icon: Check, size: "xs", weight: "bold" }) : i + 1 }), _jsx("span", { className: cn("text-small", active ? "font-medium text-ink" : "text-ink-faint"), "aria-current": active ? "step" : undefined, children: s }), i < steps.length - 1 ? (_jsx("span", { "aria-hidden": true, className: "tamga-step-line", "data-done": done ? "true" : "false" })) : null] }, s));
191
+ return (_jsxs("li", { ...adimRest, className: "flex items-center gap-3", children: [_jsx("span", { className: "tamga-step-mark font-mono text-caption", "data-state": done ? "done" : active ? "current" : "todo", "aria-hidden": true, children: done ? _jsx(Icon, { icon: Check, size: "xs", weight: "bold" }) : i + 1 }), _jsx("span", { className: cn("text-small", active ? "font-medium text-ink" : "text-ink-faint"), "aria-current": active ? "step" : undefined, children: label }), i < steps.length - 1 ? (_jsx("span", { "aria-hidden": true, className: "tamga-step-line", "data-done": done ? "true" : "false" })) : null] }, key));
193
192
  }) }));
194
193
  }
@@ -1,9 +1,15 @@
1
1
  import type { ReactNode } from "react";
2
- export declare function RadioGroup<T extends string>({ options, value, onChange, label, disabled, className, ...rest }: {
3
- options: readonly {
2
+ export declare function RadioGroup<T extends string>({ options, value, onChange, label, look, disabled, className, ...rest }: {
3
+ /**
4
+ * The choices. Anything beyond `value` and `label` lands on that option's button, so a choice can
5
+ * carry the hook a test or a style needs. TR: Seçenekler. `value` ve `label` dışındaki her şey o
6
+ * seçeneğin düğmesine iniyor, yani bir seçenek testin ya da stilin ihtiyaç duyduğu kancayı
7
+ * taşıyabiliyor.
8
+ */
9
+ options: readonly ({
4
10
  value: T;
5
11
  label: ReactNode;
6
- }[];
12
+ } & Record<string, unknown>)[];
7
13
  value: T;
8
14
  onChange?: (next: T) => void;
9
15
  /**
@@ -11,6 +17,19 @@ export declare function RadioGroup<T extends string>({ options, value, onChange,
11
17
  * adı: "hangi seçeneklerden biri" sorusunun cevabı.
12
18
  */
13
19
  label: string;
20
+ /**
21
+ * The shell each option is drawn in. TR: Her seçeneğin çizildiği kabuk.
22
+ *
23
+ * `list` alt alta, işaret ve etiket; `chip` yan yana sarılan küçük kabuklar; `card` ikinci bir
24
+ * satır taşıyacak kadar yer veren bir kart yüzeyi.
25
+ *
26
+ * Değişen yalnız kabuk: `role="radiogroup"`, `role="radio"`, `aria-checked` ve klavye davranışı
27
+ * üçünde de aynı. Seçili kabuk çerçeve ve sert offset alıyor, dolgu değil (Yasa 2).
28
+ *
29
+ * İkinci satır `label`in içine yazılıyor; ayrı bir `hint` alanı yok, çünkü etiket zaten
30
+ * `ReactNode` ve yalnız tek bir kabukta anlamı olan bir prop props tablosunda herkese görünürdü.
31
+ */
32
+ look?: "list" | "chip" | "card";
14
33
  disabled?: boolean;
15
34
  className?: string;
16
35
  /** `data-*` hooks pass through. TR: `data-*` kancaları geçiyor. */
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../src/components/radio-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAWvC,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,EAAE,EAC3C,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,EACL,QAAgB,EAChB,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD,OAAO,EAAE,SAAS;QAAE,KAAK,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,EAAE,CAAC;IACnD,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BA6BA"}
1
+ {"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../src/components/radio-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAWvC,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,EAAE,EAC3C,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,EACL,IAAa,EACb,QAAgB,EAChB,SAAS,EACT,GAAG,IAAI,EACR,EAAE;IACD;;;;;OAKG;IACH,OAAO,EAAE,SAAS,CAAC;QAAE,KAAK,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAAE,CAAC;IAC/E,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;;;;;;;OAWG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mEAAmE;IACnE,CAAC,CAAC,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CAChC,+BAmDA"}
@@ -9,8 +9,8 @@ import { OFF } from "./control-base.js";
9
9
  * Grubun kendisi `role="radiogroup"`, satırlar `role="radio"`. İkisi birden
10
10
  * olmadan ekran okuyucu "üç ayrı düğme" duyurur, "üç seçenekten biri" değil.
11
11
  * ---------------------------------------------------------------- */
12
- export function RadioGroup({ options, value, onChange, label, disabled = false, className, ...rest }) {
13
- return (_jsx("div", { ...dataProps(rest), role: "radiogroup", "aria-label": label, className: cn("flex flex-col gap-2", className), children: options.map((o) => (_jsxs("button", { type: "button", role: "radio", "aria-checked": value === o.value, "aria-disabled": disabled || undefined, onClick: () => !disabled && onChange?.(o.value),
12
+ export function RadioGroup({ options, value, onChange, label, look = "list", disabled = false, className, ...rest }) {
13
+ return (_jsx("div", { ...dataProps(rest), role: "radiogroup", "aria-label": label, "data-look": look, className: cn(look === "list" ? "flex flex-col gap-2" : "flex flex-wrap gap-2", look === "card" && "sm:grid sm:grid-cols-3", className), children: options.map(({ value: v, label: etiket, ...rest }) => (_jsxs("button", { type: "button", ...rest, role: "radio", "aria-checked": value === v, "aria-disabled": disabled || undefined, onClick: () => !disabled && onChange?.(v),
14
14
  /* ÜSTTEN HİZALI VE TAM GENİŞLİK, ve ikisi de iki satırlık bir
15
15
  seçenek yüzünden değişti.
16
16
  `items-center` tek satırlık etiketlerde doğru duruyordu; altına
@@ -20,5 +20,5 @@ export function RadioGroup({ options, value, onChange, label, disabled = false,
20
20
  erkenden sarıyor ve seçenekler farklı genişliklerde tırtıklı bir
21
21
  sütun oluşturuyordu. Tam genişlik hepsini aynı sol kenara ve aynı
22
22
  sarma noktasına oturtuyor. */
23
- className: "flex w-full items-start gap-2 text-left text-body", style: disabled ? OFF : undefined, children: [_jsx("span", { className: "tamga-radio tamga-choice-mark", "data-checked": value === o.value }), _jsx("span", { className: "min-w-0 flex-1", children: o.label })] }, o.value))) }));
23
+ className: cn("text-body", look === "list" && "flex w-full items-start gap-2 text-left", look === "chip" && "tamga-choice-chip", look === "card" && "tamga-choice-card"), style: disabled ? OFF : undefined, children: [_jsx("span", { className: cn("tamga-radio", look !== "chip" && "tamga-choice-mark"), "data-checked": value === v }), _jsx("span", { className: "min-w-0 flex-1", children: etiket })] }, v))) }));
24
24
  }
package/dist/index.d.ts CHANGED
@@ -47,7 +47,7 @@ export { prepareImage, cropSquare, IMAGE_ACCEPT, type ImageError } from "./lib/i
47
47
  export { RailLink } from "./components/rail-link.js";
48
48
  export { Slider } from "./components/slider.js";
49
49
  export { Accordion, Collapsible } from "./components/disclosure.js";
50
- export { Descriptions, Kpi, KpiGrid, Code, Kbd, Badge, Steps } from "./components/display.js";
50
+ export { Descriptions, Kpi, KpiGrid, Code, Kbd, Badge, Steps, type Step } from "./components/display.js";
51
51
  export { PasswordInput, SecretField, TagsInput, MultiSelect, ScheduleInput, } from "./components/advanced-input.js";
52
52
  export { LineChart, type Series } from "./components/chart.js";
53
53
  export { PieChart, type PieSlice } from "./components/pie.js";
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
package/dist/kit.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tamga-ui 0.3.2 · MIT · https://tamga.org.tr */
1
+ /*! tamga-ui 0.4.1 · MIT · https://tamga.org.tr */
2
2
  :root {
3
3
 
4
4
  --overlay-gap: 8px;
@@ -495,6 +495,32 @@
495
495
  color: var(--color-accent-line);
496
496
  }
497
497
 
498
+ .tamga-field-btn {
499
+ position: absolute;
500
+ top: 1px;
501
+ right: 1px;
502
+ bottom: 1px;
503
+ display: inline-flex;
504
+ width: 34px;
505
+ align-items: center;
506
+ justify-content: center;
507
+ border-left: 1px solid var(--color-line);
508
+ border-radius: 0 var(--radius-ctl) var(--radius-ctl) 0;
509
+ background: transparent;
510
+ color: var(--color-ink-faint);
511
+ cursor: pointer;
512
+ transition: color var(--duration-press) var(--ease-standard),
513
+ background var(--duration-press) var(--ease-standard);
514
+ }
515
+ .tamga-field-btn:hover {
516
+ background: var(--color-hover);
517
+ color: var(--color-ink);
518
+ }
519
+
520
+ .tamga-field-btn[aria-pressed="true"] {
521
+ color: var(--color-accent-line);
522
+ }
523
+
498
524
  .tamga-stepper {
499
525
  position: absolute;
500
526
  top: 1px;
@@ -878,6 +904,44 @@
878
904
  margin-top: calc((1lh - 18px) / 2);
879
905
  }
880
906
 
907
+ .tamga-choice-chip {
908
+ display: inline-flex;
909
+ align-items: center;
910
+ gap: 8px;
911
+ height: auto;
912
+ min-height: 32px;
913
+ padding: 4px 10px;
914
+ border-radius: var(--radius-ctl);
915
+ border: 1px solid var(--color-edge);
916
+ background: var(--color-shell);
917
+ font-size: var(--text-small);
918
+ cursor: pointer;
919
+ }
920
+ .tamga-choice-card {
921
+ display: flex;
922
+ align-items: flex-start;
923
+ gap: 8px;
924
+ width: 100%;
925
+ min-width: 0;
926
+ text-align: left;
927
+ padding: 16px;
928
+ border-radius: var(--radius-card);
929
+ border: 1px solid var(--color-edge);
930
+ background: var(--color-shell);
931
+ cursor: pointer;
932
+ }
933
+ .tamga-choice-chip[aria-checked="true"],
934
+ .tamga-choice-card[aria-checked="true"] {
935
+ border-color: var(--color-accent-line);
936
+ box-shadow: 2px 2px 0 var(--color-accent-line);
937
+ }
938
+
939
+ .tamga-choice-chip:not([aria-checked="true"]):active,
940
+ .tamga-choice-card:not([aria-checked="true"]):active {
941
+ transform: translate(1px, 1px);
942
+ transition-duration: 0s;
943
+ }
944
+
881
945
  .tamga-check, .tamga-radio {
882
946
  display: inline-flex;
883
947
  align-items: center;
@@ -13,6 +13,21 @@ export type NavEntry = {
13
13
  /** The translated label. In the tooltip on a narrow rail, on the row itself on a wide one. TR: Çevrilmiş etiket. Dar rayda ipucunda, geniş rayda satırın kendisinde. */
14
14
  label: string;
15
15
  icon: ComponentProps<typeof Icon>["icon"];
16
+ /**
17
+ * The group this entry belongs to, already translated. TR: Bu girişin ait olduğu grup, çevrilmiş
18
+ * hâliyle.
19
+ *
20
+ * Ray, ardışık girişleri bu ada göre kümeliyor ve grup değiştiğinde bir başlık çiziyor. Verilmezse
21
+ * giriş başlıksız kalıyor; hiçbiri vermezse ray tek bir liste olarak çiziliyor, yani eski davranış.
22
+ *
23
+ * ALAN DÜZ, VERİ İÇ İÇE DEĞİL. `nav` bir gruplar dizisi olsaydı bu kırıcı bir değişiklik olurdu,
24
+ * ve boş bir grup kurmak mümkün hâle gelirdi. Düz listede o iki sorun da yok: grup başlığı
25
+ * verinin bir alanı, ve başlık ancak bir girişi varsa görünüyor.
26
+ *
27
+ * YALNIZ GENİŞ RAYDA ÇİZİLİYOR. Dar rayda 40 piksellik bir kutuda başlık okunmuyor; orada
28
+ * gruplama boşlukla anlatılıyor.
29
+ */
30
+ section?: string;
16
31
  };
17
32
  export type AppShellProps = {
18
33
  /** The brand mark at the top of the rail; the caller supplies its own link. TR: Rayın tepesindeki marka işareti; kendi bağlantısını çağıran veriyor. */
@@ -1 +1 @@
1
- {"version":3,"file":"app-shell.d.ts","sourceRoot":"","sources":["../../src/patterns/app-shell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAE7C,OAAO,EAAa,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5D;;;;;GAKG;AAEH,MAAM,MAAM,QAAQ,GAAG;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,wKAAwK;IACxK,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC;CAC3C,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,wJAAwJ;IACxJ,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,GAAG,EAAE,SAAS,QAAQ,EAAE,CAAC;IACzB,mGAAmG;IACnG,UAAU,EAAE,MAAM,CAAC;IACnB;;;;;;;;;;;OAWG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACzB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,uIAAuI;IACvI,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC;IAC7C,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,GAAG,EACH,UAAU,EACV,IAAe,EACf,MAAM,EACN,UAAU,EACV,aAAa,EAAE,IAAgB,EAC/B,MAAM,EACN,QAAQ,GACT,EAAE,aAAa,+BAuEf"}
1
+ {"version":3,"file":"app-shell.d.ts","sourceRoot":"","sources":["../../src/patterns/app-shell.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAE7C,OAAO,EAAa,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5D;;;;;GAKG;AAEH,MAAM,MAAM,QAAQ,GAAG;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,wKAAwK;IACxK,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC;IAC1C;;;;;;;;;;;;;OAaG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,wJAAwJ;IACxJ,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,GAAG,EAAE,SAAS,QAAQ,EAAE,CAAC;IACzB,mGAAmG;IACnG,UAAU,EAAE,MAAM,CAAC;IACnB;;;;;;;;;;;OAWG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACzB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,uIAAuI;IACvI,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,MAAM,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC;IAC7C,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,GAAG,EACH,UAAU,EACV,IAAe,EACf,MAAM,EACN,UAAU,EACV,aAAa,EAAE,IAAgB,EAC/B,MAAM,EACN,QAAQ,GACT,EAAE,aAAa,+BAiFf"}
@@ -1,5 +1,6 @@
1
1
  "use client";
2
2
  import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { Fragment } from "react";
3
4
  import { Icon } from "../components/icon.js";
4
5
  import { RailLink } from "../components/rail-link.js";
5
6
  import { PlainLink } from "./shared.js";
@@ -9,5 +10,5 @@ export function AppShell({ brand, nav, activePath, rail = "narrow", topbar, rail
9
10
  altındaki her rotayı yutar. */
10
11
  const isCurrent = (href) => href === "/" ? activePath === href : activePath === href || activePath.startsWith(`${href}/`);
11
12
  const wide = rail === "wide";
12
- return (_jsxs("div", { className: "flex h-dvh w-full overflow-hidden bg-shell text-ink-soft", children: [_jsxs("aside", { className: `flex shrink-0 flex-col gap-2 bg-shell py-4 ${wide ? "w-60 px-3" : "w-20 items-center px-1"}`, "data-rail": rail, children: [brand ? (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": labels.home, className: `mb-2 flex h-10 shrink-0 items-center text-ink ${wide ? "px-2" : "w-10 justify-center"}`, children: brand }), _jsx("span", { className: `h-0 w-6 border-t border-line ${wide ? "ml-2" : ""}` })] })) : null, _jsx("nav", { "aria-label": labels.primaryNav, className: `tamga-rail-scroll flex w-full flex-1 flex-col gap-2 py-1 ${wide ? "" : "items-center"}`, children: nav.map((entry) => (_jsx(RailLink, { href: entry.href, label: entry.label, active: isCurrent(entry.href), showLabel: wide, linkComponent: Link, "data-nav": entry.key, children: _jsx(Icon, { icon: entry.icon, size: "base" }) }, entry.key))) }), railFooter ? _jsx("div", { className: "shrink-0", children: railFooter }) : null] }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("header", { className: "tamga-gutter flex items-center gap-4 py-4", children: topbar }), _jsx("div", { className: "min-h-0 flex-1 overflow-hidden pr-4 pb-4", children: _jsx("main", { className: "tamga-surface h-full min-h-0 overflow-y-auto", children: children }) })] })] }));
13
+ return (_jsxs("div", { className: "flex h-dvh w-full overflow-hidden bg-shell text-ink-soft", children: [_jsxs("aside", { className: `flex shrink-0 flex-col gap-2 bg-shell py-4 ${wide ? "w-60 px-3" : "w-20 items-center px-1"}`, "data-rail": rail, children: [brand ? (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": labels.home, className: `mb-2 flex h-10 shrink-0 items-center text-ink ${wide ? "px-2" : "w-10 justify-center"}`, children: brand }), _jsx("span", { className: `h-0 w-6 border-t border-line ${wide ? "ml-2" : ""}` })] })) : null, _jsx("nav", { "aria-label": labels.primaryNav, className: `tamga-rail-scroll flex w-full flex-1 flex-col gap-2 py-1 ${wide ? "" : "items-center"}`, children: nav.map((entry, i) => (_jsxs(Fragment, { children: [wide && entry.section && entry.section !== nav[i - 1]?.section ? (_jsx("p", { className: `px-2.5 text-micro font-semibold uppercase tracking-wide text-ink-faint ${i > 0 ? "mt-4 pb-1" : "pb-1"}`, children: entry.section })) : null, _jsx(RailLink, { href: entry.href, label: entry.label, active: isCurrent(entry.href), showLabel: wide, linkComponent: Link, "data-nav": entry.key, children: _jsx(Icon, { icon: entry.icon, size: "base" }) })] }, entry.key))) }), railFooter ? _jsx("div", { className: "shrink-0", children: railFooter }) : null] }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx("header", { className: "tamga-gutter flex items-center gap-4 py-4", children: topbar }), _jsx("div", { className: "min-h-0 flex-1 overflow-hidden pr-4 pb-4", children: _jsx("main", { className: "tamga-surface h-full min-h-0 overflow-y-auto", children: children }) })] })] }));
13
14
  }
@@ -1,4 +1,5 @@
1
1
  import type { ReactNode } from "react";
2
+ import { type Step } from "../components/display.js";
2
3
  import { type ErrorLabels, type TemplateError } from "./shared.js";
3
4
  /**
4
5
  * Sonu belli olan bir akış: kuruluş, bir kayıt ekleme.
@@ -6,11 +7,16 @@ import { type ErrorLabels, type TemplateError } from "./shared.js";
6
7
  * Verdiği söz "bu kadar adım ve bitti"; "bitti" konumsal.
7
8
  * Gerekçe: docs/adr/0004-sablon-katmani.md
8
9
  */
9
- export type WizardStep = {
10
- key: string;
11
- /** The translated label. TR: Çevrilmiş etiket. */
12
- label: string;
13
- };
10
+ /**
11
+ * Bir sihirbaz adımı: kitin `Step`inin ta kendisi.
12
+ *
13
+ * AYRI BİR TİP DEĞİL, ve bir süre öyleydi: burada `{ key, label }` diye ikinci
14
+ * kez tanımlıydı ve şerit çizilirken `steps.map((s) => s.label)` yapılıyordu,
15
+ * yani KİMLİK TAM SINIRDA ÇÖPE GİDİYORDU. Şeridi çizen `Steps` kimliği hiç
16
+ * görmediği için bir adıma kanca takmanın yolu yoktu, ve React anahtarı
17
+ * çevrilmiş etiketti. İki tip tek tipe indi; kimlik artık aşağı akıyor.
18
+ */
19
+ export type WizardStep = Step;
14
20
  export type WizardState = "ready" | "error";
15
21
  export type WizardTemplateProps = {
16
22
  steps: readonly WizardStep[];
@@ -1 +1 @@
1
- {"version":3,"file":"wizard-template.d.ts","sourceRoot":"","sources":["../../src/patterns/wizard-template.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAa,KAAK,WAAW,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAE9E;;;;;GAKG;AAEH,MAAM,MAAM,UAAU,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,kDAAkD;IAClD,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,OAAO,CAAC;AAE5C,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,SAAS,UAAU,EAAE,CAAC;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,KAAe,EACf,KAAK,EACL,MAAM,EACN,QAAQ,GACT,EAAE,mBAAmB,+BA4CrB"}
1
+ {"version":3,"file":"wizard-template.d.ts","sourceRoot":"","sources":["../../src/patterns/wizard-template.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAS,KAAK,IAAI,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,EAAa,KAAK,WAAW,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAE9E;;;;;GAKG;AAEH;;;;;;;;GAQG;AACH,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC;AAE9B,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,OAAO,CAAC;AAE5C,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,SAAS,UAAU,EAAE,CAAC;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,KAAe,EACf,KAAK,EACL,MAAM,EACN,QAAQ,GACT,EAAE,mBAAmB,+BA4CrB"}
@@ -4,5 +4,5 @@ import { Steps } from "../components/display.js";
4
4
  import { ErrorSlot } from "./shared.js";
5
5
  export function WizardTemplate({ steps, activeStep, title, subtitle, back, next, state = "ready", error, labels, children, }) {
6
6
  const activeIndex = steps.findIndex((s) => s.key === activeStep);
7
- return (_jsxs("div", { className: "flex min-h-0 flex-col", "data-wizard-state": state, children: [_jsx("div", { className: "tamga-section tamga-gutter py-4", children: _jsx(Steps, { steps: steps.map((s) => s.label), current: activeIndex < 0 ? 0 : activeIndex }) }), _jsx("div", { className: "tamga-gutter min-h-0 flex-1 py-6", children: _jsxs("div", { className: "max-w-[var(--measure)]", children: [_jsx("h2", { className: "text-title font-semibold text-ink", children: title }), subtitle ? _jsx("p", { className: "mt-1 text-small text-ink-faint", children: subtitle }) : null, _jsx("div", { className: "mt-6", children: state === "error" ? _jsx(ErrorSlot, { error: error, labels: labels }) : children })] }) }), back || next ? (_jsxs("div", { className: "tamga-section tamga-gutter sticky bottom-0 z-10 flex items-center gap-2 bg-shell py-4", children: [back, _jsx("div", { className: "ml-auto flex items-center gap-2", children: next })] })) : null, _jsx("span", { className: "sr-only", "aria-live": "polite", children: activeIndex >= 0 ? `${activeIndex + 1} / ${steps.length}` : "" })] }));
7
+ return (_jsxs("div", { className: "flex min-h-0 flex-col", "data-wizard-state": state, children: [_jsx("div", { className: "tamga-section tamga-gutter py-4", children: _jsx(Steps, { steps: steps, current: activeIndex < 0 ? 0 : activeIndex }) }), _jsx("div", { className: "tamga-gutter min-h-0 flex-1 py-6", children: _jsxs("div", { className: "max-w-[var(--measure)]", children: [_jsx("h2", { className: "text-title font-semibold text-ink", children: title }), subtitle ? _jsx("p", { className: "mt-1 text-small text-ink-faint", children: subtitle }) : null, _jsx("div", { className: "mt-6", children: state === "error" ? _jsx(ErrorSlot, { error: error, labels: labels }) : children })] }) }), back || next ? (_jsxs("div", { className: "tamga-section tamga-gutter sticky bottom-0 z-10 flex items-center gap-2 bg-shell py-4", children: [back, _jsx("div", { className: "ml-auto flex items-center gap-2", children: next })] })) : null, _jsx("span", { className: "sr-only", "aria-live": "polite", children: activeIndex >= 0 ? `${activeIndex + 1} / ${steps.length}` : "" })] }));
8
8
  }
package/dist/styles.css CHANGED
@@ -1,3 +1,3 @@
1
- /*! tamga-ui 0.3.2 · MIT · https://tamga.org.tr */
1
+ /*! tamga-ui 0.4.1 · MIT · https://tamga.org.tr */
2
2
  @import "./theme.css";
3
3
  @import "./kit.css";
package/dist/theme.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tamga-ui 0.3.2 · MIT · https://tamga.org.tr */
1
+ /*! tamga-ui 0.4.1 · MIT · https://tamga.org.tr */
2
2
  @custom-variant dark (&:is(.dark *));
3
3
 
4
4
  @theme {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tamga-ui",
3
- "version": "0.3.2",
3
+ "version": "0.4.1",
4
4
  "description": "Mantıksal's shared interface library: tokens, physics and components.",
5
5
  "license": "MIT",
6
6
  "type": "module",