tamga-ui 0.5.1 → 0.5.2

package/CHANGELOG.md

@@ -5,6 +5,38 @@ Versions follow [semver](https://semver.org/). Through `0.x`, breaking changes m
 
 > 🇹🇷 Türkçe için [tamga.org.tr/tr](https://tamga.org.tr/tr).
 
+## 0.5.2
+
+> A light palette takes the brand's hue, and two things a pointer could feel: a checkbox
+> that flickered under hover and a two-line label that centred itself.
+
+### Fixed
+
+- **`Checkbox` no longer centres a two-line label.** It renders a `<button>`, and a browser centres
+  button text; every other choice surface in the kit already neutralises that (`RadioGroup`'s list
+  look, `.tamga-choice-card`), this one did not. A one-word label never showed it; a label with a
+  description under it did.
+
+## Unreleased
+
+### Changed
+
+- **A light palette now carries the brand's hue.** `makePalette` fixed every light surface at hue
+  90 — `page`, `shell`, `rail`, `hover`, `sunk`, `line`, `div` were the same warm paper whatever the
+  brand, while the dark half breathed in the brand's hue. Only the HUE moves: the lightness steps
+  and the chroma ceiling are untouched, so the contrast that makes a panel comfortable to read is
+  the same number it was (measured: ink over page stays above 15). The warm-brand guard still holds
+  a red or orange brand at the paper hue, because a surface pulled toward those reads as dirty
+  rather than tinted.
+
+### Fixed
+
+- **A hovered checkbox no longer flickers.** The box lifts a pixel on hover, and the hover target
+  was the box itself: a pointer resting on its lower or right edge lost the box as it moved, the
+  hover ended, the box came back, the hover started again — a loop that does not stop, because the
+  pointer never moved. Hover now belongs to the wrapping control, which does not move. The label
+  lights the box too, which is where a checkbox's hit area always was.
+
 ## 0.5.1
 
 > Three corrections the 0.5.0 port left behind: a menu that stole the page's scroll, and the

package/dist/components/checkbox.js

@@ -12,5 +12,5 @@ import { Check, Minus } from "./icons.js";
  * offsetini taşır, böylece kontrol ailesinin bir üyesi gibi okunur.
  * ---------------------------------------------------------------- */
 export function Checkbox({ label, checked, indeterminate = false, onChange, disabled = false, className, compact = false, ...rest }) {
-    return (_jsxs("button", { ...dataProps(rest), type: "button", role: "checkbox", "aria-checked": indeterminate ? "mixed" : checked, "aria-disabled": disabled || undefined, disabled: disabled, onClick: () => !disabled && onChange?.(!checked), className: cn("flex items-center gap-2 text-body", disabled && "text-ink-faint", className), children: [_jsx("span", { className: cn("tamga-check", compact && "tamga-check-sm"), "data-checked": (checked || indeterminate) && !disabled, "data-off": disabled || undefined, children: indeterminate ? (_jsx(Icon, { icon: Minus, size: "xs", weight: "bold" })) : checked ? (_jsx(Icon, { icon: Check, size: "xs", weight: "bold" })) : null }), label] }));
+    return (_jsxs("button", { ...dataProps(rest), type: "button", role: "checkbox", "aria-checked": indeterminate ? "mixed" : checked, "aria-disabled": disabled || undefined, disabled: disabled, onClick: () => !disabled && onChange?.(!checked), className: cn("flex items-center gap-2 text-left text-body", disabled && "text-ink-faint", className), children: [_jsx("span", { className: cn("tamga-check", compact && "tamga-check-sm"), "data-checked": (checked || indeterminate) && !disabled, "data-off": disabled || undefined, children: indeterminate ? (_jsx(Icon, { icon: Minus, size: "xs", weight: "bold" })) : checked ? (_jsx(Icon, { icon: Check, size: "xs", weight: "bold" })) : null }), label] }));
 }

package/dist/fonts.css

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

package/dist/kit.css

@@ -1,4 +1,4 @@
-/*! tamga-ui 0.5.1 · MIT · https://tamga.org.tr */
+/*! tamga-ui 0.5.2 · MIT · https://tamga.org.tr */
 :root {
 
   --overlay-gap: 8px;
@@ -2355,7 +2355,6 @@
     border-radius: var(--radius-chip);
     box-shadow: none;
   }
-  .tamga-check-sm:hover,
   .tamga-check-sm[data-checked="true"] {
     transform: none;
     box-shadow: none;
@@ -2375,13 +2374,8 @@
     cursor: default;
   }
 
-  .tamga-check[data-off]:hover, .tamga-radio[data-off]:hover {
-    border-color: var(--color-edge);
-    transform: none;
-    box-shadow: none;
-  }
-
-  .tamga-check:hover, .tamga-radio:hover {
+  :where(button, label):hover
+    :is(.tamga-check, .tamga-radio):not([data-off]):not(.tamga-check-sm) {
     border-color: var(--color-accent-line);
     transform: translate(-1px, -1px);
     box-shadow: 3px 3px 0 var(--color-accent-line);

package/dist/lib/palette.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"palette.d.ts","sourceRoot":"","sources":["../../src/lib/palette.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAA0B,QAAQ,EAAc,MAAM,YAAY,CAAC;AAEpG;;;;;;;;GAQG;AAEH,qFAAqF;AACrF,MAAM,MAAM,OAAO,GAAG;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,8EAA8E;IAC9E,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,0EAA0E;IAC1E,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,wEAAwE;IACxE,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IAAE,KAAK,EAAE,OAAO,CAAC;IAAC,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAyL5D;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,WAAW,CAIzD;AAMD,OAAO,EAAE,KAAK,EAAE,CAAC;AAIjB,+BAA+B;AAC/B,MAAM,MAAM,WAAW,GAAG;IACxB,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,qDAAqD;IACrD,IAAI,EAAE,UAAU,GAAG,QAAQ,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAAE,OAAO,GAAG,WAAW,EAAE,CA8BxD;AAoBD;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAI9D;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,WAAW,GAAG,MAAM,CAMpD;AAED,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"palette.d.ts","sourceRoot":"","sources":["../../src/lib/palette.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAA0B,QAAQ,EAAc,MAAM,YAAY,CAAC;AAEpG;;;;;;;;GAQG;AAEH,qFAAqF;AACrF,MAAM,MAAM,OAAO,GAAG;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,8EAA8E;IAC9E,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,0EAA0E;IAC1E,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,wEAAwE;IACxE,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IAAE,KAAK,EAAE,OAAO,CAAC;IAAC,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AA4L5D;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,WAAW,CAIzD;AAMD,OAAO,EAAE,KAAK,EAAE,CAAC;AAIjB,+BAA+B;AAC/B,MAAM,MAAM,WAAW,GAAG;IACxB,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,qDAAqD;IACrD,IAAI,EAAE,UAAU,GAAG,QAAQ,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAAE,OAAO,GAAG,WAAW,EAAE,CA8BxD;AAoBD;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAI9D;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,WAAW,GAAG,MAAM,CAMpD;AAED,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC"}

package/dist/lib/palette.js

@@ -14,13 +14,13 @@ import { lightness, deltaL, isHex, hexToOklch, oklchToHex, contrast } from "./co
 const REFERANS_MARKA = { l: 0.49, c: 0.2158, h: 264.4 };
 const BASAMAK = {
     light: {
-        page: { l: 0.961, c: 0.0083, k: "sabit" },
-        shell: { l: 0.997, c: 0.0041, k: "sabit" },
-        rail: { l: 0.925, c: 0.0112, k: "sabit" },
-        hover: { l: 0.970, c: 0.0082, k: "sabit" },
-        sunk: { l: 0.898, c: 0.0142, k: "sabit" },
-        line: { l: 0.861, c: 0.0156, k: "sabit" },
-        div: { l: 0.904, c: 0.0129, k: "sabit" },
+        page: { l: 0.961, c: 0.0083, k: "kisitli" },
+        shell: { l: 0.997, c: 0.0041, k: "kisitli" },
+        rail: { l: 0.925, c: 0.0112, k: "kisitli" },
+        hover: { l: 0.970, c: 0.0082, k: "kisitli" },
+        sunk: { l: 0.898, c: 0.0142, k: "kisitli" },
+        line: { l: 0.861, c: 0.0156, k: "kisitli" },
+        div: { l: 0.904, c: 0.0129, k: "kisitli" },
         edge: { l: 0.834, c: 0.0154, k: "kisitli" },
         edgeHover: { l: 0.677, c: 0.0340, k: "kisitli" },
         edgeStrong: { l: 0.241, c: 0.0635, k: "tam" },
@@ -30,7 +30,7 @@ const BASAMAK = {
         inkFaint: { l: 0.460, c: 0.0476, k: "kisitli" },
         navIdle: { l: 0.241, c: 0.0635, k: "tam" },
         navHover: { l: 0.241, c: 0.0635, k: "tam" },
-        navHoverBg: { l: 0.997, c: 0.0041, k: "sabit" },
+        navHoverBg: { l: 0.997, c: 0.0041, k: "kisitli" },
     },
     dark: {
         page: { l: 0.218, c: 0.0385, k: "kisitli" },
@@ -60,11 +60,13 @@ const BASAMAK = {
         navHoverBg: { l: 0.257, c: 0.0473, k: "kisitli" },
     },
 };
-/** Açık temanın sabit kâğıtları: tonu 78, markadan bağımsız. */
+/** Sıcak markada kâğıdın kaçtığı ton. */
 const KAGIT_TONU = 78;
+/* AÇIK YÜZEYLER DE MARKADAN TON ALIYOR. Kâğıtlar `h: 90`da sabitti: seçilen renk ne olursa
+   olsun ray, zemin ve kartlar aynı sıcak griydi, oysa koyu tema markanın tonunda nefes
+   alıyordu. Değişen yalnız TON · parlaklık ve doyum tavanı aynı kaldığı için kontrast ve
+   göz konforu yerinde duruyor (ölçüldü: mürekkep/zemin 15.5+). */
 function notrUret(b, marka, koyu) {
-    if (b.k === "sabit")
-        return oklchToHex({ l: b.l, c: b.c, h: 90 });
     const oran = Math.max(0.12, Math.min(1.4, marka.c / REFERANS_MARKA.c));
     const tavan = koyu ? 0.02 : 0.022;
     let c = b.k === "tam" ? b.c * oran : Math.min(b.c * oran, tavan);

package/dist/styles.css

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

package/dist/theme.css

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tamga-ui",
-  "version": "0.5.1",
+  "version": "0.5.2",
   "description": "Mant\u0131ksal's shared interface library: tokens, physics and components.",
   "license": "MIT",
   "type": "module",