@kolkrabbi/kol-theme 0.77.0 → 0.78.0

package/kol-components-molecules.css

@@ -1286,3 +1286,31 @@
   margin-inline: auto;
   padding: 24px;
 }
+
+/* ─────────────────────────────────────────────────────────────────────
+ * TONE — inverse (ControlToneInverse, kol-website 2026-08-27; user on brand's
+ * /icons over a `pageWash` of fg-04: "a flipped version of this color scheme,
+ * where the darker is background and grey is the active … it would fit better
+ * on the light grey" — "that would also need to be a variant for the dropdown
+ * and the input" — "the active grey can be lighter"). On a washed plane the
+ * default grey well reads as a second plate. `tone="inverse"` on ViewToggle
+ * (icon) · Dropdown · Input · SearchInput stamps `.kol-tone-inverse`; the rules
+ * live HERE, after every default they out-rank, so a consumer never restates
+ * them (brand's stopgap did).
+ *
+ * The chip is `fg-absolute-24` — theme-invariant black, as the icon well's
+ * active state already was — so it darkens on either theme; the active chip
+ * takes the lighter grey (surface-tertiary); a dark well wants a LIGHTER hover,
+ * so the inactive hover is an absolute-white wash.
+ * ───────────────────────────────────────────────────────────────────── */
+.kol-view-toggle.kol-tone-inverse { background-color: var(--kol-fg-absolute-24); }
+.kol-view-toggle.kol-tone-inverse > button[aria-pressed="true"] { background-color: var(--kol-surface-tertiary); }
+.kol-view-toggle.kol-tone-inverse > button:not([aria-pressed="true"]):hover { background-color: color-mix(in srgb, var(--kol-color-absolute-white) 8%, transparent); }
+.kol-control.kol-tone-inverse { background-color: var(--kol-fg-absolute-24); }
+.kol-expand.kol-tone-inverse { background-color: var(--kol-fg-absolute-24); }
+/* the trigger: rest and open are its only states — the pin-back rules above
+ * paint surface-secondary on hover/active, so the inverse pins its own chip */
+.kol-dd-trigger.kol-tone-inverse,
+.kol-dd-trigger.kol-tone-inverse:not(:disabled):hover,
+.kol-dd-trigger.kol-tone-inverse:not(:disabled):active { background-color: var(--kol-fg-absolute-24); }
+.kol-dd-panel.kol-tone-inverse { background-color: var(--kol-fg-absolute-24); }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolkrabbi/kol-theme",
-  "version": "0.77.0",
+  "version": "0.78.0",
   "description": "KOL (Kolkrabbi) design-system tokens + base CSS — brand-neutral. The canonical token/cascade layer every other KOL package and consumer builds on.",
   "license": "MIT",
   "type": "module",