tamga-ui 0.1.0

package/dist/components/skeleton.js

@@ -0,0 +1,67 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Skeletons.
+ *
+ * Gerekçe: docs/gerekce/04-bos-ve-hata.md
+ */
+const STEP = 70;
+const MAX_STEPS = 6;
+function delay(i = 0) {
+    return { ["--tamga-delay"]: `${(i % MAX_STEPS) * STEP}ms` };
+}
+export function Skeleton({ className = "", index = 0, style, }) {
+    return (_jsx("span", { className: `tamga-skeleton block ${className}`, style: { ...delay(index), ...style } }));
+}
+/** Paragraph copy. The last line is always short — real text ends mid-line. */
+export function SkeletonText({ lines = 3, className = "", }) {
+    const widths = ["100%", "96%", "92%", "98%"];
+    return (_jsx("span", { className: `flex flex-col gap-2 ${className}`, children: Array.from({ length: lines }, (_, i) => (_jsx(Skeleton, { index: i, className: "h-3", style: { width: i === lines - 1 ? "62%" : widths[i % widths.length] } }, i))) }));
+}
+/**
+ * A list row. Mirrors `.tamga-list-row` exactly, including the 56px height, so the
+ * skeleton list and the real list are the same object with the text removed.
+ */
+export function SkeletonRows({ rows = 5, dense = false, }) {
+    return (_jsx(_Fragment, { children: Array.from({ length: rows }, (_, i) => (_jsxs("div", { className: `tamga-list-row ${dense ? "tamga-list-row-sm" : ""}`, "aria-hidden": true, children: [_jsx(Skeleton, { index: i, className: "size-2.5 shrink-0" }), _jsx(Skeleton, { index: i, className: "h-3 w-40 shrink-0" }), _jsx(Skeleton, { index: i, className: "h-3 min-w-0 flex-1 max-w-28" }), _jsx(Skeleton, { index: i, className: "ml-auto h-3 w-14 shrink-0" })] }, i))) }));
+}
+/**
+ * The KPI tile: icon tile, label, big number.
+ *
+ * TR: İSKELET KARONUN KENDİSİYLE AYNI KALIPTA. `Kpi` ikon karosu alınca bu
+ * iskelet eski hâlinde kaldıysa yükleme bittiğinde içerik yana zıplıyor, ve
+ * bir iskeletin tek işi o zıplamayı önlemek. Bu yüzden ikisi aynı sınıfı
+ * (`tamga-kpi`) paylaşıyor: kalıp bir yerde değişince ikisi birden değişiyor.
+ */
+export function SkeletonKpi({ index = 0 }) {
+    return (_jsxs("section", { className: "tamga-kpi", "aria-hidden": true, children: [_jsx(Skeleton, { index: index, className: "size-10 shrink-0" }), _jsxs("div", { className: "flex min-w-0 flex-1 flex-col", children: [_jsx(Skeleton, { index: index + 1, className: "h-2.5 w-20" }), _jsx(Skeleton, { index: index + 2, className: "mt-2 h-7 w-24" })] })] }));
+}
+/** A card with a section head and a body area of a given height. */
+export function SkeletonCard({ height = 220, title = true, }) {
+    return (_jsxs("section", { className: "tamga-card flex min-w-0 flex-col", "aria-hidden": true, children: [title ? (_jsxs("div", { className: "tamga-head tamga-section tamga-gutter flex flex-nowrap items-center gap-3", children: [_jsx(Skeleton, { className: "h-3.5 w-32 shrink-0" }), _jsx(Skeleton, { index: 1, className: "h-2.5 min-w-0 flex-1 max-w-20" }), _jsx(Skeleton, { index: 2, className: "ml-auto h-6 w-20 shrink-0" })] })) : null, _jsx("div", { className: "tamga-gutter flex-1 py-5", children: _jsx(Skeleton, { index: 3, className: "w-full", style: { height } }) })] }));
+}
+/** A table: header rule plus n body rows across the given column widths. */
+export function SkeletonTable({ rows = 6, cols = ["12rem", "5rem", "6rem", "4rem", "5rem"], }) {
+    return (_jsxs("div", { className: "tamga-card overflow-hidden", "aria-hidden": true, children: [_jsx("div", { className: "tamga-head tamga-section tamga-gutter flex flex-nowrap items-center gap-6", children: cols.map((w, i) => (_jsx(Skeleton, { index: i, className: "h-2.5 min-w-0 flex-1", style: { maxWidth: w } }, i))) }), Array.from({ length: rows }, (_, r) => (_jsx("div", { className: "tamga-list-row flex flex-nowrap items-center gap-6", children: cols.map((w, i) => (_jsx(Skeleton, { index: r + i, className: "h-3 min-w-0 flex-1", style: { maxWidth: w } }, i))) }, r)))] }));
+}
+/**
+ * Panel contents.
+ *
+ * A panel that opens before its data arrives is the one place a spinner is most
+ * tempting and most wrong: the panel already has a known width and a known row
+ * height, so there is a real shape to hold. A spinner throws that away and then
+ * makes the whole panel jump when the rows land.
+ *
+ * Matches `.tamga-option` — 40px tall, 16px side padding, icon slot then label.
+ */
+export function SkeletonOptions({ rows = 4 }) {
+    const widths = ["68%", "84%", "56%", "76%", "64%"];
+    return (_jsx("div", { className: "py-1", "aria-hidden": true, children: Array.from({ length: rows }, (_, i) => (_jsxs("div", { className: "flex h-10 items-center gap-2 px-4", children: [_jsx(Skeleton, { index: i, className: "size-4 shrink-0" }), _jsx(Skeleton, { index: i, className: "h-3 min-w-0 flex-1", style: { maxWidth: widths[i % widths.length] } })] }, i))) }));
+}
+/** Free-form panel body — popover, dialog, sheet. */
+export function SkeletonPanel({ lines = 3, block, }) {
+    return (_jsxs("div", { className: "flex flex-col gap-3", "aria-hidden": true, children: [block ? _jsx(Skeleton, { className: "w-full", style: { height: block } }) : null, _jsx(SkeletonText, { lines: lines })] }));
+}
+/** Page band: title, subtitle, and the actions that sit on the right. */
+export function SkeletonPageBand() {
+    return (_jsxs("div", { className: "tamga-section tamga-gutter flex flex-wrap items-center gap-4 py-4", "aria-hidden": true, children: [_jsxs("div", { className: "min-w-0", children: [_jsx(Skeleton, { className: "h-4 w-40" }), _jsx(Skeleton, { index: 1, className: "mt-2 h-2.5 w-64" })] }), _jsxs("div", { className: "ml-auto flex items-center gap-2", children: [_jsx(Skeleton, { index: 2, className: "h-10 w-32" }), _jsx(Skeleton, { index: 3, className: "h-10 w-36" })] })] }));
+}

package/dist/components/slider.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Kendi dosyasında, çünkü YENİ BİR KONTROL.
+ *
+ * Gerekçe: docs/gerekce/01-form-ve-girdi.md
+ */
+/** Kaydırıcı. */
+export declare function Slider({ value, onChange, min, max, step, label, suffix, className, }: {
+    value: number;
+    onChange: (next: number) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    label: string;
+    /** The unit beside the value: "%", "ms", "₺". TR: Değerin yanındaki birim: "%", "ms", "₺". */
+    suffix?: string;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=slider.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../src/components/slider.tsx"],"names":[],"mappings":"AAIA;;;;GAIG;AAEH,iBAAiB;AACjB,wBAAgB,MAAM,CAAC,EACrB,KAAK,EACL,QAAQ,EACR,GAAO,EACP,GAAS,EACT,IAAQ,EACR,KAAK,EACL,MAAM,EACN,SAAS,GACV,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,8FAA8F;IAC9F,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAuBA"}

package/dist/components/slider.js

@@ -0,0 +1,15 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn.js";
+/**
+ * Kendi dosyasında, çünkü YENİ BİR KONTROL.
+ *
+ * Gerekçe: docs/gerekce/01-form-ve-girdi.md
+ */
+/** Kaydırıcı. */
+export function Slider({ value, onChange, min = 0, max = 100, step = 1, label, suffix, className, }) {
+    const pct = ((value - min) / (max - min)) * 100;
+    return (_jsxs("span", { className: cn("flex items-center gap-4", className), children: [_jsx("input", { type: "range", value: value, min: min, max: max, step: step, "aria-label": label, onChange: (e) => onChange(Number(e.target.value)), className: "tamga-slider h-1.5 flex-1 cursor-pointer appearance-none rounded-full", style: {
+                    background: `linear-gradient(to right, var(--color-accent-line) ${pct}%, var(--color-edge) ${pct}%)`,
+                } }), _jsxs("span", { className: "w-16 shrink-0 text-right font-mono text-body text-ink tabular-nums", children: [value, suffix] })] }));
+}

package/dist/components/sparkline.d.ts

@@ -0,0 +1,17 @@
+import { type Tone } from "./tone.js";
+/**
+ * Sparkline — satır içi, eksensiz mini grafik.
+ *
+ * Gerekçe: docs/gerekce/03-grafik-ve-olcum.md
+ */
+export declare function Sparkline({ values, tone, width, height, }: {
+    values: number[];
+    /**
+     * Colour's job here is to report a status. A neutral line takes ink-faint. TR: Rengin işi
+     * durum bildirmek. Nötr olan çizgi rengini ink-faint alır.
+     */
+    tone?: Tone;
+    width?: number;
+    height?: number;
+}): import("react").JSX.Element;
+//# sourceMappingURL=sparkline.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sparkline.d.ts","sourceRoot":"","sources":["../../src/components/sparkline.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,IAAI,EAAE,MAAM,WAAW,CAAC;AAEvD;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,EACxB,MAAM,EACN,IAAgB,EAChB,KAAW,EACX,MAAW,GACZ,EAAE;IACD,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,+BAiCA"}

package/dist/components/sparkline.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { neutral, toneOf } from "./tone.js";
+/**
+ * Sparkline — satır içi, eksensiz mini grafik.
+ *
+ * Gerekçe: docs/gerekce/03-grafik-ve-olcum.md
+ */
+export function Sparkline({ values, tone = "neutral", width = 108, height = 30, }) {
+    const min = Math.min(...values);
+    const max = Math.max(...values);
+    const span = max - min || 1;
+    const step = width / (values.length - 1);
+    const y = (v) => height - 2 - ((v - min) / span) * (height - 4);
+    const line = values.map((v, i) => `${i === 0 ? "M" : "L"}${i * step},${y(v)}`).join(" ");
+    const area = `${line} L${width},${height} L0,${height} Z`;
+    const t = toneOf(tone);
+    const stroke = tone === "neutral" || tone === "positive" ? neutral.muted : t.mark;
+    return (_jsxs("svg", { className: "w-full", height: height, viewBox: `0 0 ${width} ${height}`, preserveAspectRatio: "none", "aria-hidden": true, shapeRendering: "crispEdges", children: [_jsx("path", { d: area, style: { fill: t.bg } }), _jsx("path", { d: line, fill: "none", style: { stroke }, strokeWidth: "1.5", shapeRendering: "geometricPrecision" }), _jsx("rect", { x: width - 2.5, y: y(values[values.length - 1] ?? 0) - 2.5, width: "5", height: "5", style: { fill: stroke } }), _jsx("line", { x1: "0", y1: height, x2: width, y2: height, style: { stroke: neutral.line }, strokeWidth: "1" })] }));
+}

package/dist/components/spinner.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Bars — three uprights marching, echoing the stems in the wordmark and
+ * reading as a level meter, which is what this product measures.
+ */
+/**
+ * The accessible name is a REQUIRED prop, not a default (docs/08 rule 5 — primitives receive
+ * translated strings, they never fetch translations themselves). A default of "Close" is the
+ * worst of both worlds: it satisfies the compiler and ships English into every other language,
+ * silently, because nobody sees an aria-label until they are already using a screen reader.
+ */
+export declare function Spinner({ size, label }: {
+    size?: number;
+    label: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=spinner.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"spinner.d.ts","sourceRoot":"","sources":["../../src/components/spinner.tsx"],"names":[],"mappings":"AAEA;;;GAGG;AACH;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,EAAE,IAAS,EAAE,KAAK,EAAE,EAAE;IAAE,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,+BAwB7E"}

package/dist/components/spinner.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Bars — three uprights marching, echoing the stems in the wordmark and
+ * reading as a level meter, which is what this product measures.
+ */
+/**
+ * The accessible name is a REQUIRED prop, not a default (docs/08 rule 5 — primitives receive
+ * translated strings, they never fetch translations themselves). A default of "Close" is the
+ * worst of both worlds: it satisfies the compiler and ships English into every other language,
+ * silently, because nobody sees an aria-label until they are already using a screen reader.
+ */
+export function Spinner({ size = 16, label }) {
+    const w = Math.max(2.5, size * 0.22);
+    return (_jsx("span", { role: "status", "aria-label": label, className: "inline-flex items-end justify-between", style: { width: size, height: size }, children: [0, 1, 2].map((i) => (_jsx("span", { className: "tamga-spin-part", style: {
+                width: w,
+                height: "100%",
+                transformOrigin: "bottom",
+                background: "currentColor",
+                animation: `tamga-bar var(--duration-bar) var(--ease-breath) ${i * 140}ms infinite`,
+            } }, i))) }));
+}

package/dist/components/stacked-bar.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Yığılmış sütun grafiği — HER GÜN İÇİN HEM TOPLAM HEM KIRILIM.
+ *
+ * Gerekçe: docs/gerekce/03-grafik-ve-olcum.md
+ */
+export type StackSeries = {
+    name: string;
+    values: readonly number[];
+};
+export declare function StackedBarChart({ series, labels, height, formatValue, className, }: {
+    series: readonly StackSeries[];
+    /**
+     * The marks on the X axis; the same length as `series[n].values`. TR: X eksenindeki
+     * işaretler; `series[n].values` ile aynı uzunlukta.
+     */
+    labels: readonly string[];
+    height?: number;
+    formatValue?: (v: number) => string;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=stacked-bar.d.ts.map

package/dist/components/stacked-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stacked-bar.d.ts","sourceRoot":"","sources":["../../src/components/stacked-bar.tsx"],"names":[],"mappings":"AAKA;;;;GAIG;AAEH,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,SAAS,MAAM,EAAE,CAAC;CAC3B,CAAC;AASF,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,MAAM,EACN,MAAY,EACZ,WAAoB,EACpB,SAAS,GACV,EAAE;IACD,MAAM,EAAE,SAAS,WAAW,EAAE,CAAC;IAC/B;;;OAGG;IACH,MAAM,EAAE,SAAS,MAAM,EAAE,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAkHA"}

package/dist/components/stacked-bar.js

@@ -0,0 +1,41 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { cn } from "../lib/cn.js";
+/** Sayıyı ızgara çizgisine yuvarlar: 87 → 100, 412 → 500. */
+function niceMax(v) {
+    if (v <= 0)
+        return 1;
+    const mag = 10 ** Math.floor(Math.log10(v));
+    return Math.ceil(v / mag) * mag;
+}
+export function StackedBarChart({ series, labels, height = 260, formatValue = String, className, }) {
+    const [uzerinde, setUzerinde] = useState(null);
+    const toplamlar = labels.map((_, i) => series.reduce((n, s) => n + (s.values[i] ?? 0), 0));
+    const enBuyuk = niceMax(Math.max(0, ...toplamlar));
+    /* Dört ızgara çizgisi: daha fazlası okumayı kolaylaştırmıyor, zemini
+       kirletiyor. */
+    const cizgiler = [0, 0.25, 0.5, 0.75, 1].map((o) => enBuyuk * o);
+    return (_jsxs("figure", { className: cn("flex flex-col", className), children: [_jsxs("div", { className: "flex gap-3", style: { height }, children: [_jsx("div", { className: "flex shrink-0 flex-col justify-between py-1 text-right text-micro tabular-nums text-ink-faint", children: [...cizgiler].reverse().map((v) => (_jsx("span", { children: formatValue(v) }, v))) }), _jsxs("div", { className: "relative min-w-0 flex-1", onMouseLeave: () => setUzerinde(null), children: [cizgiler.map((v, i) => (_jsx("span", { "aria-hidden": true, className: "absolute inset-x-0 h-px bg-[var(--color-line)]", style: { bottom: `${(i / (cizgiler.length - 1)) * 100}%` } }, v))), _jsx("div", { className: "absolute inset-0 flex items-end gap-1", children: labels.map((etiket, i) => {
+                                    const toplam = toplamlar[i] ?? 0;
+                                    const secili = uzerinde === i;
+                                    return (_jsxs("div", { className: "flex h-full min-w-0 flex-1 cursor-default flex-col justify-end", onMouseEnter: () => setUzerinde(i), children: [[...series].reverse().map((s, ri) => {
+                                                const si = series.length - 1 - ri;
+                                                const v = s.values[i] ?? 0;
+                                                if (v <= 0)
+                                                    return null;
+                                                return (_jsx("span", { className: "w-full transition-opacity duration-(--duration-press)", style: {
+                                                        height: `${(v / enBuyuk) * 100}%`,
+                                                        background: `var(--color-chart-${(si % 5) + 1})`,
+                                                        opacity: uzerinde === null || secili ? 1 : 0.45,
+                                                    } }, s.name));
+                                            }), secili && toplam > 0 && (_jsx("span", { className: "pointer-events-none absolute -translate-y-full whitespace-nowrap rounded-(--radius-mark) bg-[var(--color-ink)] px-1.5 py-0.5 text-micro tabular-nums text-[var(--color-page)]", style: { bottom: `${(toplam / enBuyuk) * 100}%` }, children: formatValue(toplam) }))] }, etiket));
+                                }) })] })] }), _jsx("div", { className: "mt-2 flex gap-1 text-micro tabular-nums text-ink-faint", children: labels.map((e, i) => {
+                    const aralik = Math.max(1, Math.ceil(labels.length / 12));
+                    const yaz = i === 0 || i === labels.length - 1 || i % aralik === 0;
+                    return (_jsx("span", { className: "min-w-0 flex-1 truncate text-center", children: yaz ? e : "" }, e));
+                }) }), _jsx("figcaption", { className: "mt-3 flex flex-wrap gap-x-5 gap-y-1", children: series.map((s, i) => {
+                    const v = uzerinde !== null ? (s.values[uzerinde] ?? 0) : s.values.reduce((a, b) => a + b, 0);
+                    return (_jsxs("span", { className: "flex items-center gap-2 text-small text-ink-soft", children: [_jsx("span", { "aria-hidden": true, className: "size-2.5 rounded-(--radius-mark)", style: { background: `var(--color-chart-${(i % 5) + 1})` } }), s.name, _jsx("span", { className: "font-mono tabular-nums text-ink", children: formatValue(v) })] }, s.name));
+                }) })] }));
+}

package/dist/components/surface.d.ts

@@ -0,0 +1,76 @@
+import type { ReactNode } from "react";
+/**
+ * YÜZEYLER — kart, tablo, sessiz etiket.
+ *
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
+ */
+/**
+ * Kart — kitin tek yükseltilmiş yüzeyi.
+ *
+ * 1px kenar + 2px sert offset (Yasa 1). İçindeki her şey `Gutter`ın ritmini
+ * paylaşır, böylece iki kart yan yana geldiğinde iç boşlukları hizalanır.
+ */
+export declare function Card({ overflow, children, className, }: {
+    /**
+     * Whether the card's content may spill past its edge. `clip` by default, because the card's
+     * rounded corners depend on it: a table inside would run out of the corners without clipping.
+     * BUT THE SAME CLIP CUTS EVERY PANEL THAT OPENS INSIDE THE CARD: a Combobox list, a
+     * DatePicker calendar, a row menu. The panel works and takes clicks, but half of it is
+     * invisible; and because nothing errors, the first suspect is z-index. Z-index does not fix
+     * this: no stacking order beats an `overflow` clip. Pass `visible` when a control inside
+     * opens something. TR: Kartın içeriği kenarından taşabilir mi. Varsayılan `clip`, çünkü
+     * kartın köşe yuvarlaması ona bağlı: içindeki bir tablo, kırpma olmadan köşelerden dışarı
+     * taşar. AMA AYNI KIRPMA, KARTIN İÇİNDE AÇILAN HER PANELİ KESER: bir Combobox listesi, bir
+     * DatePicker takvimi, bir satır menüsü. Panel çalışır, tıklanır, ama yarısı görünmez; ve hata
+     * vermediği için sebebi aranırken ilk akla gelen z-index olur. Z-index bunu çözmez: hiçbir
+     * yığın sırası bir `overflow` kırpmasını aşamaz. İçinde açılır bir kontrol varsa `visible`
+     * ver.
+     */
+    overflow?: "clip" | "visible";
+    children: ReactNode;
+    className?: string;
+}): import("react").JSX.Element;
+/**
+ * Kart başlığı — başlık solda, eylem sağda, ikisi aynı taban çizgisinde.
+ *
+ * Eylemin yeri tartışmaya kapalı: üründeki her satır kontrolünü sağda tutar,
+ * ve başka yere koyan bir başlık listeden kopmuş görünür.
+ */
+export declare function CardHead({ children, action, className, }: {
+    children: ReactNode;
+    action?: ReactNode;
+    className?: string;
+}): import("react").JSX.Element;
+/** Kart gövdesi — başlıkla aynı yatay ritim, kendi dikey nefesi. */
+export declare function CardBody({ children, className }: {
+    children: ReactNode;
+    className?: string;
+}): import("react").JSX.Element;
+/**
+ * Tablo.
+ *
+ * `overflow-x` sarmalayıcısı bileşenin İÇİNDE, çünkü dar bir ekranda taşan bir
+ * tablo tüm sayfayı yana kaydırır — ve bunu unutmak, unutulduğu yerde fark
+ * edilmeyen bir hatadır.
+ */
+export declare function Table({ children, className }: {
+    children: ReactNode;
+    className?: string;
+}): import("react").JSX.Element;
+/**
+ * Sessiz etiket — bir başlığın yanındaki ya da bir grubun üstündeki meta satır.
+ *
+ * Form etiketi DEĞİLDİR: bir kontrolü adlandırmaz, bir şeyi niteler
+ * (`p95 · 24h`, `10 kontrol`). Form etiketi için `Field` kullan — o `htmlFor`
+ * bağını da kurar.
+ */
+export declare function Label({ children, mono, className, }: {
+    children: ReactNode;
+    /**
+     * Identifier-shaped text (codes, SKUs) keeps the mono face. TR: Tanımlayıcı biçimli metinler
+     * (kodlar, SKU) mono yüzü korur.
+     */
+    mono?: boolean;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=surface.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"surface.d.ts","sourceRoot":"","sources":["../../src/components/surface.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC;;;;GAIG;AAEH;;;;;GAKG;AACH,wBAAgB,IAAI,CAAC,EACnB,QAAiB,EACjB,QAAQ,EACR,SAAS,GACV,EAAE;IACD;;;;;;;;;;;;;;OAcG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAMA;AAED;;;;;GAKG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,MAAM,EACN,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAOA;AAED,oEAAoE;AACpE,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAE5F;AAED;;;;;;GAMG;AACH,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,+BAMzF;AAED;;;;;;GAMG;AACH,wBAAgB,KAAK,CAAC,EACpB,QAAQ,EACR,IAAY,EACZ,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAEA"}

package/dist/components/surface.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn.js";
+/**
+ * YÜZEYLER — kart, tablo, sessiz etiket.
+ *
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
+ */
+/**
+ * Kart — kitin tek yükseltilmiş yüzeyi.
+ *
+ * 1px kenar + 2px sert offset (Yasa 1). İçindeki her şey `Gutter`ın ritmini
+ * paylaşır, böylece iki kart yan yana geldiğinde iç boşlukları hizalanır.
+ */
+export function Card({ overflow = "clip", children, className, }) {
+    return (_jsx("div", { className: cn("tamga-card", overflow === "visible" && "tamga-card-open", className), children: children }));
+}
+/**
+ * Kart başlığı — başlık solda, eylem sağda, ikisi aynı taban çizgisinde.
+ *
+ * Eylemin yeri tartışmaya kapalı: üründeki her satır kontrolünü sağda tutar,
+ * ve başka yere koyan bir başlık listeden kopmuş görünür.
+ */
+export function CardHead({ children, action, className, }) {
+    return (_jsxs("div", { className: cn("tamga-head tamga-gutter tamga-section", className), children: [children, action ? _jsx("span", { className: "ml-auto", children: action }) : null] }));
+}
+/** Kart gövdesi — başlıkla aynı yatay ritim, kendi dikey nefesi. */
+export function CardBody({ children, className }) {
+    return _jsx("div", { className: cn("tamga-gutter py-6", className), children: children });
+}
+/**
+ * Tablo.
+ *
+ * `overflow-x` sarmalayıcısı bileşenin İÇİNDE, çünkü dar bir ekranda taşan bir
+ * tablo tüm sayfayı yana kaydırır — ve bunu unutmak, unutulduğu yerde fark
+ * edilmeyen bir hatadır.
+ */
+export function Table({ children, className }) {
+    return (_jsx("div", { className: "w-full overflow-x-auto", children: _jsx("table", { className: cn("tamga-table", className), children: children }) }));
+}
+/**
+ * Sessiz etiket — bir başlığın yanındaki ya da bir grubun üstündeki meta satır.
+ *
+ * Form etiketi DEĞİLDİR: bir kontrolü adlandırmaz, bir şeyi niteler
+ * (`p95 · 24h`, `10 kontrol`). Form etiketi için `Field` kullan — o `htmlFor`
+ * bağını da kurar.
+ */
+export function Label({ children, mono = false, className, }) {
+    return _jsx("span", { className: cn("tamga-label", mono && "font-mono", className), children: children });
+}

package/dist/components/switch.d.ts

@@ -0,0 +1,12 @@
+export declare function Switch({ on, onChange, label, disabled, className, }: {
+    on: boolean;
+    onChange?: (next: boolean) => void;
+    /**
+     * The accessible name. There is no text inside a switch; without it, it is nameless. TR:
+     * Erişilebilir ad. Anahtarın içinde metin yoktur; onsuz adsızdır.
+     */
+    label: string;
+    disabled?: boolean;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=switch.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAWA,wBAAgB,MAAM,CAAC,EACrB,EAAE,EACF,QAAQ,EACR,KAAK,EACL,QAAgB,EAChB,SAAS,GACV,EAAE;IACD,EAAE,EAAE,OAAO,CAAC;IACZ,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAqBA"}

package/dist/components/switch.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../lib/cn.js";
+import { OFF } from "./control-base.js";
+/* ---------------------------------------------------------------- *
+ * Switch — akranlar arası seçim DEĞİL, açık/kapalı durumu.
+ *
+ * Dolgu burada Yasa 2'nin üçüncü bilinçli istisnası: dolu iz metaforun
+ * kendisidir, bir devrenin kapalı olması demektir.
+ * ---------------------------------------------------------------- */
+export function Switch({ on, onChange, label, disabled = false, className, }) {
+    return (_jsx("button", { type: "button", role: "switch", "aria-checked": on, "aria-label": label, "aria-disabled": disabled || undefined, disabled: disabled, onClick: () => !disabled && onChange?.(!on), className: cn("tamga-switch", className), "data-on": on, style: disabled ? OFF : undefined, children: _jsx("span", { "aria-hidden": true }) }));
+}

package/dist/components/tabs.d.ts

@@ -0,0 +1,47 @@
+import type { ReactNode } from "react";
+/**
+ * Sekme şeridi.
+ *
+ * Gerekçe: docs/gerekce/05-yuzey-ve-kabuk.md
+ */
+export type TabItem<T extends string> = {
+    value: T;
+    label: ReactNode;
+    icon?: ReactNode;
+    /** Verilirse sekme bir BAĞLANTI olur ve şerit bir gezinme alanına döner. */
+    href?: string;
+    /**
+     * Sekme YERİNDE ama henüz gidilemiyor.
+     *
+     * NEDEN GİZLEMEK YERİNE KAPATMAK. "Önce kaydet, sonra zenginleştir"
+     * akışında bir kayıt doğmadan fotoğrafı ya da kategorisi olamaz. Sekmeleri
+     * o ana kadar gizlemek, kaydettikten sonra ekranın altından dört yeni
+     * sekme çıkması demek; kullanıcı ne kazandığını değil neyin değiştiğini
+     * anlamaya çalışıyor. Kapalı sekme yapılacak işin ŞEKLİNİ baştan
+     * gösteriyor.
+     *
+     * Kapalı sekme bir bağlantı DEĞİL: `<a>` üretmiyor, o yüzden sağ tıklayıp
+     * yeni sekmede açılabilen ölü bir adres de bırakmıyor.
+     */
+    disabled?: boolean;
+};
+export declare function Tabs<T extends string>({ items, value, onChange, label, scroll, linkAs, className, }: {
+    items: readonly TabItem<T>[];
+    value: T;
+    onChange?: (next: T) => void;
+    /** The tab strip's accessible name. TR: Sekme şeridinin erişilebilir adı. */
+    label: string;
+    /**
+     * Scroll the tabs horizontally when they do not fit; no wrapping. TR: Sekmeler sığmıyorsa
+     * yatay kaydır; sarma yok.
+     */
+    scroll?: boolean;
+    /**
+     * The link component, such as Next.js's `Link`. Left out, a plain `<a>`. The kit knows no
+     * router, so the caller supplies one. TR: Bağlantı bileşeni: Next.js'in `Link`i gibi.
+     * Verilmezse düz `<a>`. Kit bir yönlendirici tanımıyor, o yüzden çağıran veriyor.
+     */
+    linkAs?: React.ElementType;
+    className?: string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=tabs.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC;;;;GAIG;AAEH,MAAM,MAAM,OAAO,CAAC,CAAC,SAAS,MAAM,IAAI;IACtC,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,4EAA4E;IAC5E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;;;;;;OAYG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,wBAAgB,IAAI,CAAC,CAAC,SAAS,MAAM,EAAE,EACrC,KAAK,EACL,KAAK,EACL,QAAQ,EACR,KAAK,EACL,MAAc,EACd,MAAM,EACN,SAAS,GACV,EAAE;IACD,KAAK,EAAE,SAAS,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;IAC7B,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,6EAA6E;IAC7E,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BA4DA"}

package/dist/components/tabs.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn.js";
+export function Tabs({ items, value, onChange, label, scroll = false, linkAs, className, }) {
+    const kap = cn("flex gap-6 border-b border-[var(--color-line)]", scroll && "overflow-x-auto", className);
+    const bagliMi = items.some((t) => t.href);
+    const A = linkAs ?? "a";
+    if (bagliMi) {
+        return (_jsx("nav", { "aria-label": label, className: kap, children: items.map((t) => t.disabled ? (_jsxs("span", { "aria-disabled": "true", className: cn("tamga-tab", scroll && "shrink-0"), "data-disabled": "true", children: [t.icon, t.label] }, t.value)) : (_jsxs(A, { href: t.href, className: cn("tamga-tab", scroll && "shrink-0"), "data-active": value === t.value, "aria-current": value === t.value ? "page" : undefined, children: [t.icon, t.label] }, t.value))) }));
+    }
+    return (_jsx("div", { role: "tablist", "aria-label": label, className: kap, children: items.map((t) => (_jsxs("button", { type: "button", role: "tab", "aria-selected": value === t.value, disabled: t.disabled, className: cn("tamga-tab", scroll && "shrink-0"), "data-active": value === t.value, "data-disabled": t.disabled || undefined, onClick: () => onChange?.(t.value), children: [t.icon, t.label] }, t.value))) }));
+}

package/dist/components/timeline-strip.d.ts

@@ -0,0 +1,19 @@
+import { type Tone } from "./tone.js";
+/**
+ * TimelineStrip — kova başına bir işaret, renk durumu taşır.
+ *
+ * Gerekçe: docs/gerekce/02-veri-ve-liste.md
+ */
+export declare function TimelineStrip({ data, height, gap, minWidth, 
+/** Şeridin iki ucundaki zaman etiketi — "90 gün önce" · "bugün". */
+labels, 
+/** Her kovanın erişilebilir açıklaması. Kit çeviri çekmez. */
+describe, }: {
+    data: readonly Tone[];
+    height?: number;
+    gap?: number;
+    minWidth?: number;
+    labels?: [string, string];
+    describe?: (index: number, tone: Tone) => string;
+}): import("react").JSX.Element;
+//# sourceMappingURL=timeline-strip.d.ts.map

package/dist/components/timeline-strip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"timeline-strip.d.ts","sourceRoot":"","sources":["../../src/components/timeline-strip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,IAAI,EAAE,MAAM,WAAW,CAAC;AAE9C;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC5B,IAAI,EACJ,MAAW,EACX,GAAO,EACP,QAAY;AACZ,oEAAoE;AACpE,MAAM;AACN,8DAA8D;AAC9D,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,SAAS,IAAI,EAAE,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;CAClD,+BAqBA"}

package/dist/components/timeline-strip.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { toneOf } from "./tone.js";
+/**
+ * TimelineStrip — kova başına bir işaret, renk durumu taşır.
+ *
+ * Gerekçe: docs/gerekce/02-veri-ve-liste.md
+ */
+export function TimelineStrip({ data, height = 32, gap = 2, minWidth = 3, 
+/** Şeridin iki ucundaki zaman etiketi — "90 gün önce" · "bugün". */
+labels, 
+/** Her kovanın erişilebilir açıklaması. Kit çeviri çekmez. */
+describe, }) {
+    return (_jsxs("div", { children: [_jsx("div", { className: "flex items-end", style: { gap }, children: data.map((tone, i) => (_jsx("span", { title: describe?.(i, tone), className: "flex-1 transition-opacity hover:opacity-60", style: { height, minWidth, background: toneOf(tone).mark } }, i))) }), labels ? (_jsxs("div", { className: "mt-2 flex justify-between", children: [_jsx("span", { className: "font-mono text-micro text-ink-faint", children: labels[0] }), _jsx("span", { className: "font-mono text-micro text-ink-faint", children: labels[1] })] })) : null] }));
+}

package/dist/components/tone.d.ts

@@ -0,0 +1,58 @@
+/**
+ * The tone scale — layer 3 of the palette.
+ *
+ * Gerekçe: docs/gerekce/06-isaret-ve-ton.md
+ */
+/** What a tone paints. */
+export type ToneStyle = {
+    /** text + border colour for chips and labels */
+    fg: string;
+    /** solid mark: dots, bars, spines, chart marks */
+    mark: string;
+    /** chip / cell wash */
+    bg: string;
+};
+/**
+ * Four roles, and nothing outside them.
+ *
+ * `neutral` is the one that carries meaning by NOT carrying colour: a grey row
+ * says "this is not reporting" on its own. That only works while it stays the
+ * single uncoloured state — which is why healthy is green here rather than
+ * neutral, a deliberate reversal recorded in the product's design notes.
+ */
+export type Tone = "neutral" | "positive" | "caution" | "danger";
+export declare const tones: Record<Tone, ToneStyle>;
+export declare function toneOf(tone: Tone): ToneStyle;
+/**
+ * How loudly a tone asks for the screen's single pulse (see live-scope).
+ *
+ * `null` means "never pulses". Only `danger` breathes, and the reasoning is the
+ * same in every domain the kit serves: too few signals is a smaller failure
+ * than a signal that has stopped meaning anything. `caution` already carries
+ * its own colour; the pulse stays reserved for "look here, now".
+ *
+ * A product that ranks its own states more finely passes an explicit rank
+ * instead — this is the DEFAULT, not the policy.
+ */
+export declare const TONE_RANK: Record<Tone, number | null>;
+export declare function rankOf(tone: Tone, override?: number | null): number | null;
+/** Layer 1 — neutral ramp, for anything that is not reporting a state. */
+export declare const neutral: {
+    page: string;
+    surface: string;
+    hover: string;
+    chartFill: string;
+    line: string;
+    edge: string;
+    lineStrong: string;
+    muted: string;
+    body: string;
+    title: string;
+};
+/** Layer 2 — interaction only. */
+export declare const accent: {
+    fg: string;
+    bg: string;
+    ink: string;
+};
+//# sourceMappingURL=tone.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"tone.d.ts","sourceRoot":"","sources":["../../src/components/tone.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,0BAA0B;AAC1B,MAAM,MAAM,SAAS,GAAG;IACtB,gDAAgD;IAChD,EAAE,EAAE,MAAM,CAAC;IACX,kDAAkD;IAClD,IAAI,EAAE,MAAM,CAAC;IACb,uBAAuB;IACvB,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,MAAM,IAAI,GAAG,SAAS,GAAG,UAAU,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEjE,eAAO,MAAM,KAAK,EAAE,MAAM,CAAC,IAAI,EAAE,SAAS,CAsBzC,CAAC;AAEF,wBAAgB,MAAM,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,CAE5C;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAKjD,CAAC;AAEF,wBAAgB,MAAM,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAE1E;AAED,0EAA0E;AAC1E,eAAO,MAAM,OAAO;IAClB,IAAI;IACJ,OAAO;IACP,KAAK;IACL,SAAS;IACT,IAAI;IACJ,IAAI;IACJ,UAAU;IACV,KAAK;IACL,IAAI;IACJ,KAAK;CACN,CAAC;AAEF,kCAAkC;AAClC,eAAO,MAAM,MAAM;IACjB,EAAE;IACF,EAAE;IACF,GAAG;CACJ,CAAC"}